sticky_note_PNG18952.jpg

HTML මුල සිට සරලව


Internet ගැන කතා කරද්දී web sites ගැන කතා නොකර බෑනේ නේද. එහෙනම් ලොවෙත් HTML ගැන කථා නොකර බෑමයි. මොකක්ද මේ HTML කියන්නේ. HTML කියන්නේ ඔනෑඹ පරිගණකයක පොදුවේ භාවිතා කළ හැකි වෙබ් අඩවි සෑදීමට යොදාගනු ලබන ක්‍රමලේඛණ භාෂාවකි. මේක දිගට ලියලා පෙන්නුවොත් එහෙම (Hyper Text Markup Language) කියලා තමයි කියන්නේ.

අපි යමු මේකේ අතීත කතාව දිහාට.ඇත්තටම HTML 1980 මුල භාගයේදී prototype එකක් විදියට ඇවිත් ඇත්තටම ලෝකෙට එනු ලබන්නේ 1989 කියන කාලේදී තමයි.මේක ලෝකෙට හඳුන්වා දෙන්න විශාල මහන්සියක් ගත්තු දෙන්නා තමයි ටිම් බර්නර්ස් මහතා සහා රොබට් කැලියු මහතා.මේ දෙන්නගේ උත්සහයේ ප්‍රතිඵලයක් තමයි අද අපි මේ දකින තෙරක් නොපෙනෙන අසීමාන්විත වෙබ් අඩවි වල බිහිවීම.

මේතැනදී අපි විශේෂයෙන්ම කතා කළ යුතු දෙයක් තමයි ඇයි HTML මේ තරම් වයසට ගිහිල්ලත් අදටත් මේච්චර ජනප්‍රිය කියලා.හේතුව මේකයි.HTMLව වලින් විතරක්ම ඔයා වෙඩ් අඩවියක් ලියනවානම් දෙයියනේ කියලා ඔයාට ඕනේ වෙන්නේ Notepad එකක් විතරමයි. පිස්සු වගේ නේද.එක එක ජාතියේ ඇප් මුකුත් HTML වලට ඔනෙම නෑ.Notepad එකේ සැරට ලියලා .html කියන file format එකෙන් සේව් කලාම දෙයියනේ කියලා යස අපූරුවට ඩිස්ප්ලේ කරනවා ඔයා ලියපු සියළු දේ. අන්න ඒකයි HTML වල විශේෂත්වය.ඇත්තටම සරලයි. මේ වන කොට පාවිච්චි වන්නේ HTML වල 5 වන සංස්කරණය.

මන් හිතන්නේ HTML ගැන ආටෝප ලිව්වා ඇති වගේ. අපි දැන් HTML ඉගෙන ගන්න පටන් ගමු.

හරි දැන් මුලින් ම මම කිව්වනේ html language ඔක භාවිතා කරන්න අමතර මදුකාංග මුකුත් ඕනේ වෙන්නේ නෑ කියලා. හරි අපි මුලින්ම ඉගෙන ගමු කොහොමද html ෆයිල් එකක් සේව් කරගන්නේ කියලා. ඔයාලගේ පරිගණකයේ තියෙන notepad එකක් open කරගන්න. notepad එක පෙන්නන්නේ නැත්නම් search bar එකේ notepad කියලා type කරන්න. දැන් notepad එක open කරගත්තා නේද. දැන් අපි බේසික් code එකක් ගහලා ඒ code file එක html විදියට save කරලා බලමු.

<!doctype html>
<HTML>
<head>
<title>My Page</title>
</head>
<body>
<h1><b>Well come to my page </b></h1>
<br></br>
Hello every one
</body>
</html>


ඔන්න මම බේසික් code file එකක් මෙතැන දැම්ම. මේකේ කොඩ් ටික වෙන වෙනම කියන්නම් දැනට ඉගෙනගමු  කොහොමද html format එකෙන් save කරන්නේ කියලා.

ඔයාලා code එක ටයිප් කරපු notepad එකේ menu bar එකේ file වලට ගිහින් save as එක select කරන්න. හරි දැන් ඔයාලට ඕනේ location එක තෝරගෙන File එක සේව් කරගන්න.සේව් කරගන්න වෙලාවෙදී මතක තියාගන්න default තියෙන්නේ .txt format එක වෙනුවට ඔයා file එකේ නමට පිටිපස්සෙන් file extension එක විදියට දෙන්න ඔනේ .html කියන එක. දැන් ඔයාලට පෙනෙයි ඒ විදියට සේව් කලාම file එක පෙන්නන්නේ පහලින් පෙන්නන විදියට නේද(මතක තියාගන්න ඒ icon එක ඔයාලා පාවිච්චි කරන බ්‍රවුසරය අනුව වෙනස් වෙයි)


දැන් බලන්න ඒ file එක open කරලා. හා හපුරා කියලා ඔයාලා ඔන්න web page එකක් නිර්මාණය කළා.ඔයාලා පාවිච්චි කරන web browser එකේ ඔයාලා හදපු page එක මෙන්න මේ විදියට පෙන්නයි.


දැන් html File එකක් විදියට සේව් කරගන්න විදිය පැහැදිලියි නේද? හරි දැන් අපි coding පැත්ත ගැන වැඩි අවධාණය යොමු කරමු. එකින් එක code වලින් ඉස්සරහට යන විදිය ඉගෙන ගම්මු.

අපි දැන් බලමු අපි මුලින් අපි ලිව්ව code එකේ තියෙන දේවල් කෙහොමද පැහැදිලි කරගන්නේ කියලා.
<!doctype html> - මේකෙන් පැහැදිලි කරන්නේ ඩොකියුමන්ට් එකේ විදිය. ඒ කියන්නේ මේක තමයි

<HTML> -  මේ භාෂාවෙදි අපි මොකක් හරි දෙයක් පටන් ගන්නවානම් ඒක අනිවා අවසන් කරන්නත් ඕනේ. මෙතැනදි html පටන් ගන්නේ මේ <> බ්‍රැකට් දෙකෙන්. ඒ වගේම අනික් හැමදේම ආර්මභ කරන්න වගේම අවසන් කරන්න යොදා ගන්නේ මේ බ්‍රැකට් තමා.උදාහරණයක් විදියට අකුරු බෝල්ට් කරන්න (bold) අකුරු ඉස්සරහින් <b> සහ කමාන්ඩ් එක අවසන් කරන්න අකුරු පිටුපසින් </b> කියලා ඒ command එක terminate කරනවා. එතකොට අපි දුන්න code එක complete. Ex- <b> My Page</b>


<head>
<title>My Page</title>
</head> - මෙතැනදී page එකේ title එක විදියට ඒ කියන්නේ වෙබ් පිටුවේ ශීර්ෂයේ ඔයා දෙන නම ටයිප් වෙන්න code එක දෙන්නේ මේ විදියට. මෙතැනදී ඔයාලට වෙන වෙන code ටෙස්ට් කරලා බලන්න පුළුවන්


HTML පාඩම් මාලාව අංක 01
HTML පාඩම් මාලාව අංක 02
HTML පාඩම් මාලාව අංක 03
HTML පාඩම් මාලාව අංක 04
HTML පාඩම් මාලාව අංක 05
HTML පාඩම් මාලාව අංක 06

1 අදහස්:

 
Angry Birds -  Help