آموزش تبدیل فونت TTF به WOFF با 3 روش مختلف

چرا باید فونت‌های TTF را به WOFF تبدیل کنیم؟اگر طراح سایت هستید یا با فرانت‌اند وب‌سایت‌ها سروکار دارید، احتمالاً نام فونت‌های TTF و WOFF به گوشتان خورده. اما آیا تا به حال به این فکر کرده‌اید که چرا طراحان حرفه‌ای همیشه فونت‌ها را به فرمت WOFF تبدیل می‌کنند؟

دلیلش ساده است: فرمت WOFF مخصوص استفاده در وب طراحی شده و باعث می‌شود فونت شما سریع‌تر لود شود، حجم کمتری داشته باشد و با اکثر مرورگرها سازگار باشد.

پیشنهاد دیاکوگرافیک:

فونت فارسی بهروز Behrooz Font

250000 تومان قیمت اصلی 250000 تومان بود.195000 تومانقیمت فعلی 195000 تومان است.

دانلود فونت

در این مقاله از سایت دیاکوگرافیک، قدم‌به‌قدم به شما یاد می‌دهیم که چطور تبدیل فونت TTF به WOFF را به راحت‌ترین شکل ممکن انجام دهید؛ چه به صورت آنلاین، چه آفلاین با نرم‌افزار. اگر هدف‌تان بهینه‌سازی سایت برای سئو و سرعت است، این مقاله را تا انتها بخوانید.

فرمت TTF چیست و چه تفاوتی با WOFF دارد؟

TTF (TrueType Font) یکی از فرمت‌های قدیمی و پرکاربرد فونت است که توسط Apple و سپس مایکروسافت توسعه داده شد. این فرمت بیشتر برای استفاده در نرم‌افزارهای گرافیکی مثل فتوشاپ یا ورد مناسب است.

از طرف دیگر، WOFF (Web Open Font Format) یک فرمت بهینه‌شده برای وب است. این نوع فونت‌ها دارای حجم کمتر، پشتیبانی مرورگر بهتر، و امنیت بالاتری هستند. به‌همین دلیل، گوگل، موزیلا و سایر مرورگرها توصیه می‌کنند برای استفاده در سایت از WOFF یا WOFF2 استفاده شود.

تاریخچه مختصر فرمت‌های فونت در وب قبل از ظهور WOFF، توسعه‌دهندگان مجبور بودند فونت‌های سنگین TTF یا OTF را در سایت بارگذاری کنند. اما این موضوع باعث می‌شد صفحات وب کند بارگذاری شوند و تجربه کاربری ضعیف شود. با توسعه WOFF توسط W3C و پشتیبانی کامل مرورگرها از آن، تحولی در طراحی وب و بهینه‌سازی سرعت رخ داد. امروزه تقریباً تمام مرورگرهای مدرن از WOFF و WOFF2 پشتیبانی می‌کنند.

پیشنهاد دیاکوگرافیک:

فونت فارسی ماسال Masal Font

200000 تومان قیمت اصلی 200000 تومان بود.175000 تومانقیمت فعلی 175000 تومان است.

دانلود فونت

مقایسه فنی فرمت‌های TTF و WOFF

چرا تبدیل TTF به WOFF برای سئو سایت مهم است؟

هر چه سایت شما سریع‌تر لود شود، احتمال باقی ماندن کاربر در آن بیشتر می‌شود. فونت‌های TTF معمولاً حجم بالاتری نسبت به WOFF دارند و باعث کند شدن سایت می‌شوند.

علاوه بر آن، گوگل سرعت سایت را یکی از فاکتورهای اصلی رتبه‌بندی می‌داند. با تبدیل فونت‌های TTF به WOFF، یک گام بزرگ در بهینه‌سازی سایت خود برداشته‌اید.

روش‌های تبدیل فونت TTF به WOFF

تبدیل آنلاین فونت TTF به WOFF (بدون نصب برنامه) یکی از ساده‌ترین و سریع‌ترین روش‌ها استفاده از ابزارهای آنلاین است. در ادامه چند سایت کاربردی را معرفی می‌کنیم:

استفاده از سایت FontSquirrel

برای تبدیل فونت TTF به WOFF مراحل زیر را به ترتیب انجام دهید:

• وارد سایت https://www.fontsquirrel.com/tools/webfont-generator شوید.
• روی گزینه‌ی “Upload Fonts” کلیک کنید و فایل TTF خود را انتخاب نمایید.
• تنظیمات را به حالت “Optimal” بگذارید.
• روی “Download Your Kit” بزنید و فونت‌های WOFF و WOFF2 را دانلود کنید.

مزایای این روش:

• نیازی به نصب برنامه نیست
• رایگان است
• خروجی بهینه‌شده و مناسب برای وب می‌دهد

استفاده از نرم‌افزار FontForge در ویندوز و مک

اگر می‌خواهید کنترل بیشتری روی تبدیل فونت داشته باشید، استفاده از FontForge گزینه‌ی مناسبی است.

مراحل تبدیل:

1. نرم‌افزار FontForge را از سایت رسمی دانلود و نصب کنید.
2. فایل TTF را در برنامه باز کنید.
3. از منوی File گزینه‌ی “Generate Fonts” را انتخاب نمایید.
4. از بین فرمت‌ها، WOFF را انتخاب کرده و فونت را ذخیره کنید.

نکات:

• FontForge رایگان و متن‌باز است.
• امکان تبدیل دسته‌ای فونت‌ها را هم دارد.

تبدیل فونت به WOFF2 (نسخه فشرده‌تر و مدرن‌تر)

اگر می‌خواهید سرعت سایتتان را به نهایت برسانید، بهتر است از فرمت WOFF2 استفاده کنید. این فرمت نسخه‌ی جدیدتر WOFF است و حجم آن تا ۳۰٪ کمتر است.

استفاده از Transfonter

برای تبدیل به WOFF2، می‌توانید از همین ابزار FontSquirrel یا ابزار آنلاین Transfonter استفاده کنید:

• وارد سایت https://transfonter.org/ شوید.
• فونت TTF را آپلود کنید.
• تیک گزینه‌ی “WOFF2” را فعال کنید.
• فایل خروجی را دانلود کنید و در سایت‌تان استفاده نمایید.

نکات حقوقی و لایسنس فونت‌ها در تبدیل به WOFF

تبدیل فونت همیشه به معنای مجاز بودن استفاده از آن در وب نیست. برخی فونت‌ها فقط برای استفاده شخصی طراحی شده‌اند و مجوز استفاده در سایت را ندارند. البته اگر میخواهید هر فونتی را که دوست داشتید به فرمت های مختلفی تبدیل کنید، میتوانید از فونت های فارسی دیاکوگرافیک استفاده کنید.

نحوه استفاده از فونت WOFF در سایت

بعد از تبدیل، برای استفاده از فونت در سایت کافی است از CSS استفاده کنید:

@font-face{ font-display:swap; font-family: ‘MyFont’; src: url(‘fonts/myfont.woff2’) format(‘woff2’), url(‘fonts/myfont.woff’) format(‘woff’); font-weight: normal; font-style: normal; }

نکات حرفه‌ای برای قرار دادن فونت در سایت

• همیشه از WOFF و WOFF2 با هم استفاده کنید تا سازگاری مرورگر حفظ شود.
• فونت‌ها را در پوشه‌ای مانند /fonts/ قرار دهید.
• حجم فونت‌ها را بررسی کرده و فشرده‌سازی gzip را در سرور فعال کنید.

اشتباهات رایج هنگام تبدیل فونت TTF به WOFF

1. استفاده از ابزارهای غیرمعتبر آنلاین که ممکن است فونت را خراب کنند یا ویروسی باشند.
2. عدم درج درست مسیر فونت در CSS که باعث می‌شود فونت لود نشود.
3. عدم تست فونت در مرورگرهای مختلف که تجربه کاربری را پایین می‌آورد.
4. عدم رعایت مجوز فونت؛ بعضی فونت‌ها اجازه استفاده در وب را نمی‌دهند!

فونت WOFF یعنی سرعت بیشتر، سئوی بهتر در دنیای وب‌سایت‌ها، جزئیات کوچکی مثل فرمت فونت می‌توانند تفاوت بزرگی ایجاد کنند. تبدیل فونت TTF به WOFF باعث کاهش حجم صفحات، افزایش سرعت لود سایت و در نتیجه بهبود رتبه شما در نتایج گوگل می‌شود.

فرقی نمی‌کند تازه‌کار باشید یا حرفه‌ای؛ تبدیل درست فونت و استفاده بهینه از آن، یکی از ارکان طراحی سایت حرفه‌ای است. با استفاده از روش‌های معرفی‌شده در این مقاله، می‌توانید با خیال راحت فونت‌های خود را برای وب آماده کنید و سرعت، سئو و تجربه کاربری سایتتان را ارتقاء دهید. اگر در سوالی داشتید و یا با مشکلی مواجه شدید حتماً در بخش دیدگاه‌ها با ما درمیان بگذارید.

سوالات متداول

آیا تبدیل فونت TTF به WOFF رایگان است؟

پاسخ: بله، با ابزارهای آنلاینی مثل FontSquirrel و Transfonter می‌توانید کاملاً رایگان این کار را انجام دهید.

آیا WOFF بهتر از TTF است؟

پاسخ: برای استفاده در وب، قطعاً WOFF انتخاب بهتری است چون سبک‌تر است و مخصوص مرورگرها طراحی شده.

آیا می‌توانم فونت فارسی را هم به WOFF تبدیل کنم؟

پاسخ: بله، تمامی فونت‌های فارسی که با فرمت TTF یا OTF هستند را می‌توان به راحتی به WOFF یا WOFF2 تبدیل کرد.

چطور بفهمم فونتم مجوز استفاده در وب دارد؟

پاسخ: معمولاً همراه فونت یک فایل مجوز یا متن (license.txt) وجود دارد. اگر نه، بهتر است فونت را از منابع معتبر دانلود کنید.

کدام بهتر است: WOFF یا WOFF2؟

پاسخ: WOFF2 بهتر است چون حجم کمتری دارد؛ اما برای پشتیبانی بیشتر از مرورگرها، بهتر است هر دو فرمت را در سایت قرار دهید.