പാഠം .4 website layout

താഴെ കൊടുത്തിരിക്കുന്ന ചിത്രത്തിൽ 1ൽ നമ്മൾ എല്ലാവരും വായിക്കുന്ന മനോരമ പത്രതിന്ടെ വെബ്‌ സൈറ്റ്റ്റിന്റെ ചെറിയ ഒരു ഭാഗം മാത്രമാണ് . നമ്മൾ പറഞ്ഞു വെബ്‌ സൈറ്റ് എന്നത് ന്യൂസ്‌ പെപ്പരുകലുടെയോ , അല്ലെങ്ങിൽ മറ്റെതെങ്ങിലും മാഗസീനുകളുടെയോ ഇലക്ട്രോണിക് രൂപം മാത്രമാണ് . അപ്പൊ അവയിൽ രണ്ടിലും ഉള്ളതിലെ കോമണ്‍ ആയിട്ടുള്ള എല്ലാം തന്നെ വെബ്‌ സൈറ്റുകളിലും ഉണ്ടാകും അല്ലെ ?

എപ്പോഴും ഒരു വെബ്സൈറ്റ് developement process തുടങ്ങേണ്ടത് ഉണ്ടാക്കാൻ പോകുന്ന വെബ്സൈറ്റിന്ടെ layout വരച്ച്‌ ഏതെല്ലാം വിവരങ്ങൾ എവിടെയെല്ലാം വരണം എന്ന് തീരുമനം എടുതിരികണം .ഈ വിഷയത്തെ കുറിച്ചാണ് ഈ പാഠത്തിൽ പറയാൻ ഉദേശിക്കുനത് 

ഉദാഹരണമായി പറ്റുമെങ്ങിൽ ഒരു ന്യൂസ്‌ പേപ്പർ കയിൽ എടുക്കുക അതിന്ടെ വെബ്സൈറ്റ് ഓപ്പണ്‍ ചെയ്ട് വെക്കുക ഇനി അവതമ്മിലുള്ള സാമ്യത നോക്കുക . 

1.Header section 

ചിത്രം ഒന്നിൽ കൊടുതിരിക്കുനപോലെ നമുക്കരിയവുനപോലെ എല്ലാ പത്രത്തിനും ഒരു വല്യ heading ഉണ്ടാകും , അതിൽ ആ പത്രതിന്ടെ logo ഉണ്ടാകും കുടാതെ പത്രതിന്ടെ പേരും പത്രതിന്ടെ ഈ ഭാഗത്തെ  header section , അതുതന്നെയാണ് വെബ്‌ സൈറ്റിന്റെ കാര്യമെടുത്താലും . ചിത്രത്തിൽ മനോരമ ന്യൂസിന്ടെ  വെബ്‌സൈറ്റിന്ടെ header section മാർക്ക്‌ ചെയ്തിടുണ്ട്‌ .  ഇതുപോലെ മറ്റു വെബ്‌ സൈറ്റുകൾനോക്കി അതിന്ടെ header section കണ്ടെത്താൻ സ്രെമിക്കുക 

2. Menu or  Navagation Bar 

    നമുക്കറിയാം നമ്മൾ ഒരു വെബ്‌ സൈറ്റിൽ കയറിയാൽ ആദ്യം ഓപ്പണ്‍ ആയി വരുന്ന പേജിൽ കമ്പനിയുടെ 

ഒരു സംഷിബ്‌ദ രൂപമായിരിക്കും ഉണ്ടാകുക . ഏതെങ്കിലും ഒരു പ്രത്യേഗ വിവരം അതിൽ നിന്നും അറിയനമെങ്ങിൽ നമ്മൾ അതിന്ടെ ലിങ്കിൽ ക്ലിക്ക് ചെയ്ദു അതിന്ടെ പൂർനരൂപമുള്ള മറ്റൊരു പേജിൽ പോകും അവിടെ നമ്മൾ വായിക്കാൻ അല്ലെങ്ങിൽ അറിയാൻ ആഗ്രഹിക്കുന്ന കര്യതിണ്ടേ പൂർന രൂപം കൊടുത്തിട്ടുണ്ടാകും . ഉദാഹരണത്തിന് മനോരമ ന്യൂസിന്ടെ വെബ്‌ ചിത്രം കൊടുതെക്കുനത്തിൽ ശ്രെദ്ധിക്കുക, അതിൽ ഞാൻ navagation ബാർ എന്ന് അടയാളപെടുതിയിട്ടുണ്ട്. അതിൽ breaking news , INDIA ,KERALA  etc. ഇങ്ങനെ നൽകിയിട്ടുണ്ട് ഇങ്ങനെ ഒരു പേജിൽ നിന്നും മറ്റൊരു പേജി ലേക്ക് പോകാൻ സഹായിക്കുന്ന sectionനെയാണ് navagation section അഥവാ menu എന്ന് നാം പൊദുവെ പറയുന്നത് . മറ്റു വെബ്‌ സൈറ്റുകളിൽ കയറി അതിലെ മെനു section കണ്ടുപിടിക്കാൻ സ്രെമിക്കുക . css എന്ന ഭാഷ ഉപയോഗിച്ച് പലരിതിയിൽ style ചെയവുനതാണ് അതുകൊണ്ട് ചിലപ്പോ നിങ്ങൾ കേറുന്ന സൈറ്റിൽ വേറെ രിതിയിലയിരിക്കും nabvagation ബാർ കാണപ്പെടുക .

3. web പേജ് content 

ഈ sectionil ആയിരിക്കും നമുക്കാവശ്യമുള്ള എല്ലാ വിവരങ്ങളുടെയും ചുരുക്ക രൂപം ഉണ്ടാകുക ചിലപ്പോ പൂർന രൂപത്തിലും വിവരങ്ങൾ ഉണ്ടാകും അത് വെബ്‌ സൈറ്റിന്ടെ structure നെ ആശ്രയിച്ചിരിക്കും .

ഓരോ വിവരങ്ങളും ചിലപ്പോ ഓരോ section ആയി വേർതിരിച്ചു കാനപെടും, 

4.footer section 

ഈ ഭാഗത്ത്‌ പൊതുവെ വെബ്‌ സൈറ്റിന്ടെ കോപ്പി right , privacy policy എന്നിവ കൊടുക്കാനാണ് ഉപയോഗിക്കാറ് .

ചില സൈറ്റുകൾ  മറ്റുപല വിവരങ്ങളും ഉൾപെടുതാറുണ്ട് 

ചിത്രം 2 കൊടുതിരിക്കുനത് മറ്റൊരു വെബ്‌ പേജിന്ടെ layout ആണ് . മനോരമവെബ്‌ സൈറ്റി നെ കുറിച്ച് പറഞ്ഞ കാര്യങ്ങളൊക്കെ തന്നെയാണ് ഇതിലും ഉള്ളത് പക്ഷെ ഇതിലെ മെനു അഥവാ navagation ബർ വെബ്‌ പേജിന്ടെ left സൈഡിൽ ആയാണ് layout ചെയ്ദിരിക്കുനതു . ഇതിന്ടെ ഓർഡർ എന്ന് പറയുന്നത് മനോരമയുടെ പോലെതന്നെയാണ് . 1.header 2.navagation 3.web page content 4.footer  നമ്മൾ HTML layout കോഡ് എഴുതുമ്പോൾ ഈ ഓർഡർ പ്രകാരം ആയിരിക്കു എഴുതുനത് .

മറ്റു വെബ്‌ സൈറ്റു കൾ  നോക്കി അവയുടെ layaout മനസിലാക്കാൻ സ്രെമിക്കുക .