Monday, July 15, 2013

HTML Chapter 12 _ Comment, Website Layout

HTML Comment <!--...--> Tag

Comment tag ကို အမွတ္အသားျပဳလုပ္ေသာ အခါတြင္သံုးပါတယ္။ HTML တြင္ comment tag ကို ေရးေပမယ့္ Browser မွာမေဖာ္ျပ ေပးပါဘူး။ comment ေရးသားျခင္း ၏ေကာင္းေသာ အခ်က္မ်ားက HTML document ကို edit ျပန္လုပ္ေသာ အခါ ရွာေဖြရလြယ္ကူပါတယ္။ web page တစ္ခု ေဆာက္ရာတြင္ HTML source code ေပါင္းမ်ားစြာ ျဖင့္ ျပဳလုပ္ရေသာေၾကာင့္ edit လုပ္ရာတြင္ ရွာေဖြရ ၾကာတတ္ပါတယ္။ comment tag သံုးထားျခင္းျဖင့္ ရွာေဖြရလြယ္ကူပါတယ္။

 

Example:

<div id="wrapper">  <!--Start of wrapper -->
<div id="header"> This is header </div>
<div id="content"> This is content </div>
<div id="footer"> This is footer </div>
</div>  <!--End of wrapper -->

 

Website Layout

Website အမ်ားစုသည္ ၄င္းတို.၏ content မ်ားကို magazine, newspaper တို.ကဲ့သို. multiple columns ျဖင့္ ေဖာ္ျပေလ့ ရွိပါတယ္။ webpage မွာ multiple columns ဖန္တီးဖို. <div> သို.မပာုတ္ <table> elements မ်ားကို သံုးရပါတယ္။ ၄င္း <div> ႏွင့္ <table> element တို.၏ Position အတြက္ CSS ကို အသံုးျပဳရပါတယ္။ <tabel> ျဖင့္ layout ခ်ႏိုင္ ေသာ္လည္း table မွာ ဇယားျဖင့္ ျပရေသာ (tabular data) မ်ားအတြက္ အသံုးျပဳဖို.ျဖစ္ျပီး Layout tool မပာုတ္ပါဘူး။

Webpage တစ္ခု၏ layout ကို သံုးပိုင္း ပိုင္းျခားျပီး ဆြဲလ်င္ အလြန္လြယ္ကူပါတယ္။ မည္သည့္ website ပဲျဖစ္ပါေစ အေျခခံ အားျဖင့္ သံုပိုင္းပါ၀င္ပါတယ္။ ၄င္းတို.မွာ header, content, footer တို.ပဲျဖစ္ပါတယ္။


  • Header မွာေတာ့ Logo, menu, search, login, etc... စသည္တို.အတြက္ ေရးသားေလ့ရွိပါတယ္။
     
  • Content မွာေတာ့ အေၾကာင္းအရာေတြကို ေဖာ္ျပေပးဖို. ေရးပါတယ္။
     
  • Footer ပိုင္းမွာေတာ့ footer menu link, copyright တို.ကိုေဖာ္ျပဖို.ျဖစ္ပါတယ္။

 
Website တစ္ခုမွာ Web page မ်ားစြာ ရွိပါတယ္။ webpage ဘယ္ေလာက္မ်ားမ်ား page တိုင္းမွာ Logo, menu, copy စသည့္ Header ႏွင့္ Footer အပိုင္း တို.မွာ page တိုင္းမွာပါ၀င္ျပီး content အပိုင္းသာလ်င္ ေျပာင္းလဲသြားပါတယ္။ ထို.ေၾကာင့္ သံုးပိုင္းခြဲျပီး ေရးတဲ့အတြက္ အခ်ိန္ကုန္သက္သာသည့္အျပင္ Design ကို Edit လုပ္ရာမွာလည္း ရွာေဖြလုပ္ေဆာင္ရတာ လြယ္ကူေစပါတယ္။ ထို.ျပင္ မိမိ၏ Design ကို Web developers မ်ားမွ php စသည္ ျဖင့္ web development လုပ္ရာတြင္ အဆင္ေျပ ေစပါတယ္။

Chapter 13 မွာ က်ေနာ္တို. Web layout ကိုလက္ေတြ.လုပ္ေဆာင္ျပပါမယ္။

No comments:

Post a Comment