Search Engine friendly HTML code

ကိုယ်ဆိုဒ်တခု ဘလော့ တစ်ခုရေးထားပြီး ဘာကြောင့် search engine မှာ ရှာမတွေ့လည်း  ထိပ်ဆုံးက မတတ်လဲ ဆိုတာမျိုး ဖြစ်ဖူးကြမှာပါ။ ဒါတွေကတော့ လွယ်ကူပြီး သတိမထားမိတဲ့ အချက်ကလေးတွေ ကြောင့်ပါ။

၁. ရှင်းလင်းပြီး Search Engine ကနားလည်တဲ့နာမည်မျိုးပေးကြပါ။

<title>Ahkeno’s Blog</title>

<title></title> tag လေးဟာ ကိုယ့် web page ကို search engine ကနေရှာဖွေရာမှာလွယ်ကူအောင်လုပ်ဆောင်ပေးတဲ့ tag လေးပါ။ ဒါကြောင့် <title>tag  လေးထဲမှာ ရိုးရှင်းပြီး နားလည်လွယ်တဲ့ နာမည်မျိုးပေးကြပါ။

၂. Meta Tag မှာ ကိုယ်ဖော်ပြလိုတဲ့ အကြောင်းအရာလေးတွေကိုဖော်ပြပေးပါ။

ဥပမာအားဖြင့် အကီနိုက CodeIgniter အကြောင်း ရေးထားရင် Title မှာ codeigniter လို့ပေးထားပြီး Meta tag မှာတော့ Why we use codeigniter လို့ရေးသားထားခြင်း အားဖြင့် search engine က spider တွေက ဒီပိုစ်ဟာ ခေါင်းစဉ် codeigniter ဖြစ်ပြီး ရှင်းလင်း ထားတာတွေက Why we use codeigniter လို့နားလည်သွားမှာပါ။

၃.ကိုယ့်ရဲ့ page layout ကိုရှင်းလင်းတဲ့ div နဲ့တည်ဆောက်ပါ။

အခြေခံအားဖြင့် page တခုမှာ header, main_content, footer ဆိုပြီး div နဲ့ အပိုင်းလေးတွေ ခွဲပြီး ရေးသားထားခြင်း အားဖြင့် ပြုပြင်ချိန်မှာ လွယ်ကူပြီး search engine ကလည်း ဒီအပိုင်းက header ပိုင်း ခေါင်းစဉ်လို့ နားလည်ပြီး search ရှာတဲ့အခါ ခေါင်းစဉ်ပိုင်း အနေနဲ့ ဖော်ပြပေးမှာပါ။

၄.CSS/JS ဖိုင်တွေကိုခွဲသိမ်းပါ။

မှတ်သား ထားဖို့ရာ spider တွေဟာ HTML code တွေကိုပဲ ဖတ်ပါတယ်။ ဒါကြောင့် ကိုယ့် page စစချင်းမှာ CSS/JS တွေရဲ့ ရှုပ်ထွေးတဲ့ အရေးသားတွေကို နားမလည်ပဲ ကိုယ် page ကို user friendly မဖြစ်ဘူးလို့ သတ်မှတ် သွားနိုင်တာကြောင့် CSS/JS ဖိုင်တွေကို အပြင်မှာပဲ ရေးပေးပါ။

၅. Tag တွေကို ရေးသားရာမှာ Lower case နဲ့ပဲရေးပေးပါ။

အဆင့်အတန်းမြင့်ပြီး သေသပ်တဲ့ coding ရေးသူဟာ tag တွေကို lower case နဲ့ပဲရေးလေ့ရှိပါတယ်။

၆. Image/Link တွေအတွက် Alt attribute မှာ ပုံနဲ့ သတ်ဆိုင်တဲ့စာသားလေးထည့်ပေးပါ။

ဒီလိုုလုပ်ပေးခြင်း အားဖြင့် တခါတလေ Connection မကောင်းလို့ loading time ကြာချိန်မှာ ပုံမတတ်လာခင် ပုံ/link နဲ့ သတ်ဆိုင်တဲ့ စာသားလေးတွေ အရင် တတ်လာသလို search engine မှာလည်း အလွယ်တကူ ထိပ်ဆုံးရောက်မှာပါ။

၇.ရှင်းလင်းပြီး သေသပ်တဲ့ အရေးသားနဲ့ ကိုယ့်ရဲ့အရည်အသွေးကိုဖော်ပြပါ။

လိုအပ်တဲ့ tag တိုင်းရဲ့နောက်မှာ close tag တွေ ပိတ်ပေးသလို။ single tag တွေရဲ့ နောက်မှာလဲ အပိတ်ထည့်ပေးပါ။

ဥပမာ။

<img src=”images/sample.jpg” alt=”sample” />
<a href=”#” title=”test”>test</a>
<p>some sample text </p>

Facebook comments:

2 Responses

  1. saturngod says:

    we also need to careful about header tag.
    Example:
    header tag should be
    <h1>This is Top Header</h1>
    some text
    <h2>Sub Header</h2>
    some text
    <h3>sub sub header</h3>
    some list
    but most of the ppl using like this
    <h2>This is Top Header</h2>
    some text
    <h2>Sub Header<h2>
    some text
    <h1>sub sub header</h1>
    some list
    so, search engine can’t describe what content is main and important.
    Friendly URL is also important.

Leave a comment


*