TTF থেকে WOFF2 কনভার্টার
নিজের সার্ভারে ফন্ট হোস্ট করার প্রথম ধাপ এটাই: বর্তমানের সব ব্রাউজার আগে WOFF2 ফরম্যাটই ডাউনলোড করে, আর আপনার কাছে থাকা TrueType ডেটার জন্য এটাই সবচেয়ে ছোট মোড়ক। এই পেজ ফন্টটি লোড করার CSS রুলও লিখে দেয়।
ফন্ট কনভার্টার
অথবা TTF, OTF, WOFF … ফাইল এখানে ড্রop করুন ·
প্রতি ফাইল সর্বোচ্চ 95 MB· সর্বোচ্চ 20টি ফাইল· 30 মিনিট পরে মুছে ফেলা হয়
ফাইল আমাদের সার্ভারে প্রসেস করা হয় এবং 30 মিনিট পরে মুছে ফেলা হয়।
যে স্ক্রিপ্ট ব্যবহার করেন না তা বাদ দিলে ওয়েব ফন্ট শত শত KB থেকে ৩০ KB-এর নিচে নামতে পারে। কম্পিউটারে ইনস্টল করার ফন্টে সব অক্ষর রাখুন।
ফন্টে যে লেখা বা অক্ষর থাকতে হবে তা পেস্ট করুন, যেমন লোগোর শব্দ বা শিরোনাম। বাকি সব বাদ যাবে।
হিন্ট Windows স্ক্রিনে ছোট লেখা স্পষ্ট করে। সরালে ওয়েব ফন্টে প্রায়ই ১০–৩০% বাঁচে; অটো-হিন্ট হিন্টহীন ফন্টে হিন্ট যোগ করে।
মূল নাম রাখতে খালি রাখুন। নাম বদলালে রূপান্তরিত ফন্ট মূলটির পাশে সংঘাত ছাড়াই ইনস্টল করা যায়।
যেমন Regular, Bold, Italic। মূল স্টাইলের নাম রাখতে খালি রাখুন।
এই টুল কীভাবে ব্যবহার করবেন
- 1
TTF ফাইলগুলো আপলোড করুন
যে ওজন ও স্টাইলগুলো ব্যবহার করবেন সবগুলো যোগ করুন, সর্বোচ্চ ২০টি ফাইল, প্রতিটি ৯৫ MB পর্যন্ত। ভেরিয়েবল TTF-ও চলে এবং এর অক্ষগুলো (axes) বজায় থাকে।
- 2
CSS চালু রাখুন, সম্ভব হলে সাবসেট করুন
@font-face CSS যোগ করুন আগে থেকেই টিক দেওয়া থাকে। উন্নত সেটিংস-এ গিয়ে আপনার সাইট পশ্চিমা ভাষার হলে যে অক্ষর রাখবেন অপশনে Basic Latin বা Latin + accents বেছে নিন, এবং হিন্টিং Remove করার কথাও ভাবতে পারেন।
- 3
WOFF2-এ কনভার্ট করুন
WOFF2-এ কনভার্ট করুন চাপুন এবং .css ফাইলসহ ফন্টগুলো ডাউনলোড করুন। দুটোই আপনার সাইটে আপলোড করে স্টাইলশিট লিংক করুন, অথবা নিয়মটি নিজের স্টাইলশিটে পেস্ট করুন।
ওয়েবসাইটের জন্য TTF থেকে WOFF2 কীভাবে কনভার্ট করব?
.ttf আপলোড করুন, @font-face CSS যোগ করুন টিক দেওয়া রাখুন এবং WOFF2-এ কনভার্ট করুন চাপুন। আপনি .woff2 ফাইল পাবেন, সঙ্গে একটি .css ফাইল যাতে সেটির দিকে নির্দেশ করা @font-face নিয়ম থাকে।
ওয়েব ফন্ট হিসেবে কেন WOFF2 ব্যবহার করবেন
TTF হলো অসংকুচিত টেবিল ডেটা: আউটলাইন, মেট্রিক্স, কার্নিং, নাম। ২০১৮ সালে W3C Recommendation হিসেবে প্রকাশিত WOFF2 ঠিক সেই টেবিলগুলোই রাখে, কিন্তু আগে গ্লিফ আউটলাইন সাজিয়ে নেয় যাতে ভালো কম্প্রেস হয়, তারপর ২০১৫ সালে Google-এর প্রকাশ করা কম্প্রেশন অ্যালগরিদম Brotli দিয়ে সংকুচিত করে। Google-এর নিজস্ব পরীক্ষায় WOFF2 পুরোনো WOFF ফরম্যাটের তুলনায় গড়ে প্রায় ৩০% ছোট পাওয়া গেছে, আর ডাউনলোডের পর ব্রাউজার মূল ফন্ট ডেটা ফিরিয়ে আনে, তাই অক্ষরের আকারে কোনো পরিবর্তন হয় না।
ফন্ট রেন্ডারিং আটকে দেয়, তাই কিলোবাইটের হিসাবের চেয়ে এদের সাইজ বেশি গুরুত্বপূর্ণ। ওয়েব ফন্ট আসার আগে ব্রাউজার হয় লেখা লুকায় নয়তো ফলব্যাক দেখায়, আর দেরিতে বদলালে লেআউট সরে যেতে পারে। ছোট ফাইল এই সময় কমায়, আর এখানকার দুটি অপশন আরও কমায়: যে অক্ষর রাখবেন আপনার পেজে কখনো না দেখানো গ্লিফ বাদ দেয়, আর হিন্টিং Remove করলে সেই নির্দেশনাগুলো বাদ যায় যা ফোন ও হাই-ডেনসিটি স্ক্রিন এমনিতেই উপেক্ষা করে। ডেস্কটপের জন্য TTF মাস্টার রেখে দিন; WOFF2 থেকে TTF পরে ওয়েব ফন্ট খুলতে পারে, কিন্তু সাবসেটে বাদ যাওয়া গ্লিফ ফেরাতে পারে না।
TTF বনাম WOFF2 ফাইল সাইজ
TTF, পূর্ণ ক্যারেক্টার সেট
100%
ডেস্কটপে ইনস্টল করা অবস্থার অসংকুচিত ফন্ট টেবিল
WOFF2, Basic Latin সাবসেট
প্রায়ই ১০–২৫%
Brotli কম্প্রেশন ও কম গ্লিফ; ফন্টভেদে ভিন্ন হয়
WOFF2 ফন্টের জন্য @font-face রুল
@font-face {
font-family: "Brand Sans";
src: url("/fonts/brand-sans-regular.woff2") format("woff2");
font-weight: 400;
font-style: normal;
font-display: swap;
unicode-range: U+0000-00FF;
}ব্রাউজার রিলিজ অনুযায়ী WOFF2 সাপোর্ট
2014
Chrome 36
Google-এর ব্রাউজারই প্রথম ডিফল্টভাবে WOFF2 ডিকোড করে।
2015
Firefox 39
Mozilla ডিফল্টভাবে WOFF2 ডিকোডিং চালু করে।
2016
Edge 14
Microsoft-এর আগের Edge Windows 10 Anniversary Update-এর সঙ্গে WOFF2 যোগ করে।
2018
W3C Recommendation
স্পেসিফিকেশন চূড়ান্ত হয়; ততদিনে macOS ও iOS-এর Safari-ও WOFF2 ডিকোড করে।
TTF
TrueType ফন্ট
TTF হলো TrueType ফন্ট ফরম্যাট, যা ১৯৮০-র দশকের শেষে Apple তৈরি করে, ১৯৯১ সালে প্রকাশ করে এবং পরে Microsoft-কে লাইসেন্স দেয়। এটি দ্বিঘাত বক্ররেখা দিয়ে গ্লিফের আউটলাইন নির্ধারণ করে এবং হিন্টিং নির্দেশনা রাখে, যা স্ক্রিনে লেখা স্পষ্ট দেখায়। প্রতিটি ডেস্কটপ অপারেটিং সিস্টেম, ওয়ার্ড প্রসেসর ও ডিজাইন অ্যাপ TrueType সমর্থন করে। এতে OpenType-এর কিছু উন্নত টাইপোগ্রাফি সুবিধা নেই এবং এটি ওয়েব ফন্ট ফরম্যাটের চেয়ে বড়।
- কম্প্রেশন
- লসলেস
- স্বচ্ছতা (ট্রান্সপারেন্সি)
- –
- অ্যানিমেশন
- –
- প্রবর্তনের সাল
- 1991 · Apple
WOFF2
Web Open Font Format 2
WOFF2 হলো Web Open Font Format-এর দ্বিতীয় সংস্করণ, যা Google-এর Brotli কমপ্রেশনের উপর ভিত্তি করে তৈরি এবং ২০১৮ সালে W3C Recommendation হিসেবে প্রকাশিত হয়। ফাইল WOFF-এর চেয়ে প্রায় ৩০% ছোট হয়, ফলে পেজ দ্রুত লোড হয়। সব আধুনিক ব্রাউজার WOFF2 সাপোর্ট করে এবং ওয়েব ফন্টের জন্য এটিই প্রস্তাবিত ফরম্যাট। ডেস্কটপ অপারেটিং সিস্টেম ও ডিজাইন অ্যাপে এটি সরাসরি ইনস্টল করা যায় না।
- কম্প্রেশন
- লসলেস
- স্বচ্ছতা (ট্রান্সপারেন্সি)
- –
- অ্যানিমেশন
- –
- প্রবর্তনের সাল
- 2018 · W3C (Google)
TTF থেকে WOFF2 ডেস্কটপ ফন্টকে ব্রাউজারের পছন্দের Brotli-কম্প্রেসড কনটেইনারে ভরে, ফলে একই গ্লিফ কম বাইটে ভিজিটরের কাছে পৌঁছায়; উল্টো পেজটি তাদের জন্য, যারা ওয়েবে পাওয়া ফন্ট ইনস্টল করতে চান।
TTF থেকে WOFF2: প্রায়ই জিজ্ঞাসিত প্রশ্ন
WOFF2-এর পাশাপাশি কি এখনও TTF বা WOFF ফলব্যাক লাগবে?
বর্তমানে পাবলিক ওয়েবসাইটের জন্য সাধারণত না। Chrome, Edge, Firefox ও Safari বহু বছর ধরে WOFF2 পড়তে পারে, আর যে কয়েকটি ব্রাউজার পারে না, যেমন Internet Explorer 11, তাদের জন্য বাড়তি ফাইল রাখা প্রায় কখনোই দরকার হয় না। অ্যানালিটিক্সে এমন ভিজিটর দেখলেই কেবল TTF থেকে WOFF আউটপুট দ্বিতীয় src এন্ট্রি হিসেবে যোগ করুন।
আমার WOFF2 ফন্ট এখনও 100 KB-এর বেশি কেন?
কম্প্রেশন শুধু গ্লিফ সংরক্ষণের ধরন ছোট করে, গ্লিফের সংখ্যা কমায় না। যে ফন্টে Latin, Cyrillic, Greek ও Vietnamese আছে, সেটি সবগুলোই বহন করে। আপনি যে লিপিগুলো সত্যিই দেখান শুধু সেগুলোতে সাবসেট করলেই একটি টেক্সট ফন্ট কয়েক দশ কিলোবাইটে নামে।
font-display: swap কী কাজ করে?
এটি ব্রাউজারকে বলে ফন্ট ডাউনলোডের সময় লেখা লুকিয়ে না রেখে সঙ্গে সঙ্গে ফলব্যাক ফন্টে দেখাতে, আর ওয়েব ফন্ট এসে পৌঁছালে সেটিতে বদলে নিতে। উপরের উদাহরণের মতো এটি আপনার @font-face নিয়মে যোগ করুন, অথবা ধীর সংযোগে দেরিতে বদলানো এড়াতে চাইলে optional ব্যবহার করুন।
Google Fonts-এর TTF কি WOFF2-এ কনভার্ট করে নিজে হোস্ট করা যায়?
হ্যাঁ। Google Fonts-এর ফন্ট পরিবারগুলো SIL Open Font License বা Apache License-এ প্রকাশিত, দুটোতেই রূপান্তর ও নিজের সার্ভারে হোস্ট করার অনুমতি আছে। নিজে ফাইল হোস্ট করলে তৃতীয় পক্ষের সার্ভারে অনুরোধও এড়ানো যায়।
ইমেইল নিউজলেটারে কি WOFF2 কাজ করে?
শুধু কিছু ক্লায়েন্টে। Apple Mail ও iOS Mail @font-face দিয়ে ওয়েব ফন্ট লোড করে, কিন্তু Gmail ও বেশিরভাগ Outlook সংস্করণ সেগুলো উপেক্ষা করে ফলব্যাক ফন্ট দেখায়। ইমেইলের ফন্ট স্ট্যাকে সবসময় একটি নিরাপদ সিস্টেম ফন্ট রাখুন।