Website ေရးနည္း အပုိင္း (၄ + ၅) - html5 and css3

မဂၤလာပါ၊

Singapore Web Design website (web-designer.sg) ကုိ ဥပမာ ထားၿပီးေတာ့ website ေရးနည္းကုိ သင္ျပေပးထားတဲ့ video tutorial ျဖစ္ပါတယ္။ HTML5 နဲ႔ CSS3 ကုိ အသုံးျပဳၿပီး ေရးျပထားပါတယ္။ CSS sprite ေရးနည္းကုိလည္း ဒီတစ္ပတ္ သင္ခန္းစာမွာ သင္ေပးထားပါတယ္။ video ႏွစ္ဖုိင္မွာ တစ္ဖုိင္က အရမ္းတုိးေနပါတယ္။ အသံသြင္းေနတုန္း mic က ဘာျဖစ္သြားလဲ မသိဘူး၊ ဒါေပမယ့္ vlc medai player နဲ႔ အသံကုိ ၂၀၀% ေလာက္ထား နားေထာင္ရင္ ၾကားရပါတယ္။

အရင္တစ္ေခါက္က ေရးတာေတာ့ ေတာ္ေတာ္ေလးၿပီးေနပါၿပီ၊ ကၽြန္ေတာ္တင္ေပးတဲ့ video သင္ခန္းစာေတြကုိ ေတာက္ေလွ်ာက္လုပ္လာတဲ့လူကေတာ့ ဒီအခ်ိန္မွာ website တစ္ခုရဲ႕ စာမ်က္ႏွာ တစ္ဝက္ေလာက္ ၿပီးေနမွာပါ၊ အခုတင္ေပးမယ့္ သင္ခန္းစာ ႏွစ္ခုနဲ႔ပါေပါင္းလိုက္ရင္ေတာ့ website တစ္ခုရဲ႕ စာမ်က္ႏွာ ေလးပုံ သုံးပုံေလာက္ေတာင္ ၿပီးေနမွာပါ။

 အရင္တုန္းက တစ္ပတ္ကုိ သင္ခန္းစာ တစ္ခုပဲ တင္ေပးေပမယ့္ ဒီေန႔ေတာ့ video သင္ခန္းစာ ႏွစ္ခု တင္ေပးလိုက္ပါတယ္။ အားလုံးပဲ လုိက္လုပ္ၾကည့္ပါဦး၊ video သင္ခန္းစာေတြ ၿပီးရင္လည္း ကၽြန္ေတာ္ ေရးထားတဲ့ website files ေတြ အားလုံးကုိ တင္ေပးပါ့မယ္။ ဒီတစ္ပတ္အတြက္ video သင္ခန္းစာေတြကေတာ့ ...

HTML5, CSS3 နဲ႔ Website ေရးနည္း အပုိင္း (၃)

Singapore Web Design (web-designer.sg) website ကုိ နမူနာထားၿပီး website ေရးနည္းကုိ သင္ေပးထားေသာ သင္ခန္းစာျဖစ္ပါတယ္။ ဒီေန႔ တင္ေပးမွာကေတာ့ website ေရးနည္း အပုိင္းသုံး ျဖစ္ပါတယ္။ စာအျဖစ္နဲ႔ေတာ့ ေထြေထြထူးထူး ေျပာစရာမရွိပါဘူး၊ အားလုံး video ထဲမွာ ေျပာျပေပးထားပါတယ္။ ဒီတစ္ေခါက္ video ကေတာ့ နည္းနည္းေလး ရွည္ပါတယ္။ တစ္ကယ္လို႔ youtube က video ေတြ download လုပ္လို႔ မရဘူးဆုိရင္ http://www.downvids.net/ ကုိသြားၿပီးေတာ့ video ရဲ႕ လိပ္စာကုိ paste လုပ္ၿပီး download လုပ္ႏုိင္ပါတယ္။ အဲဒါကုိ အခက္အခဲရွိေနဦးမယ္ဆုိရင္လည္း သိပါရေစ၊ comment ခ်န္ခဲ့ပါ၊ တစ္ျခားေနရာမွာ တင္ေပးလိုက္ပါမယ္။ အရင္က သင္ခန္းစာေတြ ျပန္ၾကည့္ခ်င္တယ္ဆုိရင္ေတာ့ အပုိင္း (၁) HTML5 နဲ႔ CSS3 ကုိ အသုံးျပဳၿပီးေတာ့ Website ေရးနည္း (အပုိင္း ၁) အပုိင္း (၂) Website ေရးနည္း video သင္ခန္းစာ အပုိင္း ၂ (by using HTML5 and CSS3)

အပုိင္း (၃) video ကေတာ့ ေအာက္မွာပါ



HTML5, CSS3 နဲ႔ Website ေရးနည္း အပုိင္း (၃) မွ ကူးယူ ေဖာ္ျပပါသည္။

Website ေရးနည္း video သင္ခန္းစာ အပုိင္း ၂ (by using HTML5 and CSS3)


အရင္ တစ္ေခါက္က html5, css3 နဲ႔ website ေရးနည္း သင္ခန္းစာ ကုိ ၾကည့္ျဖစ္ၾကမယ္ထင္ပါတယ္။ ဒီတစ္ေခါက္ သင္ခန္းစာမွာေတာ့ main menu ေရးပုံကုိ သင္ျပေပးထားပါတယ္။ Singapore Web Design (web-designer.sg)ဆုိက္ကုိ နမူနာ ထားၿပီးေတာ့ ေရးနည္း သင္ေပးထားတာပါ။ အခက္အခဲရွိရင္ေတာ့ comment ေရးခဲ့ပါ။ အရင္တစ္ေခါက္က video ၾကည့္ၿပီး တစ္ခ်ဳိ႕လည္း feed back ေလးေတြေပးၾကတယ္၊ အသံက သိပ္မရွင္းဘူးတုိ႔၊ code ေတြကုိ သိပ္မျမင္ရဘူးတုိ႔ေပါ့ဗ်ာ၊ ၿပီးေတာ့ စကားေျပာတာ ေျပာခ်င္သလိုမေျပာခ်င္သလို ျဖစ္ေနတယ္တဲ့ :D အဲဒါေတြအားလုံးက video ကုိ download လုပ္ရင္ မၾကာေအာင္လို႔ အတတ္ႏုိင္ဆုံးအခ်ိန္ကုိ ခ်ဳံ႕တဲ့ သေဘာပါ၊ video minutes ေတြ မၾကာေအာင္၊ မမ်ားေအာင္၊ စကားကုိ ျမန္ျမန္ေျပာရပါတယ္။ အဲဒါေၾကာင့္ စကားက ေျပာခ်င္သလို မေျပာခ်င္သလို ျဖစ္ေနႏုိင္ပါတယ္။ နားမလည္လိုက္ရင္ ျပန္ရစ္ၿပီး နားေထာင္ေပးပါ။ အသံသိပ္မရွင္းလိုက္တာမ်ဳိးဆုိရင္ ျပန္ျပန္ရစ္ၿပီး နားေထာင္ပါ၊ နားလည္သြားပါလိမ့္မယ္။ code ေတြကုိ ေသခ်ာမျမင္ရတာမ်ဳိးဆုိရင္ေတာ့ video ကုိ full screen ခ်ဲ႕ၿပီးၾကည့္ပါ၊ ဒါဆုိရင္ အဆင္ေျပသြားမယ္လို႔ ေမွ်ာ္လင့္ပါတယ္။ ကုိယ္က download လုပ္ၿပီးသြားရင္လည္း download လုပ္ရတာ အခက္အခဲရွိတဲ့သူေတြကုိ မွ်ေဝေပးေပါ့ဗ်ာ။ သူမ်ားကို ေပးကမ္းတဲ့အလုပ္က ျမင့္ျမတ္သူေတြမွ လုပ္ႏုိင္တာတဲ့ဗ်။


Credit: Website ေရးနည္း video သင္ခန္းစာ အပုိင္း ၂ (by using HTML5 and CSS3)

HTML5 နဲ႔ CSS3 ကုိ အသုံးျပဳၿပီးေတာ့ Website ေရးနည္း (အပုိင္း ၁)

မဂၤလာပါ၊ အရင္တစ္ေခါက္တုန္းကေတာ့ html4 နဲ႔ css2 ကုိ အသုံးျပဳၿပီး website ေရးနည္း ကုိ video recording နဲ႔ တင္ေပးဖူးပါတယ္။ ဒီတစ္ေခါက္မွာေတာ့ ေနာက္ဆုံးေပၚျဖစ္တဲ့ HTML5 နဲ႔ CSS3 ကုိသုံးၿပီးေတာ့ website ေရးတာကုိ video recording လုပ္ထားေပးပါတယ္။ (web-designer.sg) website ရဲ႕ design ကုိ ၾကည့္ၿပီးေတာ့ HTML5 နဲ႔ CSS3 coding ကုိ ျပန္ေရးျပတာ ျဖစ္ပါတယ္။ video ကုိ download လုပ္ရတာအဆင္ေျပေအာင္၊ video လည္း ဝါးတားတားမျဖစ္ေအာင္ အေကာင္းဆုံး size ကုိ ခ်ိန္ၿပီးေတာ့ တင္ထားေပးပါတယ္။ ၾကည့္ရတာ အဆင္မေျပဘူး ေသခ်ာမရွင္းဘူးဆုိရင္ေတာ့ video ကုိ full screen ေျပာင္းၿပီး ၾကည့္ပါ။ full screen ကုိ ေအာက္ကပုံမွာ ဝုိင္းျပထားတာေလးကုိ ႏွိပ္လိုက္ရင္ အက်ယ္ျမင္ရပါၿပီ။

  youtube full screen   

 သင္ခန္းစာ Video ၾကည့္မယ္ဆုိရင္ေတာ့ ေအာက္မွာပါ။


Credit: HTML5 နဲ႔ CSS3 ကုိ အသုံးျပဳၿပီးေတာ့ Website ေရးနည္း (အပုိင္း ၁)

How to make main menu – blogspot

မဂၤလာပါ.. ဒီတစ္ေခါက္ေတာ့ blogspot နဲ႔ လုပ္ထားတဲ့ website ေတြမွာ Main Menu ထည့္သြင္းပုံကုိ ေျပာျပမွာ ျဖစ္ပါတယ္။ Blog spot ရဲ႕ အားသာခ်က္ေတြကုိေတာ့ blogger (blogspot) strong points မွာ ေျပာျပထားဖူးပါတယ္။ ဘေလာ့ေရးေတာ့မယ္ဆုိရင္ ဖတ္ထားသင့္တဲ့ ေဆာင္းပါးတစ္ခုလည္း ျဖစ္ပါတယ္။ အခုေျပာျပမယ့္ သင္ခန္းစာကုိေတာ့ ကုိယ္ပုိင္ blog တစ္ခု ရွိထားမွ လုိက္လုပ္လုိ႔ ရမွာျဖစ္ပါတယ္။ တစ္ကယ္လို႔ ခင္ဗ်ားမွာ ကုိယ္ပုိင္ blog မရွိေသးဘူးဆုိရင္ How to make a blogger website မွာ ဝင္ဖတ္လုိက္ပါ။ blogspot website တစ္ခု ျပဳလုပ္နည္းကုိ ေရးထားေပးပါတယ္။ ဒီေန႔သင္ခန္းစာကေတာ့ အဲဒီ blog မွာ main menu ေပၚေအာင္ ျပဳလုပ္နည္းကုိ ေျပာျပမွာပါ။

အက်ယ္ဖတ္ရန္ --> How to create blogspot main menu

Blogger (blogspot) strong points

ဒီေန႔ ကၽြန္ေတာ္ ေျပာျပခ်င္တာက google blogspot ရဲ႕ အားသာခ်က္ေတြျဖစ္ပါတယ္။ အရင္တစ္ေခါက္က How to make a blogger website မွာ google blogspot ကုိ အသုံးျပဳၿပီးေတာ့ website တစ္ခု ျပဳလုပ္ပုံနဲ႔ google blogger ရဲ႕ အားသာခ်က္၊ ေကာင္းခ်က္ ေတြကုိ အက်ဥ္းခ်ဳပ္ ေဖာ္ျပခဲ့ပါတယ္။ ယခု post က အဲဒီ အက်ဥ္းခ်ဳပ္ေတြကုိ ျပန္ရွင္းလင္းတဲ့ သင္ခန္းစာလို႔လည္း သတ္မွတ္လုိ႔ရပါတယ္။ အရင္ သင္ခန္းစာကုိ မဖတ္ရေသးသူမ်ား အထက္ပါ link မွာ ဝင္ေရာက္ ဖတ္ရႈႏုိင္ပါတယ္။

Blogger ရဲ႕ အားသာခ်က္ေတြက -
- Google hosting မွာ run ခြင့္ရတဲ့အတြက္ အျမန္ႏႈန္း စိတ္မပူရျခင္း
- SEO ေကာင္းမြန္ေအာင္ အလြယ္တကူ ျပဳလုပ္ႏုိင္ျခင္း
- Google Plus social network နဲ႔ ခ်ိတ္ဆက္ၿပီး မိမိ website လူဝင္မ်ားေအာင္ ျပဳလုပ္ႏုိင္ျခင္း
- ပုံတင္တဲ့အခါမွာ Google Picasa ကုိ ေရာက္သြားတဲ့အတြက္ ပုံေတြ တစ္စုတစ္စည္းထဲ ျပန္ၾကည့္ႏုိင္ျခင္း။
- Video တင္တဲ့အခါမွာ youtube နဲ႔ ခ်ိတ္ဆက္ထားတာေၾကာင့္ youtube မွ ၾကည့္မယ့္သူမ်ားအတြက္လည္း အဆင္ေျပျခင္း
- Interface ေကာင္းမြန္ျခင္း
- adsense နဲ႔ ခ်ိတ္ဆက္ကာ မိမိ blog မွာ ေၾကာျငာထည့္သြင္းၿပီး ေငြရွာႏုိင္ျခင္း။
- Widgets မ်ားေကာင္းမြန္ျခင္း။

အေသးစိတ္ကုိ ေအာက္ပါလင့္ခ္မွာ ဖတ္ရႈႏုိင္ပါတယ္။

blogger (blogspot) strong points

How to make a blogger website

မဂၤလာပါ..
ဒီတစ္ေခါက္ေတာ့ ကၽြန္ေတာ္တုိ႔ ကုိယ္ပုိင္ blogger website ျပဳလုပ္ပုံကုိ သင္ေပးမွာ ျဖစ္ပါတယ္။ သင္ခန္းစာ မစခင္ ကၽြန္ေတာ္တုိ႔ blogger ကုိ ဘာလို႔ ေရြးရသလဲ၊ ခင္ဗ်ားတုိ႔ေကာ website ျပဳလုပ္တဲ့ အခါမွာ blogger ကုိ ဘာေၾကာင့္ ေရြးသင့္လဲ ဆုိတာကုိ မိတ္ဆက္အေနနဲ႔ အနည္းငယ္ ေျပာျပပါမယ္။
ကၽြန္ေတာ္က blogger ကုိ ဘာေၾကာင့္ ေရြးသလဲဆုိေတာ့ ကၽြန္ေတာ္ကုိယ္တုိင္ကုိက google ကေပးတဲ့ services ေတြကုိ ႀကိဳက္လုိ႔ပါ။ Blogger ဆုိတာက google က ေပးတဲ့ services ေတြထဲက တစ္ခုျဖစ္ပါတယ္။ Blogger ကုိ လူတုိင္းမသိႏုိင္ေပမယ့္၊ google ကုိေတာ့ လူတုိင္း သိမွာပါ။
ခင္ဗ်ားတုိ႔ကေရာ blogger ကုိ ဘာေၾကာင့္ ေရြးသင့္သလဲဆုိေတာ့ အဓိက အေၾကာင္းအရင္းကေတာ့ google ပါပဲ။ Blogger က google product တစ္ခုျဖစ္တဲ့အတြက္ေၾကာင့္ google ရဲ႕ မ်က္ႏွာသာေပးျခင္း ခံရပါတယ္။ ဘယ္လုိမ်က္ႏွာေပးခံရလဲဆုိတာကိုေတာ့ ေအာက္ပါလင့္ခ္မွာ သြားေရာက္ ဖတ္ရႈႏုိင္ပါတယ္။

အားလုံး တုိးတက္ေနတဲ့အခ်ိန္မွာ ေနာက္က်မက်န္ခဲ့ေစဖုိ႔

မဂၤလာပါ၊ အားလုံးပဲ ႏွစ္သစ္မွာ ေပ်ာ္ရႊင္ပါေစ။ ဒီေန႔ကေတာ့ အေထြေထြ ဗဟုသုတ တစ္ခုေလာက္ ေဝမွ်ခ်င္ပါတယ္။ အားလုံးသိတဲ့အတုိင္း ကၽြန္ေတာ္တုိ႔ ျမန္မာႏုိင္ငံက တျဖည္းျဖည္းနဲ႔ တုိးတက္ေနပါၿပီ။ အဲဒီလုိ အဖက္ဖက္ကေန တုိးတက္ေနတဲ့အခ်ိန္မွာ မီေအာင္မလုိက္ႏုိင္လို႔ ေနာက္က် က်န္ခဲ့ရင္ ေနာင္တစ္ခ်ိန္မွ မီေအာင္ျပန္လုိက္ႏုိင္ဖုိ႔ဆုိ ေတာ္ေတာ္ႀကီးကုိ ခက္ခဲသြားမွာပါ။ ကၽြန္ေတာ္ကေတာ့ နည္းပညာသမားဆုိေတာ့ နည္းပညာနဲ႔ ပတ္သတ္တာကုိပဲ ေျပာမွာပါ။ တုိင္းျပည္ႀကီးက တုိးတက္လာတဲ့ အတြက္ေၾကာင့္မုိ႔လို႔ နည္းပညာေတြလည္း အဖက္ဖက္က တုိးတက္ေနပါတယ္။

 ဒီအေၾကာင္းကုိ ကၽြန္ေတာ္ ဥပမာ တစ္ခုနဲ႔ ေျပာျပခ်င္ပါတယ္။ ဒီဥပမာကုိ အရင္တုန္းက ကၽြန္ေတာ္ သင္တန္းဆရာ လုပ္တုန္းကလည္း သင္တန္းသားေတြကုိ ေျပာျပဖူးပါတယ္။ ကၽြန္ေတာ္နဲ႔ နီးစပ္တဲ့ သူငယ္ခ်င္းေတြနဲ႔ ကၽြန္ေတာ္ သင္ေပးေနတဲ့ တစ္ခ်ဳိ႕တစ္ေယာက္ကုိလည္း ဒီဥပမာကုိ ေျပာျပခဲ့ဖူးပါတယ္။

myanmarwebdesigner.com/blog သုိ႔ Blog ေျပာင္းေရႊ႕ျခင္း

မဂၤလာပါ၊

ကၽြန္ေတာ္တုိ႔ www.mmwebsharing.blogspot.com blog ကုိ http://www.myanmarwebdesigner.com/blog/ သုိ႔ ေျပာင္းေရႊ႕လိုက္ပါၿပီ။ တစ္ခ်ဳိ႕ ဒီ blog မွာ အဆင္ေျပၿပီးသားဟာေတြေတာ့ အဆင္ေျပဦးမွာမဟုတ္ပါဘူး၊ ဥပမာ post တင္ၿပီးတုိင္း email ထဲ ပုိ႔ေပးတာတုိ႔ ဘာတုိ႔ေပါ့။ အဲဒါေတြကုိေတာ့ ေနာက္မွ ျပန္လုပ္ေပးပါ့မယ္။ blogspot နဲ႔က်ေတာ့ သိပ္ၿပီး အဆင္မေျပတဲ့ အပုိင္းေလးေတြလည္းရွိသလို ပုိေကာင္းတာေတြလည္းရွိပါတယ္။ကၽြန္ေတာ္တုိ႔ blog မွာ အုိင္တီနည္းပညာနဲ႔ ပတ္သတ္ၿပီးေတာ့ ဗဟုသုတေတြ အပါအဝင္၊ တစ္ကယ္အသုံးဝင္တဲ့ သင္ခန္းစာေတြကုိလည္း share ေပးေနတာျဖစ္ပါတယ္။ ေနာက္လည္း share သြားဦးမွာပါပဲ၊ အဓိက လုိအပ္တာကေတာ့ အခ်ိန္ပါပဲ၊ အခ်ိန္မေပးႏုိင္တဲ့အတြက္ post ေတြ သိပ္မတင္ျဖစ္တာပါ။

Website description meta tag optimization | Myanmar SEO Tutorials

မဂၤလာပါ..
ဒီတစ္ေခါက္ေတာ့ website meta tag ကုိ optimize လုပ္တာကုိ သင္ျပေပးမွာျဖစ္ပါတယ္။ ဒီသင္ခန္းစာကုိ ဖတ္မယ့္သူေတြဟာ အရင္တစ္ေခါက္က website title tag optimization သင္ခန္းစာကုိလည္း ဖတ္ဖူးရပါမယ္။ အဲဒီသင္ခန္းစာကုိ ဖတ္ထားဖူးရင္ေတာ့ ဒီသင္ခန္းစာအတြက္ အခ်ိန္ သိပ္မေပးရေတာ့ပါဘူး။ ဒါေၾကာင့္မုိ႔ ဒီသင္ခန္းစာမွာ website တစ္ခုရဲ႕ title tag နဲ႔ meta tag ကုိ ဘယ္လိုရွာရမလဲဆုိတာပါ ေျပာျပေပးသြားမွာ ျဖစ္ပါတယ္။ ဒီ blog မွာ ေရးတဲ့သင္ခန္းစာေတြဟာ ဘာမွမသိတဲ့လူတစ္ေယာက္က စၿပီး အလယ္အလတ္သိတဲ့ လူတစ္ေယာက္အထိ ဖတ္လို႔ရေအာင္ ေရးတာျဖစ္ပါတယ္။ ဒါေၾကာင့္ သိၿပီးသားလူေတြလည္း ပုိၿပီး ျပည့္ျပည့္စုံစုံ သိေစပါတယ္။ ကဲ .. သင္ခန္းစာ စရေအာင္ဗ်ာ။