طراحی سایت

WOFF: تحول در نمایش فونت در وب

73 / 100

 WOFF چیست؟

طی سال های گذشته شاهد رشد چشمگیر دنیای وب، و همچنین مرورگرها بودیم. با ورود مرورگرهای جدید به حیاط خلوت اینترنت اکسپلورر، و رقابتی شدن فضا، هر روز شاهد ایجاد امکانات بیشتری در صفحات وب هستیم که تا قبل از آن منحصر به برنامه های تحت سیستم عامل (Desktop Applications) بودند. مانند استفاده از GPU برای رندر کردن انیمیشن ها، قابلیت های چندرسانه ای مرورگرها و از این دست امکانات که به زودی با اتمام استانداردهای HTML 5، در تمام مرورگرها تقریباً به طور یکسان قابل استفاده خواهند بود. و تا به حال نیز، بسیاری از قابلیت های تعریف شده در HTML 5 توسط مرورگرها پیاده سازی شده اند.

در این میان توجه به یک نکته بسیار ضروری به نظر می رسید: حروفچینی در صفحات وب. این واقعیت که تنها می توان از فونت های استاندارد و فراگیر در طراحی صفحات وب استفاده کرد، بسیاری از طراحان را رنج می دهد. علاوه بر این، بسیاری از امکانات مورد نیاز طراحان در ارتباط با نگارش متن و حروفچینی به صورت کدهای CSS یکپارچه ( که به طور یکسان در تمام مرورگرها پشتیبانی شود) در اختیار آن ها قرار ندارد.

در پیشنویس استانداردهای CSS3 مربوط به فونت، پیشرفت هایی دیده می شود که قابل توجه و تقدیر است. اما کافی نیست. البته این قابلیت های جدید در حوزه فونت، در ترکیب با قابلیت های جدید گرافیکی اضافه شده به CSS3، امکانات خوبی در اختیار طراحان قرار خواهد داد. از جمله این قابلیت ها، افزوده شدن font-face@ به قسمت منابع فونت (Font Resources) در CSS است که به طراحان اجازه می دهد تا از فونت های مورد نیاز خود که ممکن است بر روی سیستم کاربر موجود نباشد، استفاده کند.

استفاده از این قابلیت در مرورگرهای Firefox 3.5، Safari 3.1، Opera 10، Chrome 4.0 Stable Release، IE 4 و نسخه های جدیدتر این مرورگرها امکان پذیر است. اما چند مشکل عمده بر سر راه این قابلیت جدید، قرار دارد. یکی عدم پشتیبانی از یک فرمت مشترک در تمامی مرورگرها است. به عنوان مثال، مرورگر IE تنها از فونت هایی با فرمت EOT پشتیبانی می کند. و یا Opera تنها از فرمت های TTF و OTF پشتیبانی می کند. مشکل دیگر در استفاده از این قابلیت، پرحجم بودن فایل های فونت است که در صورت نیاز، باید همراه صفحات بارگزاری شوند و این باعث کندی نمایش صفحات خواهد شد.

برای رفع مشکل حجم فایل های فونت، دو نفر از طراحان فونت به نام های Tal Leming و Erik van Blokland که بر روی فرمت .webfont کار می کردند با Jonathan Kew از کارکنان Mozilla که بر روی پروژه مشابه ای کار می کرد، همکاریی را آغاز نمودند که به فرمتی با نام Web Open Font Format انجامید که در آن، اطلاعات مربوط به فونت به صورت فشرده قرار می گیرد، بنابراین پهنای باند مورد استفاده برای بارگزاری آن بسیار کمتر است. بعلاوه، حق مالکیت فونت ها توسط سازندگان به رسمیت شناخته می شود، که از این طریق حمایت سازندگان و طراحان فونت نیز جلب می شود.

مرورگر Firefox نسخه ۳.۶ از این فرمت پشتیبانی می کند.

WOFF در واقع فرمت جدیدی از فونت‌ها نیست بلکه یه بسته‌بندی جدید از فرمت‌های TrueType و OpenType هست.

مزایای WOFF چیست؟

۱- فشرده‌سازی: فونت‌ها به صورت فشرده‌ شده بارگذاری می‌شن که باعث کاهش چشمگیر حجم فونت دانلودی نسبت به استفاده از فرمت‌های خام دیگه میشه. مثلا فونتی که حجمش ۱۰۰ کیلوبایته، میشه ۴۰ کیلوبایت و این یعنی افزایش سرعت.

۲- اطلاعات اضافی: فونت بارگذاری شده شامل یک سری meta data هم هست.

تفاوت WOFF با TrueType و OpenType

فرمت WOFF تنها یک بسته بندی جدید از فونت هایی با فرمت TrueType و OpenType است و خود قابلیت جدیدی برای فونت ها عرضه نمی کند و هیچ تأثیری بر چگونگی رندر (Render) شدن آن ها توسط مرورگر ندارد.

همانطور که اشاره شد، تفاوت اول بین این فرمت ها، در فشردگی اطلاعات مربوط به فونت است که باعث می شود طراحان، صفحات با حجم کمتری ( نسبت به استفاده از فونت هایی با فرمت TrueType و OpenType ) ایجاد نمایند. این نوع فشردگی از نوع Lossless است بدان معنا که پس از فرایند uncompressing، اطلاعات فونت دقیقاً با فونت اصلی در فرمت TrueType یا OpenType مطابقت دارد. فشردگی مشابه ای می تواند از طریق HTTP compression نیز حاصل شود، اما چون در فرمت WOFF اطلاعات خود فشرده هستند، در مواردی که تنظیمات Server در دسترس نیست، استفاده از این فرمت کار را آسان خواهد نمود.

تفاوت دوم در آن است که WOFF می تواند شامل metadata-یی باشد که اطلاعاتی در مورد سازندگان فونت، نحوه استفاده از آن، مجوز استفاده و … را در خود جای داده است. این

اطلاعات تأثیری بر چگونگی نمایش فونت ندارند و تنها جنبه ی اطلاعاتی دارند. و نکته دیگر آنکه اطلاعات در این فرمت فشرده هستند اما رمزگذاری نشده اند. بنابراین این فرمت برای مواردی که نیاز به محدود کردن استفاده از فونت می باشد، کارا نیست.

از لحاظ ساختاری، فرمت WOFF، قسمت جدول داده های فونت در فونت های TrueType و OpenType را به صورت فشرده در مجموعه جدول هایی به نام FontTables جای می دهد. پس از این جداول نیز، اطلاعات metadata قرار می گیرد و پس از آن نیز اطلاعات خصوصی سازندگان فونت نیز جای داده می شود که مختص به سازندگان است و می تواند رمزگذاری شده باشد.

به شکلی خلاصه تر می توان تفاوت WOFF را با TrueType و OpenType اینگونه برشمرد:

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

دوم؛ این فرمت شامل اطلاعات اختیاری هم هست که توزیع‌کننده فونت می‌تونه فونت رو برچسب‌گذاری کنه یا اینکه مواردی رو در مورد استفاده از فونت مورد نظر ذکر کنه. بهترین استفاده‌ای که این اطلاعات می‌تونن داشته باشن برای طراحان سایته! ابزارهایی که می‌تونن این اطلاعات رو آنالیز کنن می‌تونن اطلاعات دقیق فونت استفاده شده رو به دست بیارن و در طراحی‌هاشون استفاده کنن.

منبع:سایت پی‌ سی‌ پدیا

میتوانید بخوانید: https://artanbiz.com/fa/%d9%86%da%a9%d8%a7%d8%aa-%d9%85%d9%87%d9%85-%d8%af%d8%b1-%d8%b7%d8%b1%d8%a7%d8%ad%db%8c-%d8%b3%d8%a7%db%8c%d8%aa-%d9%81%d8%b1%d9%88%d8%b4%da%af%d8%a7%d9%87-%d8%a7%db%8c%d9%86%d8%aa%d8%b1%d9%86%d8%aa/

نمایش بیشتر

علی جلیل‌پور

علی جلیل‌پور هستم دیجیتال مارکتر و مدیر دایرکتوری تولیدکنندگان کالای باکیفیت داخلی و مدیر هایپر کالای آل‌ور‌سنتر که به تولیدکنندگان کمک میکنم با بهره‌مندی از ابزارهای #دیجیتال_مارکتینگ_مبتنی_بر_هوش_مصنوعی به #رتبه_اول_گوگل برسند و از افزایش فروش مستمر لذت ببرند.

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

همچنین ببینید
بستن
دکمه بازگشت به بالا