Thursday, August 10, 2006

இணையதள அலங்காரம்

Style என்கிற ஆங்கில வார்த்தையைக் காட்டிலும் அலங்காரம் என்ற சொல்லுக்கு எவ்வளவு ஈர்ப்பு. அட! அப்படியே சொக்கி போய் விடாதீர்கள். மேலே படியுங்கள்.
 
சில இணையதளங்கள் நிறைய விடயங்களை உள்ளடக்கியிருக்கும், மிகவும் பயனுள்ளதாகவும், இருக்கும். ஆனால் அதன் பக்கங்களின் வண்ணம் நம்மை ஈர்க்காது மாறாக சில நேரங்களில் எரிச்சல் கூட ஏற்படுத்தும்.
 
அதே போல சிலர் தங்கள் தளங்களின் ஒவ்வொரு பக்கத்திற்கும் ஒவ்வொரு விதமான வண்ணம் தீட்டியிருப்பார்கள் (அதை அவர்கள் விரும்பினாலும் அது தரத்தை பாதிக்கும் என்பதை அறிவதில்லை.)
 
 
CSS - Cascading Style Sheet:
 
ஆரம்ப கட்டத்தில் microsoftம் நெட்ஸ்கேப்ம் இணைய தளங்களை அலங்கரிப்பதற்கு என்று சில html குறிச்சொற்களை (tags) போட்டி போட்டுக்கொண்டு அறிமுகம் செய்யத்துவங்கின. இது பல்வேறு சிக்கல்களை ஏற்படுத்தியது. இதனைப்போக்க W3C கன்சார்டோரியம் அறிமுகப்படுத்தியது தான் Styles.
 
html குறிச்சொற்களில் style என்கிற பண்பை(அட்ரிப்யூட்ஸ்) பார்த்திருப்பீர்கள். அதன் உள்ளே, background, margin, color, font,align... போன்ற சொற்கள் பயன் படுத்தியிருக்கவும் பார்த்திருப்பீர்கள். இவைகள் தான் தளத்தின் அழகையும் அமைப்பையும் ஒருநிலைப்படுத்த உதவுகின்றன.
 
css file ஏன்?
 
உங்கள் இணையதளம் சுமார் 1000 பக்கங்களை கொண்டிருக்கிறது என்று வைத்துக்கொள்வோம், இப்பொழுது நீங்கள் ஒவ்வொரு பக்கத்திலும், ஒவ்வொரு பாராவிற்கும் font பெயர் முதல் அதன் அளவு, வண்ணம் போன்றவை கொடுக்கவேண்டும். முக்கிய சில பத்திகள் சிகப்பாகவும், தடியாகவும் இருக்கவேண்டும், சில சாதாரணமாய் இருக்கவேண்டும்,  இது எல்லா பக்கங்களிலும் ஒரே மாதிரியாக இருக்கவேண்டும்.
 
1000 பக்கத்திற்கு மேல் வருகிற எல்லா பக்கத்திற்கும் இதை தொடரவேண்டும்.
 
இப்பொழுது நீங்கள் என்ன செய்யப்போகிறீர்கள், (உதா.) <p> tag உள்ளே சென்று style="font-face:theneeUniTx;size:10;color:green" என்றும்  style="font-face:theneeUniTx;size:10;color:red" சேர்த்துக்கொண்டிருக்கப்போகிறீர்களா?
 
வேண்டவே வேண்டாம் இந்த style 'களை ஒருமுறை நீங்கள் ஒரு .css type கோப்பு ஒன்றில் சேமித்து வைத்து பின் அந்த கோப்பை எல்லா பக்கங்களிலும் உள்ள <head> </head> இடையே < LINK href="filename.css" type =text/css rel=STYLESHEET> இட்டால்போதுமானது.
 
அத்துடன் உங்களுக்கு தேவைப்படும் styleகளை  தேவைப்படும் tag (<p>, <div>,<span> etc...) களில் உள்ளே class="stylename" என்று போட்டால் போதுமானது. அதாவது உதாரனமாக <p class="parastylefont10"> 
 
அடுத்த பதிவில் தொடரும்...

4 Comments:

At 8/10/2006 3:54 PM, Blogger Jafar Ali said...

என்னைப் போன்றவர்களுக்கு பயன் உள்ள குறிப்புகள். தொடர்ந்து எழுதுங்கள் சகோதரரே!

 
At 8/10/2006 4:27 PM, Blogger ப்ரியன் said...

நல்ல விசயம் ஆரம்பித்திருக்கிறீர்கள் மாஹிர்

 
At 8/10/2006 6:56 PM, Blogger Boston Bala said...

நன்றி

 
At 9/05/2006 8:53 AM, Anonymous VKN said...

Nice Article..Keep it up..

 

Post a Comment

<< Home