Tuesday, January 11, 2011

Render Zawgyi With TypeFace For Embeding

http://1.bp.blogspot.com/_7FFCr2FOODY/TSjqaYJxlcI/AAAAAAAAHSM/2Kx9dRbi7-c/s1600/KyawswarNyein_Type_Face_Vs_Zawgyi.png
အခုဒီ Tutorial ေလးမွာ ကၽြန္ေတာ္ ေျပာမဲ႕ နည္းေလးကေတာ့ TypeFace နဲ႕ Zawgyi ကို Render တဲ႕နည္းေလးပါဘဲ။ ဘာမွလဲမခတ္ပါဘူး။ ကိုပိုင္ Hosting လဲမလိုပါဘူး။ လိုအိပ္တာက Latest Zawgyi Font ပါဘဲခင္ဗ်ား။ က်န္တာေတြကေတာ့ ေႏွာက္မွ ေအးေအးေဆးေဆး လုပ္ၾကတာေပါ့။

အထမဦးဆံုး Browser တခုခုကိုဖြင့္ျပီး [Link] ကိုသြားျပီး Latest TypeFace ကို Download လုပ္လိုက္ပါ။ ျပီးရင္ေတာ့ [Link] ကိုသြားျပီး Zawgyi Font ကို Browser ျပီး TypeFace Format ျဖစ္ေအာင္ Convert လိုက္ပါ။

KyawswarNyein.Com_Type_Face_Convert_Font_Zawgyi
ျပီးရင္ေတာ့ အဓိကၾကတဲ႕ Unicode Ranges ေတြကိုဘဲ Select လုပ္လိုက္ျပီး Download Font ကိုဘဲ ဆက္ႏွိပ္လိုက္ပါ။ zawgyi-one_regular.typeface.js ဆိုျပီးၾကလာပါ့မယ္။ အဲဒ့ါကို Saved ထားလိုက္ပါ။

အားလံုးကို Download လုပ္ျပီးသြားရင္ေတာ့ ေစာေစာက TypeFace.Js ရယ္ Zawgyi-Regular-TypeFace.Js ရယ္ကို Free Direct Hosting Site တခုခုမွာ Upload လိုက္ပါ။ ကၽြန္ေတာ္ Recommend ဒါကေတာ့ Google Code ပါဘဲ။ အဲ့ဒါေလးက အခ်ားဟာေတြနဲ႕စာရင္ Free And Secure ျဖစ္ပါတယ္။

အသံုးျပဳပံုကိုေတာ့ TypeFace Home Page ျဖစ္တဲ႕ [Link] မွာသြားျပီး Usage မွာသြားဖတ္ႏိုင္ပါတယ္။ အလြယ္တကူျဖစ္ေအာင္
လို႕ ကၽြန္ေတာ္လဲ ဒီမွာ နဲနဲရွင္းျပ လိုက္ပါ့မယ္။ အ့ဲဒီ .Js File ႏွစ္ခုကို ကိုယ့္ရဲ႕ Website ကိုသြားျပီး <head> နဲ႕ </head> မွာထား
လိုက္ပါတယ္။ ျပီးရင္ေတာ့ Zawgyi Font TypeFace နဲ႕ Render ရေအာင္လို႕ ..

<div class="typeface-js" style="font-family:'Zawgyi-One'">
Text here in Zawgyi font...
</div>

ဆိုျပီးေရးေပးႏိုင္ပါတယ္ခင္ဗ်ား။ Post တင္တိုင္းတင္ တိုင္း အဲ့ဒီလိုလုပ္ျပီး ေရးေပးလိုက္ပါ။ Zawgyi Font Install မလုပ္ထားေတာင္မွ ျမန္မာလို ေသခ်ာေပါက္ေပၚပါတယ္။ Firefox မကလို႕ ဘယ္ Browser နဲ႕ဘဲၾကည့္ဘၾကည့္ အားလံုး Ok ပါတယ္။ iPod မွာလဲ ရပါတယ္။ ကၽြန္ေတာ္စမ္းၾကည့္ျပီးသြားပါျပီး iPad မွာၾကေတာ့ မရွိေသးလို႕ မစမ္းရေသးပါဘူး။

Zawgyi Font ကို Embedding နည္းေတြ ပံုစံေတြ က အမ်ားၾကီးရွိပါတယ္။ အလြယ္ဆံုးနဲ႕ အေကာင္းဆံုးနည္းကေတာ့ ကိုစိုးမင္း ေရးထားတဲ႕ [Link] Apache Server မွာ .htaccess မွာရိတဲ႕ Mod ကို GZip Re-write တဲ႕ နည္းေလးက အေကာင္းဆံုးပါဘဲ။ အျခားေသာ နည္းေတြရွိတဲ႕ Text To Images လို႕ Test To Flash စသည့္ ဟာေတြကိုလဲ ရွိပါတယ္။ ဒါေပမဲ႕ သူတို႕ေတြက ကိုယ့္ရဲ႕ Site Speed ေလးကို ေႏွးေစပါတယ္။ Cufón ဆိုရင္ေတာ့ TypeFace နဲ႕တူတူဘာဘဲ ကြာခ်ားတာကို ကိုယ့္အၾကိဳက္နဲ႕ကိုေပါ့။ Cufón ကုိၾကိဳက္တဲ႕ သူဆိုရင္ Cufón ေပါ့။ TypeFace ဆိုရင္ေတာ့ TypeFace ေပါ့။ ျပီးေတာ့လဲ အခ်ားဟာေလးေတြကိုလဲ ရွိပါတယ္။ Google လိုက္ရင္ အမ်ားၾကီး ေတြ႕ႏိုင္ပါတယ္။

source;kyawswarnyein.com