وبلاگ

چگونه فونت‌های وبسایتمان را فشرده کنیم ؟

در 15 می، 2012 توسط

زمانی که از fontface@ برای افزودن فونت به سایت خود استفاده می کنید باید چندین فایل را آماده کنید تا مرورگر های مختلف بسته به نیاز و تکنولوژی خود، یکی را دانلود کنند. حجم این فایل ها هم از ۲۰ کیلوبایت تا ۶۰ کیلوبایت متغیر است.

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

اولین کاری که باید انجام دهید این است که از فایل htaccess خود بک آپ بگیرید تا اگر مشکلی پیش آمد، بتوانید سریع آن را برطرف کنید. سپس کد زیر را درون فایل htaccess خود کپی کنید:

AddType x-font/otf
AddType x-font/ttf
AddType x-font/eot
AddType x-font/woff

سپس، کد زیر را بیافزایید که gzip برای فونت ها فعال شود.

AddOutputFilterByType DEFLATE x-font/otf x-font/ttf x-font/eot x-font/woff

با همین کار کوچک توانستید فونت های خود را فشرده کنید و سرعت لود و رندر صفحات خود را کمی افزایش دهید.

اگر نوشته‌ای که خواندید مفید بود، آن را با دوستانتان به اشتراک بگذارید:

دیدگاه‌ها/سوالات کاربران

جالب و کاربردی بود

زنده باد … استفاده کردم

یعنی این خودش خروجی فونت ها رو فشرده میده؟ نمیخواد مثلا zip کنیم؟
مرسی

برای asp.net هم راه حلی هست؟
چون فکر کنم این کار مخصوص php هستش

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

من w3 total cache رو استفاده میکنم
اما طبق گفته GTmetrix فونت رو gzip نمیکنه
وقتی که این کدها رو هم گذاشتم ، ارور ۵۰۰ داد
میشه بگید دقیقا کجا بزارمش؟

من این کد رو اضافه کردم ولی تو سایت http://gtmetrix.com/ همون ارور رو میده

error 500

به نظر شما نباید مقدار هارو تو کانتینر گزاشت ؟ 😐

    Header set cache-control: public
    ExpiresActive on

    ExpiresByType font/ttf “access plus 1 month”
    ExpiresByType font/woff “access plus 1 month”
    ExpiresByType image/svg+xml “access plus 1 month”

    SetOutputFilter DEFLATE

سلام
خیلی ممنون از مطلب خوبتون
واسه من جواب داد.

سلام همینجوری باید بنویسیم x-font ؟! یا باید اسم و آدر فونت خودمون رو بذاریم؟ من سایتم دو تا فونت داره در این صورت باید چکار کنم؟

    این کد به صورت خودکار تمامی فونت‌های شما را فشرده می‌کند و نیازی به آدرس دادن جز به جز نیست.

شما چه دیدگاهی دارید؟

    لطفا نکات زیر را در نظر داشته باشید:

  • لطفا دیدگاه/سوال خود را با زبان و کی‌برد فارسی ارسال کنید
  • لطفا از تبلیغ مستقیم وب‌سایت خود خودداری کنید
  • نظراتی که با چیزی به جز نام ارسال شده باشند تایید نخواهند شد حتی اگر مفید باشند

در خبرنامه ایمیلی فرنیان عضو شوید

هر هفته یک ایمیل، شامل محتواهایی که باید در زمینه بازاریابی بخوانید!

در خبرنامه ایمیلی فرنیان عضو شوید

هر هفته یک ایمیل، شامل محتواهایی که باید در زمینه بازاریابی بخوانید!