ශෝක් නින්දකට පස්සේ ඔන්න අදත් ඇහැරුණා. දැන් නම් අටට විතර ඇති. මේ දවස් වල සීතලයි වැස්සයි නිසා හරිම කම්මලියි. ඒකයි මෙච්චර වෙලා නින්ද ගියේ. එහෙම වුණාය කියලා පාඩම නතර කරන්න පුළුවන් යැ නේද? ලැප්ටොප් එකත් ඕන් කරලා තිබුණ නිසා බැටරිය බැහැලා එයත් දොයි. ඔන්න මගේ මිත්රයාත් මට රිංග් කරනවා ඇහැරෙන්නය කියලා. තව ටිකකින් මිනිහත් මෙහෙට ගොඩ වෙයි. එයා එනකන් ඉන්න බෑ. එතකන් අපි පාඩම කරමුකෝ.
අපි ඊයේ අපේ පිටුව සේව් කර ගත්ත ගත්තමයි එතනින් එහාට මුකුත් කියන්න බැරි වුණා නෙ මට නිදිමත හැදිලා. දැන් ඔයාල ඒ වෙබ් පිටුව සේව්කර ගත්තු තැනට ආයෙත් යන්න. ඔයාලට පෙනෙයි ඒ පිටුවේ අයිකොන් එක ඉන්ටර්නෙට් එක්ස්ප්ලෝරර් වල හරි ෆයර්ෆොක්ස් වල හරි අයිකොනයක් අරන් තියෙනවා. ඒ කියන්නේ අපි සේව් කරලා තියෙන්නේ වෙබ් පිටුවක් විදියට කියලායි.
අපි ඊයේ අපේ පිටුව සේව් කර ගත්ත ගත්තමයි එතනින් එහාට මුකුත් කියන්න බැරි වුණා නෙ මට නිදිමත හැදිලා. දැන් ඔයාල ඒ වෙබ් පිටුව සේව්කර ගත්තු තැනට ආයෙත් යන්න. ඔයාලට පෙනෙයි ඒ පිටුවේ අයිකොන් එක ඉන්ටර්නෙට් එක්ස්ප්ලෝරර් (internet explorer) වල හරි ෆයර්ෆොක්ස් (firefox) වල හරි අයිකොනයක් අරන් තියෙනවා. ඒ කියන්නේ අපි සේව් කරලා තියෙන්නේ වෙබ් පිටුවක් විදියට කියලායි. දැන් ඒ පිටුව උඩ ඩබල් ක්ලික් කරලා දැනට ඔයාලගේ කොම්පියුටරේ තියෙන වෙබ් බ්රවුසරයකින් විවෘත කර ගන්න. හ්ම්ම්... වුණු මහන්සියේ කිසිම ප්රතිපලයක් නම් දකින්න නෑ වගේ කියලා ඔයාලට හිතෙයි. ඔයාලට සුදු පාට හිස් පසුබිමක් විතරක් පෙනෙන්න ඇති. අනිවාර්යෙන්ම එහෙම තමයි වෙන්න ඕනෙ. මොකද අපි වෙබ් පිටුවේ මුකුත්ම ලියුවේ නැහැනේ. හෝව්... හෝව්... පොඩ්ඩක් කල්පනා කරන්න මුකුත්ම ලියුවේ නැද්ද කියලා. ඔව්... අපි ලියුවා. ඒ HTML කේත විතරයි. ඒත් අපි පෙන්වන්න ඕනෙ කිසි දෙයක් ලියුවේ නැහැ නේ. අපි තාම හැදුවේ පිටුවේ ව්යූහය විතරයි. මතකයි නේද මම කියුවා මොන ටැග් අතරේ මොනා ලියුවත් වැඩක් නෑ "body" ටැග් එක ඇතුලේ ලියවෙන දෙයක් ලියුවොත් විතරයි පෙන්නන්නේ බ්රවුසරයෙන්.
Internet Explorer වල නම් මෙනූ බාර් එකේ "View" ක්ලික් කරලා "Source" ක්ලික් කරල හරි, නැත්තම් Firefox වල නම් මෙනූ බාර් එකේ "View" ක්ලික් කරාම "Page Source" ක්ලික් කරන්න. ඔන්න එතකොට ඒවි වින්ඩෝ එකක්. ඒකේ මොනාද තියෙන්නේ? අපි Notepad එකේ ලියපු කේත ටික නේද? හ්ම්ම්... ඔය ව්දියට හැම බ්රවුසරයේම තමන්ගේ වෙබ් පිටුවේ කෙත ටික බලා ගන්න පුළුවන්. වැරදි තියෙනවා නම් කියවලා බලලා හදා ගන්නත් පුළුවන්. ඒත් දැන් නම් ඔය දේවල් පාවිච්චි වෙනවටත් වඩා ඇඩෝබේ ඩ්රීම්වීවර් (Adobe Dreamweaver) වගේ සොෆ්ට්වෙයා එකකින් ලේසියෙන්ම HTML කේතනය කර ගන්න පුළුවන්. තාක්ෂණයේ දියුණුව හොඳින්ම පාවිච්චි කර ගෙන වෙබ් නිර්මාණය කරන්න පුළුවන් මේ වගේ සොෆ්ට්වෙයා තවත් ඇති. හැබැයි මට මිතුරු නම් ඕක තමයි. මාත් මුලදී නම් නෝට්පෑඩ් එකෙනුයි කරේ ඉගෙන ගනිද්දී. කටු කන තරමට ඉගෙන ගන්නවාත් වැඩියි නෙව. ඒ නිසා ඔයාලටත් මම මුලින්ම හොඳ කටු ටිකක් කවන්නම්කෝ. හික් හික්... කැමති කෙනෙක් කැමති එඩිටරයක් (code editor) පාවිච්චි කරනවා හොඳා. ඒත් මම ආධුනිකයන්ට යෝජනා කරන්නේ නෝට්පෑඩ්ම තමා.
අපි දැන් කතා කරා ඇති. ආයෙත් වැඩට බහිමු. දැන් අපි ඇහැට දකින්න පුළුවන් දෙයක් කරමු. ඉස්සෙල්ලාම අපි HTML වල 'හෙඩිම' වර්ග ඉගෙන ගමු. ඒ කියන්නේ වචන දාල මොනා හරි ලියලා ඒවා වල ප්රමාණය වෙනස් කරන්නයි අපි හදන්නේ හෙඩිම ටැග් වලින්. මේවාත් යුගල ටැග්. එකම විදියට පාවිච්චි වෙන මේ හෙඩිමවල් තියෙන්නේ වචන එක්ක සෙල්ලම් කරන්නයි. හෙඩිමක් කියන්නේ සිංහලෙන් කියනවා නම් "Headline" නැත්තම් "Heading" කියන එකටනේ. හරියටම කියනවා නම් විවිධ ප්රමාණ හයකින් යුත් මේ හෙඩිම නැත්තම් ශීර්ෂපාඨ HTML වල හඳුන්වලා දීලා තියෙනවා. මේ ටැග් වල ආරම්භක හා වැසෙන ටැග් අතරේ ලියන ඕනෙම වචනයක් අපිට බ්රවුසරයෙන් ඒ ඒ හෙඩිමේ ප්රමාණය අනුව බලා ගන්න පුළුවන්.
මේවා ලියන්නේ body ටැග් යුගල අතරේ බව හොඳින් මතක තියා ගන්න. අපිට යමක් පෙන්වන්න ඕනේ නම් body ටැග් අතරේ ලිවිය යුතුයි. අපි මින් එහාට ලියන බොහෝමයක් දේවල් ඒ යුගලය අතරෙයි ලියන්න හදන්නේ. ඉන් වෙනස් වෙන අවස්ථා වලදී මන් පැහැදිලිව ඔයාලට දැනුම් දෙන්නම්කෝ.
අපි ඊයේ අපේ පිටුව සේව් කර ගත්ත ගත්තමයි එතනින් එහාට මුකුත් කියන්න බැරි වුණා නෙ මට නිදිමත හැදිලා. දැන් ඔයාල ඒ වෙබ් පිටුව සේව්කර ගත්තු තැනට ආයෙත් යන්න. ඔයාලට පෙනෙයි ඒ පිටුවේ අයිකොන් එක ඉන්ටර්නෙට් එක්ස්ප්ලෝරර් වල හරි ෆයර්ෆොක්ස් වල හරි අයිකොනයක් අරන් තියෙනවා. ඒ කියන්නේ අපි සේව් කරලා තියෙන්නේ වෙබ් පිටුවක් විදියට කියලායි.
අපි ඊයේ අපේ පිටුව සේව් කර ගත්ත ගත්තමයි එතනින් එහාට මුකුත් කියන්න බැරි වුණා නෙ මට නිදිමත හැදිලා. දැන් ඔයාල ඒ වෙබ් පිටුව සේව්කර ගත්තු තැනට ආයෙත් යන්න. ඔයාලට පෙනෙයි ඒ පිටුවේ අයිකොන් එක ඉන්ටර්නෙට් එක්ස්ප්ලෝරර් (internet explorer) වල හරි ෆයර්ෆොක්ස් (firefox) වල හරි අයිකොනයක් අරන් තියෙනවා. ඒ කියන්නේ අපි සේව් කරලා තියෙන්නේ වෙබ් පිටුවක් විදියට කියලායි. දැන් ඒ පිටුව උඩ ඩබල් ක්ලික් කරලා දැනට ඔයාලගේ කොම්පියුටරේ තියෙන වෙබ් බ්රවුසරයකින් විවෘත කර ගන්න. හ්ම්ම්... වුණු මහන්සියේ කිසිම ප්රතිපලයක් නම් දකින්න නෑ වගේ කියලා ඔයාලට හිතෙයි. ඔයාලට සුදු පාට හිස් පසුබිමක් විතරක් පෙනෙන්න ඇති. අනිවාර්යෙන්ම එහෙම තමයි වෙන්න ඕනෙ. මොකද අපි වෙබ් පිටුවේ මුකුත්ම ලියුවේ නැහැනේ. හෝව්... හෝව්... පොඩ්ඩක් කල්පනා කරන්න මුකුත්ම ලියුවේ නැද්ද කියලා. ඔව්... අපි ලියුවා. ඒ HTML කේත විතරයි. ඒත් අපි පෙන්වන්න ඕනෙ කිසි දෙයක් ලියුවේ නැහැ නේ. අපි තාම හැදුවේ පිටුවේ ව්යූහය විතරයි. මතකයි නේද මම කියුවා මොන ටැග් අතරේ මොනා ලියුවත් වැඩක් නෑ "body" ටැග් එක ඇතුලේ ලියවෙන දෙයක් ලියුවොත් විතරයි පෙන්නන්නේ බ්රවුසරයෙන්.
Internet Explorer වල නම් මෙනූ බාර් එකේ "View" ක්ලික් කරලා "Source" ක්ලික් කරල හරි, නැත්තම් Firefox වල නම් මෙනූ බාර් එකේ "View" ක්ලික් කරාම "Page Source" ක්ලික් කරන්න. ඔන්න එතකොට ඒවි වින්ඩෝ එකක්. ඒකේ මොනාද තියෙන්නේ? අපි Notepad එකේ ලියපු කේත ටික නේද? හ්ම්ම්... ඔය ව්දියට හැම බ්රවුසරයේම තමන්ගේ වෙබ් පිටුවේ කෙත ටික බලා ගන්න පුළුවන්. වැරදි තියෙනවා නම් කියවලා බලලා හදා ගන්නත් පුළුවන්. ඒත් දැන් නම් ඔය දේවල් පාවිච්චි වෙනවටත් වඩා ඇඩෝබේ ඩ්රීම්වීවර් (Adobe Dreamweaver) වගේ සොෆ්ට්වෙයා එකකින් ලේසියෙන්ම HTML කේතනය කර ගන්න පුළුවන්. තාක්ෂණයේ දියුණුව හොඳින්ම පාවිච්චි කර ගෙන වෙබ් නිර්මාණය කරන්න පුළුවන් මේ වගේ සොෆ්ට්වෙයා තවත් ඇති. හැබැයි මට මිතුරු නම් ඕක තමයි. මාත් මුලදී නම් නෝට්පෑඩ් එකෙනුයි කරේ ඉගෙන ගනිද්දී. කටු කන තරමට ඉගෙන ගන්නවාත් වැඩියි නෙව. ඒ නිසා ඔයාලටත් මම මුලින්ම හොඳ කටු ටිකක් කවන්නම්කෝ. හික් හික්... කැමති කෙනෙක් කැමති එඩිටරයක් (code editor) පාවිච්චි කරනවා හොඳා. ඒත් මම ආධුනිකයන්ට යෝජනා කරන්නේ නෝට්පෑඩ්ම තමා.
අපි දැන් කතා කරා ඇති. ආයෙත් වැඩට බහිමු. දැන් අපි ඇහැට දකින්න පුළුවන් දෙයක් කරමු. ඉස්සෙල්ලාම අපි HTML වල 'හෙඩිම' වර්ග ඉගෙන ගමු. ඒ කියන්නේ වචන දාල මොනා හරි ලියලා ඒවා වල ප්රමාණය වෙනස් කරන්නයි අපි හදන්නේ හෙඩිම ටැග් වලින්. මේවාත් යුගල ටැග්. එකම විදියට පාවිච්චි වෙන මේ හෙඩිමවල් තියෙන්නේ වචන එක්ක සෙල්ලම් කරන්නයි. හෙඩිමක් කියන්නේ සිංහලෙන් කියනවා නම් "Headline" නැත්තම් "Heading" කියන එකටනේ. හරියටම කියනවා නම් විවිධ ප්රමාණ හයකින් යුත් මේ හෙඩිම නැත්තම් ශීර්ෂපාඨ HTML වල හඳුන්වලා දීලා තියෙනවා. මේ ටැග් වල ආරම්භක හා වැසෙන ටැග් අතරේ ලියන ඕනෙම වචනයක් අපිට බ්රවුසරයෙන් ඒ ඒ හෙඩිමේ ප්රමාණය අනුව බලා ගන්න පුළුවන්.
මේවා ලියන්නේ body ටැග් යුගල අතරේ බව හොඳින් මතක තියා ගන්න. අපිට යමක් පෙන්වන්න ඕනේ නම් body ටැග් අතරේ ලිවිය යුතුයි. අපි මින් එහාට ලියන බොහෝමයක් දේවල් ඒ යුගලය අතරෙයි ලියන්න හදන්නේ. ඉන් වෙනස් වෙන අවස්ථා වලදී මන් පැහැදිලිව ඔයාලට දැනුම් දෙන්නම්කෝ.
5 comments:
හෆ්ෆා කෝමද මට මේක මිස් උනේ :D.මගෙ ලමයි ටිකත් මෙතෙන්ට එවන්න ඕනේ :D
hafoo ehenam wahaama lamai tikat ekkan awit pattakin waadi wunaa nam...
මම මුලින්ම html ඉගෙන ගත්තෙ, MSIE වල Page Cannot be displayed කියන page එකේ code එක බලල. :D
මගේ බ්ලොග් එකේ ලගකදි ඉදලා Template save වෙද්දී මෙහෙම දෝෂයක් එනවා save වෙන්නෑ
We were unable to preview your template
Please correct the error below, and submit your template again.
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The element type "li" must be terminated by the matching end-tag "".
ඔයාගෙ බ්ලොග් එකේ HTML කෝඩ් එක ඔයා modify කරන්න ගියා නම් මෙහෙම දෙයක් වෙන්න පුලුවන්. මොකද මේකේ කියලා තියෙන්නෙ අදාළ ටැග් හරියට OPEN කරලා CLOSE කරලා නැහැ කියලයි. එහෙම වුනාම බ්රවුසරයකින් පෙන්වද්දී දෝශ ඇති වෙන්න පුළුවන්. ඔයාගේ බ්ලොග් එකේ DROP DOWN මෙනුවක් තියෙනවද? එහෙම තියෙනවා නම් ඒක modify කරද්දී <LI> ටැග් එකක් හරියට වැහිලා නැතුව ඇති. මේ ටැග් පාවිච්චි කරන්න පුළුවන් විධි ගොඩක් තියෙනවා. ඒ නිසා හරියට බලන්න ඔයා මොකක් හරි වෙනසක් කරා නම් ඒ තැනට ගිහිල්ලා මම මේ ලිපි වල කියලා තියෙනවා වගේ හරියට විවෘත කරපු ටැග් වහලා තියෙනවාද කියලා.
Post a Comment