အရင်က စမ်းမယ် စမ်းမယ်နဲ့ မစမ်းဖြစ်လိုက်ဘူး.. ဒီနေ့မှပဲ စမ်းဖြစ်တာ….

ကျွန်တော်တို့တွေ web design တွေဆွဲတဲ့အခါမှာ font တွေကလည်း အရေးပါလှပါတယ်။ header ကို ဘာ font သုံးမယ်။ paragraph ကို ဘာ font သုံးမယ်ဆိုပြီး ကျွန်တော်တို့တွေ ရွေးချယ်ရတယ်။ အရင်က ကျွန်တော်တို့တွေမှာ ရွေးချယ်စရာ များများမရှိဘူး။ Windows မှာ default ပါတဲ့ font နဲ့ mac မှာ default ပါတဲ့ font တွေဖြစ်ဖို့ အရေးကြီးတယ်။ နောက်မို့ဆို ကိုယ့် design က မလှပဲ ဖြစ်သွားမယ်။ ဒါကြောင့် အများအားဖြင့် Verdana,Times New Roman,Tahoma,Arial,Georgia စတာတွေလောက်ပဲ ရွေးလို့ရတယ်။ အများကြီးရွေးချယ်စရာမရှိဘူးလေ။ သူတို့ စက်ထဲမှာ font မရှိရင် အလကားပဲ။ ဒါကြောင့် designer တွေကတော့ browser တွေထဲမှာ font embed ဖြစ်စေချင်ကြတယ်။

နောက်ပြီး ကျွန်တော်တို့ မြန်မာတွေ ဇော်ဂျီ စက်ထဲမှာ မရှိလို့ မမြင်ရဘူး။ မြန်မာ ၂ မရှိလို့မမြင်ရဘူး။ မြန်မာ ၃ မရှိလို့ မမြင်ရဘူး။ အဲလို ပြဿနာတွေ က ခဏခဏပါပဲ။ eot ကလည်း IE အတွက်ပဲရတယ်လေ။ ဒါကြောင့် အဆင်မပြေပြန်ဘူး။ နိုင်ငံတကာမှာလည်း သူတို့ ဘာသာစကားတွေကို default ပါတဲ့ font မဟုတ်ပဲနဲ့ အခြား ကိုယ်ပိုင် design font တွေနဲ့လည်း ထည့်သွင်းဖော်ပြစေချင်တာပဲ။ ဒါပေမယ့် user စက်ထဲမှာ font မသွင်းထားရင်လည်း မဖြစ်ပြန်ဘူးလေ။

firefox 3.5 , safari 3.1 , opera 10 မှာ အဲဒီ ပြဿနာတွေ ချုပ်ငြိမ်းအောင် ဖန်တီးလာနိုင်ပါပြီ။ ကျွန်တော်တို့တွေ css နဲ့ font embed လုပ်လို့ရလာပြီ။ ဘယ်လိုလုပ်မလဲဆိုတော့

@font-face {
font-family: a-remote-font-name;
src: source [,source]*;
[font-weight: weight];
[font-style: style];
}

a-remote-font-name ဆိုတာကတော့ font နာမည်ပေါ့။
source သူကတော့ font ရဲ့ source ပေါ့။ user စက်ထဲက ဟာကို ယူသုံးချင်ရင် local(“Font Name”) နဲ့ ခေါ်လို့ရတယ်။
နောက်ထပ် နှစ်ခုဖြစ်တဲ့ font-weight နဲ့ font-style ကတော့ optional ပါ။ font weight value နဲ့ style value ထည့်ပေးရုံပဲလေ။ သူတို့ ၂ လိုင်းကို မထည့်လည်းရတယ်။¹ ကဲ.. example လေး ကြည့်ရအောင်။

အဲဒါကတော့ css/style.css ပေါ့။

@font-face
{
font-family:Zawgyi-one;
src:url(ZawgyiOne2008.ttf);
}
body
{
font-family: Zawgyi-one;
color:#343434;
}

အဲဒါကို HTML မှာ ပြန်ခေါ်တော့

နေကောင်း

အဲဒါကို ဘာ font မှ မလိုပဲ ဇော်ဂျီ ပေါ်ပါတယ်။ အဓိကတော့ @font-face ကအဓိကပါပဲ။ တကယ်လို့ လိပ်စာနဲ့ခေါ်ချင်ရင်တော့ src မှာ

@font-face
{
font-family:Zawgyi-one;
src:url(http://www.saturngod.net/ZawgyiOne2008.ttf);
}

ဒါဆိုရင် font ကို သွား download ချစရာမလိုပဲ browser ကပဲ သူ့ဘာသာသူ embed လုပ်ပြီး ပြပေးမှာပါ။ တနည်းပြောရင် font မရှိလည်း ကြည့်လို့ရပါတယ်။ ဒါဟာ web designer တွေအတွက် အရမ်းကောင်းမွန်တဲ့ အချက်လေးပါပဲ။ လေ့လာချင်သေးတယ်ဆိုရင်တော့

https://developer.mozilla.org/index.php?title=En/CSS/%40font-face

မှာ သွားပြီး ဖတ်နိုင်ပါတယ်ဗျာ။

1. https://developer.mozilla.org/index.php?title=En/CSS/%40font-face [↩]