Hello! ඔන්න අපේ HTML මුලකුරු පාඩම් මාලාවේ පළවෙනි පාඩමට සාදරයෙන් පිළිගන්නවා. අද අපි කතා කරන්න යන්නේ HTML කියන්නේ මොනවගේ එකක්ද, එය ඇයි මෙතරම් වැදගත් කියලා, සහ සරල HTML document එකක් හදාගන්නේ කොහොමද කියලා. මේ පාඩම අවසානයේදී ඔයාලට web page එකක structure එක ගැන හොඳ අවබෝධයක් තිබේවි. ඉතින්, එහෙනම් Lesson එකට බහිමු!
“මුලින්ම, HTML කියන්නේ මොකක්ද කියලා කතා කරමු. HTML කියන්නේ HyperText Markup Language එකේ shorten form එකක්. මේක අන්තර්ජාලයේ web page එකක් හදන්න, එම web page එකේ content එක show කරන්න භාවිතා කරලා තියෙන මානකරණ භාෂාවක්. HTML basically set එකක් instructions දෙනවා browser එකට, ‘මේ text, images, links, සහ වෙන content එක දැක්වන්න’ කියලා.”
“මේ දැන් අපි සරල HTML document එකක structure එක බලමු. HTML document එකක් පිළිබඳ main idea එකේ හැටියට, page එකක් start කරන්නේ <!DOCTYPE html>
කියලා HTML5 version එකට support කරන declaration එකෙන්. මේක browser එකට කියනවා ‘අනේ මෙන්න මේ document එක HTML5 වලින් හදපු එකක් කියලා.’
එහෙම <!DOCTYPE html>
ලියලා ඉවර වුනාම, අපිට html
tag එකෙන් document එකේ main structure එක start කරන්න පුළුවන්. මෙහෙමයි:
<!DOCTYPE html>
<html>
<head>
<title>My First Webpage</title>
</head>
<body>
<h1>Hello World!</h1>
<p>This is my first HTML document.</p>
</body>
</html>
“මේ සරල example එකෙන් අපිට HTML document එකක තියෙන essential tags ටික ගැන හොඳ අවබෝධයක් ගන්න පුළුවන්. මෙහි html
tag එකෙන් start කරලා, document එකේ end වෙන තෙක්, ඒක main structure එකක් ලෙස maintain කරනවා.
head
tag එක: මෙතන title එක සහ extra information add කරන්න අපිට පුළුවන්.title
tag එක: Browser tab එකේ පේන්න එන title එක මෙතනින් control කරන්න පුළුවන්.body
tag එක: Web page එකේ display වෙන real content එක ඔක්කොමbody
tag එකේ යටතේ තියෙන්න ඕන.”
“HTML language එකෙන් පේජ් එකක් හදනකොට, අපිට HTML element කියලා concept එකක් ගැන විස්තර කරන්න ඕන. HTML element එකක් basically start එකකට, end එකකට වගේම content එකකට තියෙන structure එකක්. Ex: <h1>Hello World!</h1>
. මෙතන <h1>
කියන එක opening tag එකයි, Hello World!
කියන එක content එකයි, </h1>
කියන එක closing tag එකයි. HTML elements basically මේ විදිහට use කරන්න පුළුවන් content display කරන්න.”
“ඔන්න, දැන් අපි සරල HTML document එකක් හදාගත්තා. මේක save කරලා browser එකක open කරලා බලමු. අපි මේ code එක index.html
කියලා save කරලා, අපේ web browser එකේ open කරන්න පුළුවන්. අනික් කෙනාගේ browser එකේ තමයි, ඔයාගේ code එක render වෙන්නේ, අපිට පේන්න ඒ web page එකේ structure එකට HTML language එකක් හොඳට setup වෙලා තියෙනවා කියලා.”
“මේ පාඩමෙන් ඔයාල HTML document එකක structure එක, main tags ටික සහ HTML element කියලා කියන්නේ මොකක්ද කියලා හැමදේම clear කරගෙන ඇති කියලා මම හිතනවා. ඊළඟ පාඩමේදි, අපි HTML වල text work කරන විදිහ සහ content formatting ගැන දැනගන්නම්.