Remove ads
വെബ് താളുകൾ തയ്യാറാക്കുന്നതിനുള്ള ഒരു മാർക്കപ്പ് ഭാഷയാണ് എച്.റ്റി.എം.എൽ. ഹൈപ്പർ ടെക്സ്റ്റ് മാർക്കപ്പ് ലാങ്ഗ്വേജ് (hypertext markup language), എന്നാണ് പൂർണ്ണരൂപം. മാസികത്താളുകളോ പത്രത്താളുകളോ പോലെ വെബ്ബിന് അനുയോജ്യമായതും വെബ്ബിലൂടെ വിവരങ്ങൾ കൈമാറാൻ ഉപയോഗിക്കുന്നതുമായ പ്രമാണങ്ങളാണ് വെബ് താളുകൾ. ഇവക്ക് പത്ര, മാസികത്താളുകൾ പോലെ ഒരു ഘടനയുണ്ടാവും, വെബ് താളുകളുടെ ഉള്ളടക്കവും രൂപവും ഘടനയും നിർവചിക്കാനുപയോഗിക്കുന്ന ഒരു ഭാഷയാണ് എച്.റ്റി.എം.എൽ. എച്.റ്റി.എം.എൽ ഒരു പ്രോഗ്രാമിങ്ങ് ഭാഷയല്ല മറിച്ച് ഒരു മാർക്കപ്പ് ഭാഷയാണ് എന്നതാണ് ശ്രദ്ധേയമായ കാര്യം.
| എക്സ്റ്റൻഷൻ | .html, .htm |
|---|---|
| ഇന്റർനെറ്റ് മീഡിയ തരം | text/html |
| ടൈപ്പ് കോഡ് | TEXT |
| യൂനിഫോം ടൈപ്പ് ഐഡന്റിഫയർ | public.html |
| വികസിപ്പിച്ചത് | വേൾഡ് വൈഡ് വെബ് കൺസോർഷ്യം & ഡബ്ല്യു.എച്.എ.റ്റി.ഡബ്ല്യു.ജി |
| ഫോർമാറ്റ് തരം | മാർക്കപ്പ് ഭാഷ |
| പ്രാഗ്‌രൂപം | എസ്.ജി.എം.എൽ. |
| പരിഷ്കൃതരൂപം | എക്സ്.എച്.റ്റി.എം.എൽ. |
| മാനദണ്ഡങ്ങൾ | ഐ.എസ്.ഒ./ഐ.ഇ.സി. 15445 ഡബ്ല്യു3സി എച്.റ്റി.എം.എൽ 4.01 ഡബ്ല്യു3സി എച്.റ്റി.എം.എൽ.5 (പ്രസിദ്ധീകരിക്കപ്പെട്ട കരട് രേഖ) |
ടാഗുകൾ എന്നറിയപ്പെടുന്ന എച്.റ്റി.എം.എൽ. ഘടകങ്ങൾ ഉപയോഗിച്ചാണ് എച്.റ്റി.എം.എൽ. താളുകൾ നിർമ്മിക്കുന്നത്. ആംഗിൾ ബ്രാക്കറ്റുകൾക്കുള്ളിലാണ് ടാഗുകൾ എഴുതുന്നത് (ഉദാ: <html> ). എച്.റ്റി.എം.എൽ. ടാഗുകൾ സാധാരണ ജോഡിയായാണ് ക്രമീകരിക്കുന്നത്. ഉദാഹരണത്തിന് <h1> ... </h1> എന്നീ ടാഗ് ജോഡികളിൽ ആദ്യത്തേത് തുടങ്ങുന്ന ടാഗും രണ്ടാമത്തേത് അവസാനിക്കുന്ന ടാഗുമാണ്. വിവിധതരം ടാഗുകൾക്കിടയിലായി എഴുത്തുകൾ, ചിത്രങ്ങൾ, പട്ടികകൾ തുടങ്ങിയ വെബ്ഉള്ളടക്കങ്ങൾ പലതും ഉൾപ്പെടുത്തുവാൻ സാധിക്കുന്നു. ഇത്തരം ഉള്ളടക്കങ്ങൾക്ക് ആവശ്യമായ രൂപഭംഗി നൽകുന്നതിനുള്ള ടാഗുകളൂം എച്ച്.ടി.എം.എല്ലിലുണ്ട്. ഉദാഹരണത്തിന് <b> </b> എന്നീ ടാഗുകൾക്കിടയിലെഴുതുന്ന അക്ഷരങ്ങൾ കടുപ്പിച്ച് കാണിക്കും.
വെബ് സെർവറുകളിലുള്ള എച്ച്.ടി.എം.എൽ. ഫയലുകളെ സ്വീകരിച്ച് അതിലെ നിർദ്ദേശങ്ങളെ വ്യാഖ്യാനിച്ച് ദൃശ്യരൂപമാക്കുകയാണ് ഒരു വെബ് ബ്രൌസർ ചെയ്യുന്നത്. എഴുത്ത്, ചിത്രങ്ങൾ, ചലച്ചിത്രം, ശബ്ദം എന്നിങ്ങനെ ഒരു വെബ് താളിൽ വേണ്ട ഓരോ കാര്യങ്ങളും എങ്ങനെ കാണിക്കണം എന്ന് എച്.ടി.എം.എൽ മാർക്കപ്പ് ഭാഷ ഉപയോഗിച്ച് നമുക്ക് നിർദ്ദേശിക്കുവാൻ സാധിക്കും. എച്.ടി.എം.എൽ ഉപയോഗിച്ച് എഴുതിയുണ്ടാക്കുന്ന താളുകൾ ഹൈപ്പർ ലിങ്കുകൾ വഴി പരസ്പരം ബന്ധപ്പെടുത്തുവാൻ സാധിക്കുന്നവയാണ്.
Remove ads
1980ൽ ടിം ബെർനെഴ്‌സ് ലീ എന്ന ഭൗതികശാസ്ത്രജ്ഞൻ യൂറോപ്യൻ ഓർഗനൈസേഷൻ ഫോർ ന്യൂക്ലിയർ റിസർച്ച് (CERN - സേൺ) എന്ന സ്ഥാപനത്തിൽ കരാറുകാരനായി ജോലി ചെയ്യുന്നതിനിടെ അവിടെയുള്ള ഗവേഷകർക്ക് ഡോക്യുമെന്റുകൾ ഉപയോഗിക്കുന്നതിനും പങ്കുവെക്കുന്നതിനും മറ്റുമായി എൻ‌ക്വയർ (ENQUIRE) എന്ന പേരുള്ള ഒരു സോഫ്റ്റ്‌വെയർ സംവിധാനം നിർമ്മിക്കാനുള്ള നിർദ്ദേശം മുമ്പോട്ട് വച്ചു, അതിന്റെ ആദ്യമാതൃകയും അദ്ദേഹം നിർമ്മിച്ചു. എൻ‌ക്വയറിന്റെ ആശയവും അതിനൊപ്പം തന്നെ ആ സംവിധാനത്തിന്റെ പരിമിതികളുമാണ് വേൾഡ് വൈഡ് വെബ് എന്ന ആശയത്തിലേക്ക് ലീയെ എത്തിച്ചത്.[1]
1989ൽ ബെർനേഴ്‌സ് ലീയും സേണിലെ ഡേറ്റ സിസ്റ്റം എഞ്ചിനീയറായ റോബർട്ട് കെയ്‌ല്യൂ‌വും ഇന്റർനെറ്റ് ആധാരമാക്കി ഒരു ഹൈപ്പർ ടെക്സ്റ്റ് സിസ്റ്റം പ്രവർത്തിപ്പിക്കുന്നതിന് വ്യത്യസ്ത പദ്ധതികൾ സമർപ്പിച്ചു. തൊട്ടടുത്ത കൊല്ലം ഇരുവരും ഒരുമിച്ച് - വേൾഡ് വൈഡ് വെബ്ബ് (W3) പ്രോജക്ട് - എന്ന പദ്ധതി സമർപ്പിക്കുകയും സേൺ ഇത് സ്വീകരിക്കുകയും ചെയ്തു. 1990 കളിലെ തന്റെ സ്വകാര്യ കുറിപ്പുകളിൽ ലീ, ഹൈപ്പർടെക്സ്റ്റ് ഉപയോഗപ്പെടുത്താവുന്ന പല മേഖലകളെപ്പറ്റി ഒരു പട്ടികയുണ്ടാക്കി, പട്ടികയുടെ ആദ്യസ്ഥാനത്ത് സർവ്വവിജ്ഞാനകോശം നിർമ്മിക്കുവാനും മറ്റും എന്നായിരുന്നു[2] .
1991ൽ ബെർണേഴ്‌സ് ലീ എച്ച്.ടി.എം.എൽ ടാഗുകൾ എന്നൊരു ലേഖനം പൊതുജനങ്ങൾക്കായി ഇന്റർനെറ്റിൽ പ്രസിദ്ധീ‍കരിച്ചു. അത് വളരെ ലളിതമായ 22 അടിസ്ഥാന സൂചകങ്ങൾ അടങ്ങിയ ഒരു എച്ച്.ടി.എം.എൽ ഡിസൈൻ ആയിരുന്നു. അതിൽ 13 എണ്ണം ഇന്നത്തെ എച്ച്.ടി.എം.എൽ 4ൽ ഇപ്പോഴും ഉണ്ട്.
എച്ച്.ടി.എം.എൽ എന്നത് അക്ഷരങ്ങളേയും ചിത്രങ്ങളേയും വെബ്ബ് പേജുകളിൽ വെബ്ബ് ബ്രൗസറുകൾ വഴി തയ്യാറാക്കുന്ന ഒരു ഭാഷയാണ്. 1960കളിൽ ഉപയോഗിച്ചിരുന്ന ‘റൺ ഓഫ് കമാൻഡ്’ ‘ എന്ന പ്രോഗ്രാമിംഗ് ഭാഷയിൽ ഉപയോഗിച്ചിരുന്ന പലതും എച്ച്.ടി.എം.എൽ ടാ‍ഗുകളിൽ ദൃശ്യമാണ്. അങ്ങനെ 1993 ന്റെ പകുതിയോടെ ഇരുവരും തങ്ങളുടെ പദ്ധതി സമർപ്പിച്ചു
Remove ads
എച്.റ്റി.എം.എൽ ഘടകങ്ങൾ അഥവാ എലമെന്റ്സ് (HTML Elements) ഉപയോഗിച്ചാണ് എച്.റ്റി.എം.എൽ. പ്രമാണങ്ങൾ ഉണ്ടാക്കുന്നത്. എച്.റ്റി.എം.എൽ. ഘടകങ്ങളെ പ്രധാനമായും മൂന്നു ഭാഗങ്ങളായി തരം തിരിക്കാം
- ഒരു ജോഡി ടാഗുകൾ - ആരംഭ ടാഗും അന്ത്യ ടാഗും - ആംഗിൾ ബ്രാക്കറ്റുകൾക്കുള്ളിലാണ് ടാഗുകളുടെ പേര് എഴുതുന്നത്.
- ആരംഭ ടാഗിനോടൊപ്പമുള്ള ആട്രിബ്യൂട്ടുകൾ
- ആരംഭ-അന്ത്യ ടാഗുകൾക്കിടയിലുള്ള ഉള്ളടക്കം (എഴുത്ത്, ചിത്രം, വീഡിയോ അങ്ങനെ എന്തും) - ഈ ഉള്ളടക്കമാണ് വെബ് ബ്രൗസറിൽ പ്രദർശിപ്പിക്കപ്പെടുക
ടാഗുകൾ
ഒരു വെബ് താളിനകത്തെ ഓരോ ഭാഗങ്ങളും അവയുടെ വിന്യാസവും ഉള്ളടക്കവുമെല്ലാം പ്രത്യേകരീതിയിൽ അഥവാ ഒരു 'ടാഗ്' ഉപയോഗിച്ച് അടയാളപ്പെടുത്തിയാണ്‌ ബ്രൗസറിനു മനസ്സിലാവുന്ന ഭാഷയിൽ നിർവചിക്കുന്നത്. ഒരു ടാഗ് എന്നാൽ < > ബ്രാക്കറ്റുകൾക്കിടെ നിശ്ചിത വാക്കു ചേർത്തതാണ്‌.
ഉദാഹരണത്തിന്, ഒരു വെബ്‌താളിന്റെ തലവാചകം (ബ്രൌസറിന്റെ മേലെയുള്ള ടൈറ്റിൽ ബാറിൽ കാണിക്കുന്നത്) <TITLE> എന്ന ടാഗ് ഉപയോഗിച്ചാണ് അടയാളപ്പെടുത്തുന്നത്. മേൽപ്പറഞ്ഞത് ഒരു ആരംഭ ടാഗാണ് </TITLE> എന്ന അന്ത്യടാഗ്‌ ഉപയോഗിച്ച് തലവാചകമാക്കേണ്ട വാചകത്തെ പൊതിഞ്ഞാൽ ബ്രൗസർ ഇതിനെ തലവാചകമായി മനസ്സിലാക്കും. സമ്പൂർണ്ണ ഉദാഹരണം താഴെ ശ്രദ്ധിക്കുക.
<TITLE>ഇത് ബ്രൗസറിന്റെ ടൈറ്റിൽ ബാറിൽ തലവാചകമായി വരണം</TITLE>
ഇങ്ങനെ വിവിധതരം ടാഗുകൾ ഉപയോഗിച്ച് ചിട്ടപ്പെടുത്തിയ താളുകളാണ് വെബ്സൈറ്റുകളിലെല്ലാം കാണുന്നത്.
സാധാരണഗതിയിൽ ടാഗുകളെ രണ്ടായി തരം തിരിച്ചിരിക്കുന്നു;
- കണ്ടയ്നർ ടാഗുകൾ (container tags)
- എംറ്റി ടാഗുകൾ (empty tags)
കണ്ടയ്നർ ടാഗുകൾ
ആരംഭ ടാഗും (<>), അന്ത്യ ടാഗും (</>) ഉള്ള ടാഗുകളെ കണ്ടയ്നർ ടാഗുകൾ എന്ന് വിളിക്കുന്നു. ഉദാഹരണത്തിന്: "<center> </center>", ഇതൊരു കണ്ടയ്നർ ടാഗാണ്.
എംറ്റി ടാഗുകൾ(Empty Tags)
അന്ത്യ ടാഗില്ലാതെ, ആരംഭ ടാഗ് മാത്രമുള്ള ടാഗുകളെ എംറ്റി ടാഗുകൾ എന്ന് വിളിക്കുന്നു. ഉദാഹരണം: "<br>", ഇതൊരു എംറ്റി ടാഗാണ്.
ആട്രിബ്യൂട്ടുകൾ
മിക്കവാറും ടാഗുകൾക്കും അവയുടെ ഗുണഗണങ്ങളെ നിർവചിക്കുന്നതിനുള്ള ആട്രിബ്യൂട്ടുകൾ കാണാം. എച്.റ്റി.എം.എൽ. ഘടകങ്ങൾക്കും ടാഗുകൾക്കുള്ളിലുള്ള ഉള്ളടക്കത്തിനും വിവിധ ഗുണവിശേഷങ്ങൾ ആട്രിബ്യൂട്ടുകൾ വഴി കൊടുക്കാൻ സാധിക്കുന്നു. ദ്ര്യശ്യരൂപത്തിൽ മാറ്റം വരുത്തുവാനുള്ളവ, എച്.റ്റി.എം.എൽ ഘടകങ്ങൾക്ക് പേര് കൊടുക്കുവാനുള്ളവ അങ്ങനെ വിവിധ തരം ഗുണവിശേഷങ്ങൾ അഥവാ ആട്രിബ്യൂട്ടുകൾ ഉണ്ട്.
മിക്ക ആട്രിബ്യൂട്ടൂകളും സമ ചിഹ്നം(=) നടുവിൽ വരുന്ന പേര്-വില ജോഡികളായാണ് (name-value pairs) എഴുതുന്നത്. ആട്രിബ്യൂട്ടിന്റെ വില ഒറ്റ അല്ലെങ്കിൽ ഇരട്ട ഉദ്ധരണിചിഹ്നങ്ങളുടെ ഇടയിലാണ് എഴുതുന്നത്. ഉദാഹരണത്തിന് ,
<SPAN ALIGN=“LEFT“ >
ഇവിടെ ALIGN എന്നത് SPAN ടാഗിന്റെ ഒരു ആട്രിബ്യൂട്ട് ആണ്. LEFT എന്നത്, ALIGN ആട്രിബ്യൂട്ടിന്റെ വിലയാണ്. ഈ ആട്രിബ്യൂട്ടിന്റെ വില അനുസരിച്ച് ടാഗിന്റെ സ്വഭാവം മാറുന്നു.
<img src="images/logo.png" alt="വിക്കിപ്പീഡിയ ലോഗോ" />
ഇവിടെ ഇമേജ് ടാഗിന് രണ്ട് ആട്രിബ്യൂട്ടുകൾ കൊടുക്കുന്നു, src എന്ന ആട്രിബ്യൂട്ട് വഴി പ്രദർശിപ്പിക്കേണ്ട ചിത്രത്തിന്റെ ഉറവിടം പറഞ്ഞുകൊടുക്കുന്നതിനൊപ്പം alt എന്ന ആട്രിബ്യൂട്ട് വഴി ചിത്രത്തിന് ഒരു ചെറു വിവരണം കൊടുക്കുകയും ചെയ്യുന്നു. ഏതെങ്കിലും കാരണത്താൽ ബ്രൗസറിനു ചിത്രം പ്രദർശിപ്പിക്കാൻ സാധ്യമായില്ലെങ്കിൽ ഈ വിവരണം തൽസ്ഥാനത്ത് വരും,
HEAD, BODY ടാഗുകൾ
മിക്കവാറും എച് ടീ എം എൽ പേജുകൾക്കും ഒരു <HEAD> ഭാഗവും, ഒരു <BODY> ഭാഗവും കാണും. പേജ് കാണുമ്പോൾ <BODY> ടാഗിനുള്ളിലുള്ള ഭാഗമാണ് ബ്രൌസറിൽ കാണിക്കുക. സാധാരണ <HEAD> ടാഗിനുള്ളിലുള്ള ഭാഗം പേജിനെ സംബന്ധിയ്ക്കുന്ന പൊതുവായ വിവരങ്ങൾ രേഖപ്പെടുത്തുന്ന സ്ഥലമാണ്.
സാമാന്യരൂപം
എച് ടി എം എൽ പേജിന്റെ സാമാന്യ രൂപം കാണാം
<!-- വിവരണം, കുറിപ്പുകൾ തുടങ്ങിയവ ഈ ടാഗിനുള്ളിൽ എഴുതുക -->
<!DOCTYPE html>
<html>
<head>
<title>ഈ താളിന്റെ തലവാചകം(title)ഇവിടെ കൊടുക്കുക</title>
</head>
<body>
<p> പാരഗ്രാഫ് ടാഗിനുള്ളിൽ ടെക്സ്റ്റ് എഴുതിയിരിക്കുന്നു. </p>
</body>
</html>
ഇവിടെ കാണുന്ന പോലെ, എല്ലാ എച് ടി എം എൽ പേജുകളും HTML എന്ന ഒരു ടാഗിനകത്താക്കിയ ഒരു കൂട്ടം ടാഗുകളാൻ നിർവചിക്കപ്പെട്ടിട്ടുള്ള, ഒരു വ്യക്തമായ രൂപരേഖയുള്ള, .htm അല്ലെങ്കിൽ .html എന്ന എക്സ്റ്റൻഷനൊടു കൂടിയ ഒരു ടെക്സ്റ്റ് ഫയലാണ്‌.
ഒരു എച്.റ്റി.എം.എൽ എലമെന്റിന്റെ സാമാന്യരൂപം ഇങ്ങനെയാണ് <tag attribute1="value1" attribute2="value2">ഉള്ളടക്കം</tag>. ഉദാഹരണത്തിന് പച്ച നിറത്തിലുള്ള, ഫോണ്ട് വലിപ്പം 14 പിക്സലുള്ള ഒരു പാരഗ്രാഫ് "style" എന്ന ആട്രിബ്യൂട്ട് ഉപയോഗിച്ച് താഴെ എഴുതിയിരിക്കുന്നു
<p style="font-size:14px; color:green;">
ഇത് പച്ച നിറത്തിൽ ഫോണ്ട് വലിപ്പം 14 പിക്സൽ ഉള്ള ഒരു പാരഗ്രാഫ് ആണ്, ഇതിനുള്ളിൽ എഴുതുന്ന എല്ലാ അക്ഷരങ്ങൾക്കും ഈ സവിശേഷതകൾ ഉണ്ടായിരിക്കും
</p>
അക്ഷരങ്ങൾ, അക്കങ്ങൾ, എച്.റ്റി.എം.എൽ ഘടകങ്ങൾക്കുവേണ്ടി ഉപയോഗിക്കുന്ന ചിഹ്നങ്ങൾ എന്നിവ എഴുതാൻ
എച്.റ്റി.എം.എൽ 4.0 പതിപ്പ് പ്രകാരം 252 അക്ഷരചിഹ്നങ്ങളും , 1,114,050 സംഖ്യാസംബന്ധമായ ചിഹ്നങ്ങളും, (എച്.റ്റി.എം.എൽ മാർക്കപ്പിനുവേണ്ടി ഉപയോഗിക്കുന്നതും അല്ലാത്തതും പിന്നെ കീബോർഡിൽ ടൈപ്പ് ചെയ്യാൻ സാധിക്കാത്തതുമായ ചിഹ്നങ്ങളും അക്ഷരങ്ങളും) നേരിട്ടല്ലാതെ എച്.റ്റി.എം.എൽ. മാർക്കപ്പ് ഉപയോഗിച്ച് എഴുതാൻ സാധിക്കും. ഉദാഹരണത്തിന് "<" എച്.റ്റി.എം.എൽ ഭാഷാവ്യാകരണത്തിന്റെ ഭാഗമാണ്, വെബ് താളിലെ സാധാരണ ഉള്ളടക്കത്തിന്റെ കൂടെ ഇത് എഴുതാൻ "<" എന്നെഴുതിക്കൊടുത്താൽ മതിയാവും, ഈ രീതിയിൽ എഴുതിക്കൊടുക്കുന്ന അക്ഷരങ്ങളെയും ചിഹ്നങ്ങളെയും മാർക്കപ്പിൽ നിന്നും വ്യത്യസ്തമായി സാധാരണ എഴുത്തായി കണക്കാക്കും.
Remove ads
| ടാഗുകൾ | പ്രധാന ആട്രിബ്യൂട്ടുകൾ |
|---|---|
| <html> | dir, Lang |
| <head> | |
| <title> | |
| <body> | bgcolor, background, text, link, align |
| <br> | |
| <hr> | size, width, color, noshade |
।}
- "Frequently asked questions by the Press - Tim BL". വേൾഡ് വൈഡ് വെബ് കൺസോർഷ്യം(W3C). Retrieved 04 ഓഗസ്റ്റ് 2011.
{{cite web}}: Check date values in:|accessdate=(help) - ടിം ബെർണേർസ് ലീ, ഡബ്ല്യു3സി ചരിത്രരേഖകൾ. "ഹൈപ്പർടെക്സ്റ്റിന്റെ പ്രയോഗങ്ങൾ". Retrieved 23 ഓഗസ്റ്റ് 2011.
{{cite web}}: CS1 maint: numeric names: authors list (link)
| ടാഗുകൾ | ഉപയോഗങ്ങൾ |
|---|---|
| <html> | എച്ച്.ടി.എം.എൽ ഡോക്കുമെന്റിനെ പ്രധിനിദാനം ചെയ്യുവൃന്നു. |
 |
വിവരസാങ്കേതികവിദ്യയുമായി ബന്ധപ്പെട്ട ഈ ലേഖനം അപൂർണ്ണമാണ്‌. ഇതു പൂർത്തിയാക്കാൻ സഹായിക്കുക. |
Wikiwand in your browser!
Seamless Wikipedia browsing. On steroids.
Every time you click a link to Wikipedia, Wiktionary or Wikiquote in your browser's search results, it will show the modern Wikiwand interface.
Wikiwand extension is a five stars, simple, with minimum permission required to keep your browsing private, safe and transparent.
Remove ads