தமிழ் வலைப்பக்கத்திற்கான Unicode Define with Meta Code

படுகை.காம் சம்பந்தமான எந்தவொரு சந்தேகக் கேள்விக்கும், அல்லது தேவைப்படும் உதவியை கேளுங்கள் பதில் சொல்லி வழிநடத்த காத்திருக்கிறோம்.
Post Reply
User avatar
ஆதித்தன்
Site Admin
Posts: 12146
Joined: Sun Mar 04, 2012 1:17 am
Cash on hand: Locked

தமிழ் வலைப்பக்கத்திற்கான Unicode Define with Meta Code

Post by ஆதித்தன் » Sun Oct 21, 2012 3:25 pm

<Meta > Tag: இன்று நாம் பார்க்க இருப்பது மெட்டா டேக் பற்றித்தான். இதனை முன்பு Refresh & Redirect என்ற இரண்டு பயன்பாட்டுக்குப் பயன்படுத்தினோம். இப்பொழுது கூடுதலாக என்னென்ன பயன்பாட்டுக்கு உதவுகிறது என்று பார்ப்போம்.

மெட்டா டேக் என்பது 2010 ஆண்டுக்கு முன்னர், SEO tool ஆகப் சர்ச் இஞ்சின்களுக்கு பேஜ் ரேங்க் கொடுக்கப் பயன்பட்டது. ஆனால் தற்போதைய சர்ச் இஞ்சின் பார்முலா இதனை விடுத்து, இணையப் பக்கத்தில் உள்ள கண்டண்ட் கொண்டே பேஜ் ரேங்க் கொடுக்கின்றன. ஆகையால் இன்றைய நவீன யூகத்தில் இதன் பயன்பாடு குறைந்துவிட்டது என்றாலும் கொஞ்சம் தெரிந்து கொள்வது நல்லது.
Meta Keywords
ஒர் தளம் அமைக்கிறோம் என்றால், அது ஏதேனும் ஒர் பொருளை மையமாகக் கொண்டே அமையும். அப்பொருளினை ரத்தினச் சுருக்கமாக ஒர் சில வார்த்தையில் சுட்டுவதுதான் கீ வேர்டு. குறிப்பாக நமது தளத்தின் முக்கிய கீவேர்டு என்று பார்த்தால் ஆன்லைன் ஜாப். அப்படியானல், ஆன்லைன் ஜாப் என்று தேடுவோர்க்கு நமது தளம் கிடைக்க வேண்டும் என்றால் head tag உள்ளே Meta tag Keywords ஆக online job, tamil online job, home based job, part time job இப்படி எந்தெந்த வார்த்தைகளில் தேடினால் நமது தளம் கிடைக்க வேண்டுமோ, அப்படியான கீவேர்டு எல்லாவற்றையும் கொடுக்க வேண்டும். அதற்கு முதலில், name=keywords என்று கொடுத்துவிட்டு, அதன் content="keywordsகளை கொடுக்க வேண்டும்" . குறிப்பு: மேட்டா டேக் எப்பொழுது Head Tag உள்ளே தான் அமைய வேண்டும்.
உதாரணம்,
<meta name="keywords" content="onlienjob, tamil online job, Home Based Job" />

META Description:
keywords கொடுத்தது போல், நமது தளத்தினைப் பற்றிய ஒர் சின்ன அறிமுகம்/description .

<meta name="description" content="Padugai.com is the No.1 Tamil Online Job Tutorial Site and Given Referral & Article Writing Job for all Tamilians" />

Meta Owner:
தளத்தின் உரிமையாளர் யார் என்பதனைக் குறிப்பிடப் பயன்படுகிறது.
<meta name="owner" content="K.Selva Athithan" />

Meta Author:
குறிப்பிட்டப் பக்கத்தின் எழுத்தாளர் யார் என்று குறிப்பிடப் பயன்படுகிறது.
<meta name="author" content="Padugai Members" />


BASE Meta Tag: option page link open in New Tab
நம் பக்கத்தில் உள்ள லிங்குகளை புதிய பக்கத்தில் திறக்க ஒவ்வொரு முறையும் Target_blank என இணைப்பதற்கு பதில் ஒரேமுறை Head பகுதிக்கும் <base target='_blank'/> எனக் கொடுத்துவிட்டால், அப்பக்கத்தில் உள்ள லிங்குகள் எல்லாம் புதிய பக்கத்தில் திறக்க வைக்க பயன்படுகிறது. head பகுதிக்குள் Meta Tag வரிசையில் கீழ் கொடுத்தப்படி கொடுக்க வேண்டும்.
<base target='_blank'/>


Define a Unicode Character Set
இது மிக முக்கியம். ஏனெனில் நாம் பயன்படுத்துவது தமிழ் மொழி. ஆகையால், Unicode Character set format அக் டிபைன் செய்தால் தான், நாம் தமிழில் கொடுப்பவை அப்படியே வலைப்பக்கத்தில் தமிழில் தெரியும். இல்லையெனில் கட்டமும் சிம்பிளுமாக தெரியும். ஆகையால் கண்டிப்பாக ஒவ்வொரு முறையும் <head> tag உள்ளே கீழ் உள்ள UTF-8 என்ற Unicode character set-ஐ மெட்டா டேக் மூலம் டிபைன் செய்ய மறந்துவிடாதீர்கள். இதனைச் சொல்லாத காரணத்தினால் தான், இதுவரை நான் கொடுத்த எடுத்துக்காட்டு வலைப்பக்கத்தில் தமிழ் இடம்பெறவில்லை. இனிவரும் பக்கங்களில், இதனை டிபைன் செய்து தமிழில் எழுதுகிறேன்.
தமிழ் வலைப்பக்கத்திற்கான Unicode Define with Meta Code
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />


என்னும் சில மெட்டா டேக் அட்ரிபூட் இருக்கின்றன. அவற்றில் முக்கியமாக நாம் பயன்படுத்த இருப்பது CSS என்ற Cascading Style Sheet என்னும் பைல் லிங்க். இதனையும் chatset போல் ஆரம்பத்திலே டிபைன் செய்ய வேண்டும். அவற்றினை பிறகு பார்க்கலாம்.
தொடரும்....
User avatar
ஆதித்தன்
Site Admin
Posts: 12146
Joined: Sun Mar 04, 2012 1:17 am
Cash on hand: Locked

Re: HTML Tutorial - Website Designing இன் தமிழ்

Post by ஆதித்தன் » Tue Oct 23, 2012 9:38 am

இதுவரையிலும் வலைத்தளத்தினை உருவாக்கத் தேவையான அளவிற்கு கற்றுக் கொண்டோம். என்னும் ஒர்சில டேக்குகள் இருக்கின்றன, அவற்றின் கோடிங்க் உதாரணங்களையும் இப்பொழுது கொடுத்துவிடுகிறேன். நீங்களே அதற்கான அவுட்புட் எவ்வாறு இருக்கிறது என்பதனை வெப்கோஸ்டிங்க் மூலம் செய்துப் பார்த்துக் கொள்ளுங்கள். பின் இறுதியாக, நமது படுகை தளத்தின் முகப்புப் பக்கத்தினை HTML டேக்குகளில் தேவையானவற்றைக் கொண்டு புதியதாக வடிவமைத்துக் காட்டுகிறேன். மேலும் உங்களுக்கு விவரம் தேவைப்பட்டால் பின்னூட்டமாகக் கேளுங்கள் சொல்லித் தருகிறேன், சரிங்களா. :)

Iframe , இது ஏற்கனவே பார்த்ததுதான். ஆனாலும் அதில் பயன்படுத்தப்படும் attributes பற்றி முழுமையாக சொல்லவில்லை என நினைக்கிறேன், ஆகையால் அவற்றினைப் பற்றிச் சொல்லிவிடுகிறேன்.

<body>
<iframe src="http://www.padugai.com" height="30%" width="70%">
</iframe>
</body>


height, width எனப் பயன்படுத்துவது போல, மேலும் இதனை Table ஆப்சனில் உள்ளதுபோல் கொஞ்சத்தைக் கொண்டு வடிவமைக்கப் பயன்படுவைகளைப் பார்ப்போம்.

frameborder="0"
Frame பார்டர் வேண்டுமா வேண்டாமா? என்பதற்கு 0 அல்லது 1 என்ற மதிப்பினைக் கொடுக்கலாம்.

align="right"
அலைன்மெண்ட் லெப்ட்டா ரைட்டா, மத்தியா என மதிப்பு கொடுக்க பயன்படுத்தலாம்.

hspace="x"
ப்ரேமை சுற்றி ஹரிசாண்டல் பகுதியில் எவ்வளவு இடைவெளியிட்டு கட்டம் அமைய வேண்டும் என்பதற்கான மதிப்பு... எண்ணில் கொடுக்க வேண்டும்(1, 5, 4 அப்படி).

vspace="x"
வெர்ட்டிகள் அமைப்பில் எவ்வளவு இடைவெளி அமைய வேண்டும் என்பதற்கான எண் மதிப்பு.

marginwidth="x"
மார்ஜின் எவ்வளவு அகலம் இருக்க வேண்டும் என்பதற்கான எண் மதிப்பு.

marginheight="x"
மாரிஜின் எவ்வளவு உயரத்தில் இருக்க வேண்டும் என்பதற்கான எண் மதிப்பு.


scrolling="no"
நாம் தேர்வு செய்துள்ள கட்டத்தின் அளவினை விட, உள்ளீடாக கொடுத்துள்ள பக்கம் பெரியதாக இருந்தால் ஸ்கோர்லிங்க் செய்து பார்க்கும் வசதி வேண்டும் என்றால், இதனைப் பயன்படுத்தாமல் விட்டுவிடலாம். இல்லை ஸ்கோர்லிங்க் செய்து பார்க்கக் கூடாது, என நினைத்தால் இதன் மதிப்பினை no என செட் செய்து கொள்ளலாம். இவ்வாறு Scrolling no என்ற ஆப்சனைப் பயன்படுத்துவதன் மூலம் பக்கத்தின் அவுட்லூக் நன்றாக இருக்கும். எனவே உள்ளீடாக கொடுக்கும் தளத்தின் அளவினைச் தேவையான அளவாக வைத்துக் கொள்வது நல்லது. அதாவது நாம் 200 *200 கட்டத்தில் ப்ரேம் பயன்படுத்தப் போகிறோம் என்றால், அந்த ப்ரேம் பக்கத்தையும் 200* 200 அல்லது கொஞ்சம் சின்னதாக உருவாக்கிக் கொள்ளலாம்.

இவற்றைனைச் செய்து பார்த்துவிட்டு சந்தேகம் இருந்தால், விவரமாக கேளுங்கள் ... எடுத்துக்காட்டு கொடுக்கிறேன்..
தொடரும் ....
Post Reply

Return to “உதவிக் களம்”