Myanmar Web Font

Google Web Font ကိုသေဘာက်ရင္းနဲ႔ စဥ္းစားမိတာက ျမန္မာ Unicode ေတြေကာ အဲလို လုပ္လို႔မရဘူးလားေပါ့။ အဲလိုမ်ိဳး လုပ္ဖို႔ စဥ္းစားေနတာ ၾကာေတာ့ ၾကာေနၿပီ။ ျပႆနာက ဘာလဲဆိုေတာ့ Mac OS X ျပႆနာပဲ။ Mac မွာက Master Piece ပဲ အလုပ္လုပ္တယ္။ font embed လုပ္လိုက္ရင္ အျခား unicode font နဲ႔ ေရးထားတာေတြ Mac မွာ ဖတ္လို႔မရေတာ့ဘူး။ ေနာက္ၿပီး iPhone iPad မွာ ဖတ္လို႔မရေတာ့ဘူး။ Mac မွာဆိုရင္ေတာ့ ျမန္မာ Unicode အတြက္ font embed မလုပ္တာ အေကာင္းဆုံးပဲ။ ဘာလို႔လည္းဆိုေတာ့ Rendering ေတြ အလုပ္မလုပ္ေတာ့လို႔ပါ။ iPhone , iPad မွာဆိုရင္ Masterpiece Uni Sans ပဲ အလုပ္လုပ္ပါတယ္။

Firefox မွာ ဆိုရင္ေတာ့ ျပႆနာ တစ္ခုက Cross Domain ပဲ။ Blogspot မွာ ကြၽန္ေတာ္ေပးထားတဲ့ Script ထည့္မရဘူးဆိုတာက cross domain ေၾကာင့္ပါ။ Firefox က domain မတူတာကေန request လုပ္တဲ့အခါမွာ font ကို မျပေပးဘူး။ အဲဒီေတာ့ font မျမင္ရတာေတြျဖစ္ကုန္တယ္။ မေန႔က Google App Engine ကို စမ္းေရးၾကည့္မယ္ဆိုၿပီး ေရးျဖစ္လိုက္တယ္။

http://mywebfont.appspot.com

အဲဒီျပထားတဲ့ CSS အတိုင္း အသုံးျပဳရင္ iPhone , iPad ေတြဆိုရင္ Masterpiece နဲ႔ ေျပာင္းေအာင္လည္း လုပ္ထားေပးပါတယ္။ IE ဆိုရင္လည္း EOT ကို font embed ျပန္လုပ္ထားတယ္။ Chrome နဲ႔ Mac OS ကိုေတာ့ support မလုပ္ဘူး။

ေနာက္ၿပီး အႀကံေပးခ်င္တာက Unicode font ကို သုံးမယ္ဆိုရင္ Masterpiece ကို ေရွ႕ဆုံးမွာ ထားေစခ်င္တယ္။ ဒါမွ iPhone , iPad မွာ ျမင္ရပါလိမ့္မယ္။ ေနာက္ၿပီး Mac OS နဲ႔ website ၾကည့္တဲ့ သူေတြကို အဆင္ေျပေစပါတယ္။

h1 { font-family:"Masterpiece Uni Sans",Yunghkio,Myanmar3; }

ေဇာ္ဂ်ီ သမားေတြအတြက္လည္း Zawgyi ကို font embed လြယ္လြယ္ ကူကူ ထည့္လို႔ရေအာင္ လုပ္ထားေပးပါတယ္။ ေဇာ္ဂ်ီ font မရွိတဲ့သူေတြလည္း လြယ္လြယ္ ကူကူ ၾကည့္လို႔ရေအာင္ embed လုပ္ႏိုင္ပါတယ္။ OFL မဟုတ္တဲ့ font ေတြက Embed လုပ္ခြင့္မရွိပါဘူး။ ဒါေၾကာင့္ OFL ရတဲ့ font ေတြကိုသာ css link ထုတ္ထားေပးတာပါ။ ဘယ္လို အသုံးျပဳလို႔ရလဲ ဆိုတာ ေအာက္မွာ ေလ့လာၾကည့္လိုက္ပါအုံး။

Demo

Code:

<html>
<head>
	<link href='http://mywebfont.appspot.com/css?font=yunghkio' rel='stylesheet' type='text/css'>
	<link href='http://mywebfont.appspot.com/css?font=myanmar3' rel='stylesheet' type='text/css'>
	<link href='http://mywebfont.appspot.com/css?font=padauk' rel='stylesheet' type='text/css'>
	<link href='http://mywebfont.appspot.com/css?font=parabaik' rel='stylesheet' type='text/css'>
	<link href='http://mywebfont.appspot.com/css?font=zawgyi' rel='stylesheet' type='text/css'>
	<style>
		.yunghkio {
			font-family:"Masterpiece Uni Sans",Yunghkio;
		}
		.myanmar3 {
			font-family:"Masterpiece Uni Sans",Myanmar3;
		}
		.padauk {
			font-family:"Masterpiece Uni Sans",Padauk;
		}
		.zawgyi {
			font-family:Zawgyi-One;
		}
		.parabaik {
			font-family:"Masterpiece Uni Sans",Parabaik;
		}
	</style>
</head>
<body>
	<p class="yunghkio">Yunghkio ျမန္မာစာ</p>
	<p class="myanmar3">Myanmar 3 ျမန္မာစာ</p>
	<p class="padauk">Padauk ျမန္မာစာ</p>
	<p class="parabaik">Parabaik ျမန္မာစာ</p>
	<p class="zawgyi">ေေနကာင္းလား</p>
</body>
</html>

 
136 Kudos
Don't
move!
49 Comments

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.