how to create a web page: May 2015

Tuesday, May 26, 2015

പാഠം .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 മനസിലാക്കാൻ സ്രെമിക്കുക .

Sunday, May 24, 2015

പാഠം 3 CSS

കൂട്ടുകാരെ ഇന്നത്തെ വിഷയo കുറച്ചു css ഭാഷയെകുറിച്ചാണ് . ആദ്യത്തെ പാഠത്തിൽ HTML ഉപയോഗിച്ച് webpage ഉണ്ടാക്കി . ആ webpageനെ നമ്മളിപ്പോ കുറച്ചു മാറ്റം വരുത്താൻ പോവുകയാണ് .അതിനായി നമുക്ക് കംപുടർ റിന്റെ CSS ഭാഷ ഉപയോഗിക്കാം .

നമ്മൾ ആദ്യത്തെ പാഠഭാഗത്ത്‌ പഠിച്ച html code ഒരു NOTEPAD ഓപ്പണ്‍ ചെയട് അതിൽ ടൈപ്പ് ചെയ്യുക
ആ NOTEPAD പണ്ടത്തെ പോലെതന്നെ സേവ് ചെയുക, അപ്പൊ നേരത്തെ ഉണ്ടാക്കിയ index .html എന്ന മാറ്റി ഇപ്പൊ ഉണ്ടാക്കിയ വെബ്‌ പേജ് നമ്മുടെ demoweb എന്ന ഫോൾഡറിൽ സേവ് ചെയുക . മാറ്റങ്ങൾ വരുതുനതിനു മുന്ബ് ഒന്ന് ബ്രൌസർ റിൽ ഓപ്പണ്‍ ചെയ്ട്‌ വെക്കുക അതിങ്ങനെ ആയിരിക്കും കാണുക

My first webpage
this is a paragraph
this letter is bold

ഈ വെബ്‌ പേജ്നെ നമുക്കൊന്ന് CSS ഭാഷ ഉപയോഗിച്ച് , sentenceസുകളെ അവയുടെ സ്ഥാനത്തു നിന്നും മാറ്റി കുറച്ചു കളർ ഒക്കെ നോക്കാം . ഈ ചെറിയ ഉദാഹരണത്തിൽ നിന്നുതന്നെ നിങ്ങൾക്ക് CSS എന്ന ഭാഷയുടെ ഉപയോഗം മനസിലാക്കാൻ സാധിക്കും . താഴെ ഞാൻ ടൈപ്പ് ചെയ്ദിരിക്കുനപൊലെ നിങ്ങളുടെ കോഡിൽ മാറ്റം വരുത്തുക .
<html>

<head>

<title></title>

</head>

<style>
h1{
text-align:center;
}
p{
color:red;
text-align:center;

}
b{
text-align:center;
}

</style>

<body>

<h1>MY FIRST WEB PAGE</h1>

<p>by- your name</p>

<p style="text-align:center;">This letter is bold</p>

</body>

ഇനി notepad സേവ് ചെയ്ട് ബ്രൌസർ icon ഓപ്പണ്‍ ചെയ്ദു നോക്കുക

ഇപ്പൊ എന്ടെങ്ങിലും വെത്യാസം ഉണ്ടോ .

<style>
h1{
text-align:center;
}
p{
color:red;
text-align:center;

}

</style>
ഈ CSS code നമ്മുടെ HTML കോഡിൽ ചെരതപ്പോഴാണ് ഇപ്പോഴുള്ള മാറ്റം സാദ്യമായത് .

ഇപ്പൊ മനസിലായില്ലേ CSS ഭാഷ ഉപയോഗിച്ച് നമ്മുടെ വെബ്‌ പേജ് നെ style ചെയുനതെന്ന് .അതോടൊപ്പം HTML and CSS ഭാഷകൾ തമ്മിലുള്ള വെത്യാസവും മനസിലായെന്നു വിജരിക്കുന്നു .

ഇതിൽ പ്രേത്യേഗം ശ്രെദ്ധിക്കുക

CSS ഭാഷ നമ്മുടെ HTML കോഡിൽ കുട്ടിചെർക്കൻ,നമുക്കറിയാം CSS എന്നത് style ചെയ്യിക്കാൻ ഉപയോഗിക്കുന്ന ഭാഷയാണെന്ന് അതുകൊണ്ട് അത് എഴുതാൻ തുടങ്ങുനത് <style > എന്ന സ്റ്റൈൽ tag ഉപയോഗിക്കണം CSS കോഡ് എഴുതിയതിനു ശേഷം style tag ഇന്റെ ക്ലോസിംഗ് ടാഗായ </style > ഉപയോഗിച്ച് CSS codeing end ചെയണം .

നിങ്ങൾ ശ്രെധിചിരികും ഞാൻ ഈ കോഡ് എവിടെയാണ് നമ്മുടെ പഴയ HTML കോഡിൽ Place ചെയ്തതെന്ന് HTML കോഡിന്റെ </head>ടാഗിന്റെയും <body > ടാഗിന്റെയും ഇടയിലാണ് താഴെ എഴുതിയ CSS കോഡ് place ചെയ്തത് .

<style>
h1{
text-align:center;
}
p{
color:red;
text-align:center;

}

</style>

ഇത്രയും വായിച്ചതിനു ശേഷം നിങ്ങൾ ഇത് പലവട്ടം സ്വന്തമായി ചെയ്ദുനൊക്കനം . ഇതുകുടെ ഉള്പെടുതുമ്പോൾ നമ്മുടെ പഴയ സ്റ്റൈൽ ഒന്നും ചെയ്യാത്ത വെബ്‌ പേജ്ൽ എന്തൊക്കെ മാറ്റം സംഭവിച്ചെന്നും .നിങ്ങൾക്ക് വേണമെങ്ങിൽ കളർ ഒക്കെ red എന്നുലതുമാറ്റി green എന്നോ gray യൊക്കെ ട്രൈ ചെയ്യവുനതാണ് .അതുപോലെ text -align : center മാറ്റി right എന്നൊക്കെ അക്കിനോക്കവുനതാണ് . :) . ഇനിമുതൽ ഞാൻ കോഡ് ഇതുപോലെ ഉള്പെടുതുമ്പോൾ നിങ്ങൾ ഇതുപോലെയൊക്കെ മാറ്റി തനിയെ കുറെ കാര്യങ്ങൾ പടികെണ്ടാതാണ് .
1,2 ,3 പഠങ്ങൾ ഞാൻ വിശധമായി എന്താണ് HTML , CSS ആൻഡ്‌ BROWSER എന്ന് നിങ്ങളെ പരിജയപെടുതിയതാണ് കാരണം ഇതുവയിക്കുന്ന ഭുരിഭാകം ആളുകളും ഇതിനെകുറിച്ച് അടിസ്ഥാന വിദ്യാഭ്യാസം ഇല്ലാത്തവരാണ് എന്നതുതന്നെ .

1 .HTML എന്നത് നമുക്ക് വെബ്‌ സൈറ്റിൽ ആവശ്യം വേണ്ട കാര്യങ്ങൾ ആഡ് ചെയുനതിനുള്ള ഭാഷയും
2. CSS നമുക്ക് വേണ്ട കാര്യങ്ങൾ ഭംഗിയായി സ്റ്റൈൽ ചെയുനതിനുള്ള ഭാഷയും
3.BROWSER എന്നത് HTML ആൻഡ്‌ CSS ഉപയോഗിച്ച് നമ്മൾ എഴുതുന്ന വെബ്‌ പ്രോഗ്രാമ്മിനെ മനസിലാക്കി നമുക്ക് നമ്മൾക്കുമുന്നിൽ അതിൽ പറഞ്ഞേക്കും പ്രകാരം കാണിച്ചുതരുന്ന ഒരു മദ്യമവും

ഇപ്പോ നമ്മൾ ഒരു വെബ്‌ പേജ് നിര്മിക്കുനതിനുള്ള അടിസ്ഥാന വിവരങ്ങൾ നേടിക്കഴിഞ്ഞു . എല്ലാവരും 1 ,2 ,3 പാഠങ്ങൾ നന്നായി മനസിലാക്കിയതിനു ശേഷം മാത്രം പിന്നിടുള്ള ഭാഗങ്ങളിലേക്ക് കടക്കുക .

വരും ഭാഗങ്ങളിൽ നമ്മൾ കുടുതൽ കോടിങ്ങിലേക്ക് കടക്കുനതാണ് .അവിടെ ഓരോ കോഡും ഞാൻ വിവരിച്ചയിരിക്കും പറയുക , ഇതിനെക്കുറിച്ച് അടിസ്ഥാന വിവരം ഉള്ളവർ ക്ഷമിക്കുക നമുക്ക് അടിസ്ഥാന അറിവ് ഇല്ലതവരെകുടെ നമ്മുടെ കൂടെ നടത്തേണ്ടതുണ്ട് . എല്ലാവർക്കും എല്ലാവിധ ആശoസകളും

Saturday, May 23, 2015

പാഠം .2 - Browser's

എന്താണ് web design എന്നതിനെക്കുറിച്ച് അറിയുനതോടൊപ്പം മറ്റൊരു കാര്യത്തെക്കുറിച്ച് അറിയേണ്ടതുണ്ട്‌
എന്താണ് ഒരു web browser? എന്നത്

നമുക്കറിയാം നമ്മൾ ഒരു web site ഓപ്പണ്‍ ചെയുനത് ഏതെങ്കിലും ഒരു web browser ഉപയോഗിച്ചായിരിക്കും (eg . Internet Explorer , Google Chrome , safari etc ).അങ്ങനെ ആണെന്ഗിൽ HTML web page ഉം നമ്മുടെ browser ഉം തമ്മിലുള്ള ബന്ധം എന്താണെന്നു ഒരു web ഡിസൈനർ അറിഞ്ഞിരികേണ്ടതു അനിവാര്യമാണെന്ന് മനസിലായില്ലേ ?

ഇതുവയികുമ്പോൾ ആദ്യത്തെ പാഠത്തിൽ പറഞ്ഞ കാര്യങ്ങൾ മനസ്സിൽവെക്കുക . എന്താണ് നമ്മൾ ഉണ്ടാക്കിയ വെബ്‌ page ഉം browser ഉം തമ്മിലുള്ള ബന്ധം എന്ന് നമുക്കൊന്ന് നോക്കാം .

നമ്മുടെ വെബ്‌ സൈറ്റിന്റെ കടമ എന്താ ?പണ്ടൊക്കെ നമ്മൾ നമുക്ക് ചുറ്റുമുള്ള കാര്യങ്ങളെക്കുറിച്ച് അറിഞ്ഞിരുനത് പത്രമാധ്യമങ്ങളിളുടെ ആയിരുന്നു എന്നാൽ ഇന്ന് ഈ ചുമതല വെബ്‌ സൈറ്റ്റ്റുകൾക്ക് വഴിമാറുകയാണ് . ഇവിടെ സ്രെധികേണ്ട കാര്യം മാധ്യമങ്ങൾ മാറി എന്നതാണ് . അതായതു പേപ്പർ എന്ന മാധ്യമം മാറി തികച്ചും ഇലക്ട്രോണിക് മാദ്യമം ആയി .

പത്രങ്ങളിൽ ചിത്രങ്ങളും എഴുത്തുകളും നടത്തിയിരുനത് അച്ചടി യെന്ദ്രങ്ങൾ ആയിരുന്നു അല്ലെങ്ങിൽ നമുക്ക് പറയാനുള്ള കാര്യങ്ങൾ ഒരു പേപ്പറിന്റെ സഹായത്തൽ നമ്മുടെ ഭാഷയിൽ എഴുതിയാൽ മതിയാരുന്നു എന്നാൽ അത് കമ്പ്യൂട്ടറിൽ ആയിരുനെന്ഗിലോ ? അവിടെ നമുക്ക് നമ്മുടെ ഭാഷയോ പേപ്പറോ ഇല്ല . ഈ സാഹചര്യത്തിൽ നമ്മൾ ഉപയോഗിക്കുന്ന കമ്പ്യൂട്ടറിന്റെ അല്ലെങ്ങിൽ browserinte ഭാഷയാണ് HTML . നമുക്ക് വേണ്ട കാര്യങ്ങൾ നമ്മൾ HTML ഭാഷയിൽ എഴുതുകയും അത് നമ്മുടെ ബ്രൌസർ മനസിലാക്കി നമ്മളെ സ്ക്രീനിൽ കാണിച്ചുതരുനതാണ് ബ്രൌസർ ചെയുനത് . അതായതു browser = Papper . അതിൽ നമുക്ക് എന്ത്വേണമെങ്കിലും എഴുതാം HTML ഉപയോഗിച്ച് എഴുതിയതിനു കളർ കൊടുക്കുകയോ , മറ്റെന്ടങ്ങിലും style കൊടുക്കുകയും ചെയ്യാം അതാണ് CSS ചെയുനത് .

ഇപ്പൊ മനസിലായില്ലേ ഒരു HTML webpage ഉം തമ്മിലുള്ള ബന്ധം എന്താണെന്നു .

നമുക്കറിയാം internet Explorer എന്ന ബ്രൌസർ ഇപ്പൊ ആരും അങ്ങനെ ഉപയോഗിച്ച് കാണുന്നില്ല അതിനുകാരണം HTML തന്നെ നിരവതി മാറ്റങ്ങൾ വന്നുകഴിഞ്ഞു നിരവതി മറ്റു ഭാഷകളും വന്നുകഴിഞ്ഞു വെബ്‌ desging രെങ്ങത്തും ഈ പുതിയ ഭാഷകളുടെ ഗുണങ്ങളൊന്നും internet Explorer സപ്പോർട്ട് ചെയുനില്ല . ഇപ്പൊ മനസിലായില്ലേ ഒരു വെബ്‌ ഡിസൈനർ browserഉകളെ കുറിച്ച് അറിഞ്ഞിരിക്കനമെന്നുള്ളത് .ഇനി നാളെ മുതൽ HTML ആൻഡ്‌ CSS ഭാഷകളെക്കുറിച്ച് പഠനം തുടരാം .

നിങ്ങൾക്ക് ബ്ലോഗ്‌ ഉപകരപെട്ടെങ്ങിൽ . അത് കമന്റ്‌ ആയി അറിയികെണ്ടാതാണ് .

എല്ലാവർക്കും ആശംസകൾ

പാഠം .1

WEB പേജുകൾ നിർമിചിരിക്കുനതു HTML ആൻഡ്‌ CSS എന്ന രണ്ടു ഭാഷകൾ ഉപയോഗിച്ചാണ്‌ അതിൽ HTML നമ്മളിൽ പലരും കേട്ടിടുണ്ടാകും . CSS -cascading style sheet എന്നും അറിയപെടുന്നു . ഈ ഭാഷ ഉപയോഗിച്ചാണ്‌ നമ്മൾ ഉണ്ടാക്കുന്ന HTML structureറിനു ഭംഗി കുട്ടുകയും ചെയുനത് . ഉദാഹരണത്തിന് നമ്മൾ വീടുപണിയുമ്പോൾ ആദ്യം ബ്ലോക്ക്‌ ഉപയോഗിച്ച് വിട് നിർമിക്കുന്നു . അതിനു ശേഷമാണ് നമ്മൾ അതിനു എതു കളർ എവിടെയെല്ലാം വേണമെന്ന് തിരുമാനിക്കുനത് അല്ലെ ????. അതുപോലെ നമ്മളുണ്ടാക്കിയ വെബ്‌ പേജിനെ കുടുതൽ ഭംഗിയുല്ലതക്കാൻ ആണ് നമ്മൾ CSS ഭാഷ ഉപയോഗിക്കുനത്

ഇതുവരെ വായിച്ചതു ഞാൻ പറഞ്ഞ ഉദാഹരണ സഹിതം ഓർമയിൽ വെക്കുക

1.ആദ്യമായി നിങ്ങളുടെ കമ്പ്യൂട്ടർ ടെസ്ക്ടോപിൽ ഒരു പുതിയ ഫോൾഡർ ഉണ്ടാക്കു പേര് "demoweb " എന്ന് കൊടുക്കുക

2.അടുത്തതായി കമ്പ്യൂട്ടർ start ബട്ടണ്‍ ക്ലിക്ക് ചെയ്ദു ലിസ്റ്റിൽ നിന്നും "NOTEPAD " ഓപ്പണ്‍ ചെയുക

3.അതിൽ താഴെ തന്നെക്കുംപോലെ ടൈപ്പ് ചെയുക .

നമുക്കാദ്യം വെബ്‌ പേജിന്റെ ഏറ്റവും അടിസ്ഥാനമായ ഭാഷയായ HTML തുടങ്ങി ആരംഭിക്കാം താഴെ തന്നിരികുനതാണ് നമ്മൾ ഇൻറർനെറ്റിൽ കാണുന്ന എല്ലാ വെബ്‌ പേജിന്റെയും അടിസ്ഥാന html കോഡിംഗ്

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<h1>my first web page</h1>

<p>this is a paragraph</p>

<b>This letter is bold</b>

</body>

</html>

(ഇതിലെ കോടുകളെ ക്കുറിച്ച് നിങ്ങൾ ഇപ്പോൾ ആലോചികണ്ട അത് ഞാൻ അടുത്ത പാടതിൽ പറഞ്ഞുതരാം )

ഇത്രേം ടൈപ്പ് ചെയ്ദതിനു ശേഷം file > save അപ്പൊ സേവ് ചെയാനുള്ള ബോക്സിൽ ഫയലിന്റെ പേര്" index .html" എന്ന് ടൈപ്പ് ചെയ്ട് കൊടുകുക

അതിനുശേഷം നിങ്ങൾ ഉണ്ടാക്കിയ folder ഓപ്പണ്‍ ചെയ്ദു നോക്കുക അപ്പോൾ അതിൽ നിങ്ങൾ യുസ് ചെയുന internet ബ്രൌസർ ഐക്കണ്‍ അതിൽ കാണാൻ സാധിക്കും അതിന്ടെ പേര് നിങ്ങൾ കൊടുതതുതന്നെയിരിക്കും index .html . അതിൽ ഡബിൾ ക്ലിക്ക് ചെയുക അപ്പോൾ ബ്രൌസർ വിൻഡോ ഓപ്പണ്‍ ആകുകയും നിങ്ങളുടെ വെബ്‌ പേജ് അതിൽ കാണുകയും ചയ്യാൻ സാധിക്കും . ഇപ്പോൾ നിങ്ങൾ ഒരു വെബ്‌ പേജ് നിർമിച്ചു കഴിഞ്ഞു .

ഒരു കാര്യം സ്രെധികുക ഓപ്പണ്‍ അയ വിൻഡോയിൽ കാണുന്നതെല്ലാം നിങ്ങൾ <body >........</body > ഇതിന്റെ ഉള്ളിൽ എഴുതിയതാണ് . ഇപ്പൊ മനസിലായില്ലേ ഇവിടെ നമ്മൾ എന്ത് എഴുതിയാലും അതായിരിക്കും ബ്രൌസറിൽ നമ്മുടെ വെബ്‌ പേജിൽ കാണുന്നത് . നിങ്ങൾ ഇപ്പോൾ വായിക്കുനതും കാണുന്നതുമായ എല്ലാം ഈ <body ></body > ടാഗിനുള്ളിൽ എഴുതിയതാണ് .

വെബ്‌ പേജിന്റെ അടിസ്ഥാനമായ ഇത്രയും കാണാതെ വീണ്ടും വീണ്ടും notepadil ടൈപ്പ് ചെയ്തു ഞാൻ പറഞ്ഞതുപോലെ 3, 4 തവണ ചെയ്ദു പഠിക്കുക . ഈ അടിസ്ഥാന വിവരങ്ങൾ പഠിച്ചതിനുശേഷം അടുത്ത ക്ലാസ്സ്‌ മുതൽ എങ്ങിനെ നമ്മൾ ഉണ്ടാക്കിയ വെബ്‌ പേജിനെ കളർ നല്കാനും അതിൽ ചിത്രങ്ങൾ ഉൾപെടുത്താo എന്നും പഠിക്കാം . ഇതിൽ എന്തെങ്ങിലും സംശയമുണ്ടെങ്ങിൽ നിങ്ങൾക്ക് കമന്റ്‌ ചെയ്ദു ചോദിക്കവുനതാണ്