අපිට ඉගෙන ගන්න තියෙනව Web Designing වලදි HTML, CSS, Javascript කියන 3 ම. මේ 3 ම පියවරෙන් පියවර කරගෙන යමු නේද?
අද HTML හැඳින්වීම තමයි කරන්නෙ හොඳද...
මුලින්ම මෙන්න මේක කියන්නම්කො මම.. අපි Web Designing කරනකොට මූලිකවම භාවිතා කරන්නෙ HTML කියල Language එකක්. මේක හැබැයි Programming Language එකක් නම් නෙමෙයි. හරියට ගෙදරක Plan එක අඳිනව වගේ තමයි මේකෙනුත් වැඩේ දෙන්නෙ... මේකට කියනව Markup Language එකක් කියල. අපි අපේ Website එකේ සැකිල්ල හදල ගන්නෙ මෙන්න මේ HTML කියන Markup Language එකෙන් තමයි.
එතකොට මේ CSS කියන්නෙ මොකක්ද? මේක තමයි නිකන් ගෑණිට සාරිය අන්දල Makeup කරනව වගේ අපේ Website එකෙත් විච්චූරණ සුකුරුත්තම් දාල සල්ලන කරල ඔබ දාල ගන්නෙ මේ CSS වලින්. ඉතින් මේ CSS ඉගෙන ගන්න එකත් අත්යාවශ්යම දෙයක්. ගෑණි විතරක් ඉඳල හරියන්නෙ නැහැනෙ. ටිකක් සල්ලන වෙන්නත් එපායැ නේද?
හරි. එතකොට මේ javascript කියන්නෙ මොකක්ද? මේක Scripting Language එකක් කියල හඳුන්වනව. Javascript කියනකොට හා ලියනකොට ලියන්නෙ එකටමයි. වචන 2ක් එහෙම නෙමෙයි. ඒ වගේම Java කියන Programming Language එකේ කොටසකුත් නෙමෙයි හොඳද... මේකෙන් කරන්න පුළුවන් වැඩ එමටයි.. එපි ඒව හෙමින් කතා කරමු. අද අපි පළවෙනි HTML Page එක හදන්න යන්නෙ...
දැන් හැමෝම මම කියන වැඩේ කරන්න හරිද. හදාගන්න Desktop එකේ Folder එකක්... දැන් Notepad එක ඕපන් කරගන්න.. අනේ මගෙන් අහන්න නම් එපා Notepad එක කියන්නෙ මොකක්ද.. ඒක Open කරගන්නෙ කොහොමද කියල නම්.. ඒ දේත් බැරි නම් Web Designing ඉගෙන ගන්න කලින් යන්න Office Course එකක් කරන්න...
දැන් මම මේ දෙන කෝඩ් එක Copy කරල ඒ Open කර ගත්තු Notepad එකේ Paste කරල Save කරන්න. Save කරද්දි මතක ඇතුව මෙන්න මේ විදියට කරන්න හොඳද...
File Type එක All Files දීල File Name එක දෙන්න new.html කියල හොඳද...
මෙන්න Code එක.
- CODE: SELECT ALL
<!DOCTYPE html>
<html>
<head>
<title>My First Web Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<head>
<body>
...Your Content Here...
</body>
</html>
දැන් ඒ Save කරපු File එක ඔයාට Google Chrome එකෙන් හරි FireFox හරි මොනවහරි Internet Browser එකකින් Open කරල බලන්න පුළුවන්.. දැන් කියල දෙන්නම්...
- CODE: SELECT ALL
<!DOCTYPE html>
මොකක්ද මේ Doctype කියන්නෙ? මේක ගැන වැඩිය දැම්මම හිතන්න එපා. HTML වලදි අපිට මේක ඒ තරම් වැදගත් නෑ දැනට...
- CODE: SELECT ALL
<html></html>
මේ Tags 2න් තමයි අපේ HTML Document එකක් මේක මේ Website එකක්මයි කියල browser එක තේරුම් ගන්නෙ. ඒ හින්ද ඒ 2 අත්යාවශ්යයි.. ඒ වගේම මේකෙ Opening Tag and Close Tag කියල 2ක් තියෙනව. මේ 2ම ඕන සම්පූර්ණ වෙන්න නම්...
- CODE: SELECT ALL
<head></head>
මේ Head එකේ ඇතුලෙ තමයි අපි ලියන්නෙ අපේ Webpage එකට අත්යාවශ්ය නමුත් එලියට නොපෙනෙන දේවල් ටික. මේව CSS කරද්දි අපි හොඳට ඉගෙන ගමු.
- CODE: SELECT ALL
<body>
...Your Content Here...
</body>
මේ Body එක ඇතුලෙ තමයි අපේ Webpage එකේ පිටතට පේන හැම දෙයක්ම ලියන්නෙ.... ඊලඟ ලිපියෙ ඉඳන් කියල දෙන හැම Code එකක්ම අපි ලියන්නෙ මෙන්න මේ Your Content Here කියන තැන තමයි...
එහෙනම් ඊලඟ ලිපියෙන් හමු වෙනකන් බයි බායි....
