একটি ওয়েবসাইটের সবচেয়ে আকর্ষণীয় বিষয় হল ফন্ট নির্বাচন। ফন্টই একটি ওয়েবসাইটের সৌন্দর্য বহন করে। কিন্তু ফন্ট নির্বাচনের সময় আমাদের বিশেষ কিছু সতর্কতা অবলম্বন করতে হয়। কারন, সকল ফন্ট সকল ডিভাইসে থাকে না। তাই এমন একটি ফন্ট ব্যবহার করতে হয় যা সকল ডিভাইসে থাকে।

কিন্তু অনেক সময় কিছু আকর্ষণীয় ফন্ট আমাদের ব্যবহার করার প্রয়োজন হয়ে থাকে। তখন সেই ফন্ট ব্যবহারের উপায় থাকে না। কারন, সব ডিভাইসে সেই ফন্ট না ও থাকতে পারে।

আমাদের ফন্টটি এমন একটি সিস্টেমে ব্যবহার করতে হয় যাতে ফন্টটি ওয়েবসার্ভারে থাকে এবং ভিজিটর ওয়েবসাইট দেখার সময় তার ডিভাইসে ডাউনলোড হয়ে সেই ফন্টটি শো করে।

বিভিন্ন ব্রাউজার বিভিন্ন ফরম্যাট এর ফন্ট এমবেড করতে পারে। নিচে তূলনা করা হল

ইন্টারনেট এক্সপ্লোরার: .eot
মজিলা ফায়ারফক্স: .ttf, .woff
গুগল ক্রোম: .ttf, .woff
সাফারি/আইওএস: .svg

তাই আমাদের ফন্ট ব্যবহার করার জন্য ভিন্ন ভিন্ন ফরম্যাটের ফন্ট ব্যবহার করার প্রয়োজন।

কিভাবে ভিন্ন ভিন্ন ফন্ট ব্যবহার করবেন

প্রথমে আপনার পছন্দকৃত .ttf ফন্টটি নির্বাচন করুন। তারপর এখানে ক্লিক করুন। নিচের মত একটি ওয়েবসাইট ওপেন হবে।

এখানে আপনার ফন্টটি ব্রাউজ করে চিনিয়ে দিন তারপর এ ক্লিক করুন। আপনার ফন্টটি আপলোড হবে। আপলোড শেষে একটি ডাউনলোড লিংক পাবেন। এখান থেকে ডাউনলোড করুন।

একটি জিপ ফোল্ডার ডাউনলোড হবে। এর মধ্যে একই নামে চারটি ফরমেটের ফন্ট দেখতে পারবেন।

যেভাবে ব্যবহার করবেন

ওয়ার্ডপ্রেসে

আপনার থিমে নামে একটি ফোল্ডার তৈরি করুন। এর মধ্যে চারটি ফন্ট রাখুন। এবার সিএসএস এ কোড লিখুন নিচের মত

@font-face {
font-family: 'UbuntuRegular';
src: url('Ubuntu-R-webfont.eot');
src: url('Ubuntu-R-webfont.eot?#iefix') format('embedded-opentype'),
url('Ubuntu-R-webfont.woff') format('woff'),
url('Ubuntu-R-webfont.ttf') format('truetype'),
url('Ubuntu-R-webfont.svg#UbuntuRegular') format('svg');
font-weight: normal;
font-style: normal;
}

এখানে খেয়াল করবেন যাতে ফন্টের নামটি যেন ঠিক হয়। এরপর আপনি আপনার থিমের যেই এলিমেন্টে আপনার ফন্টটি ব্যবহার করতে চান সেখানে কোড লিখুন

.element_name {font-family:'UbuntuRegular', Arial}

সতর্কতা: ফন্টের নামটি অবশ্যই সিংগেল কোটেশনের মধ্যে হবে।

তাহলে ভিজিটর ফন্ট ডাউনলোড ছাড়াই ফন্টটি দেখতে পারবেন।

এই পক্রিয়ার সুবিধা
* ভিজিটর ডাউনলোড ছাড়াই ফন্ট দেখতে পারবেন।
* এই পদ্ধতিতে বাংলা ওয়েবসাইটগুলো করলে আর ফন্ট ডাউনলোডের ঝামেলা নেই। এমনকি যেসব ডিভাইসে ফন্ট ডাউনলোডের সুবিধা নেই সেখানেও ঝকঝকে তকতকে বাংলা ফন্ট দেখা যাবে।

এই পক্রিয়ার অসুবিধা
* আপনার সাইটে প্রথমবার ভিজিটর প্রবেশ করার সময় ফন্টগুলো তার ক্যাশে ডাউনলোড হবে তাই একটু স্লো লোড হবে। তবে প্রথম বার লোড হওয়ার পর ব্রাউজার ক্যাশ থেকে ফন্ট লোড করবে ফলে পরবর্তীবার আর কোন স্লো মনে হবে না।

আশাকরি এই পোস্টটি পড়ে আপনাদের উপকার হবে। আর লেখাটি আমার বিনা অনুমতিতেই যে কোন স্থানে, যে কোন প্রকার পরিবর্তন, পরিমার্জন করে আমার নাম প্রকাশ ছাড়াই নিজের নামে প্রকাশ করতে পারবেন। ধন্যবাদ।