خوش آمدید، مهمان ! [ثبت نام | ورود contact

چگونه فونت وبلاگ و یا سایت خود را تغییر دهیم؟ آشنایی با وب فونت و روش تبدیل فرمت های فونت

راهنما ۲۹ آذر، ۱۳۹۳

تغییر فونت سایتهای انگلیسی زبان در خارج بسیار مرسوم است. اما همچنان افراد زیادی هستند که از تغییر فونت پیش فرض سایتشان ابا دارند. ما در این مطلب بنا داریم روش تغییر فرمت فونتها و همچنین تغییر فونت سایت و نیز معرفی برخی فونتها استاندارد برای وب (به زودی) را در اختیار شما کاربران عزیز قرار دهیم.

آشنایی با وب فونت

وب فونت امکانی است که به طراحان وب اجازه می دهد تا
فونت مورد نظر خود را در صفحات وب سایت استفاده کنند. با استفاده از این
قابلیت حتی در صورتی که فونت استفاده شده بر روی سیستم شخص بازدید کننده
موجود نباشد نیز قابل مشاهده خواهد بود. وب فونت ها، فونت هایی هستند که از طریق دستور font-face@ در CSS می توانید آنها را ازمسیری که قرار دارند فراخوانی کرده و در صفحه استفاده نمایید.
سایت Font Converter
یک سایت خدمات آنلاین تبدیل فرمت های فونت جهت استفاده در صفحات وب می
باشد. با توجه به اینکه مرورگر ها از یک یا چند فرمت خاص از یک فونت
پشتیبانی می کنند، لذا برای اینکه بتوانید فونت مورد نظر خود را در همه
مرورگرها به درستی نمایش دهید، لازم است که فرمت های رایج وب فونت ها را در
صفحه فراخوانی نمایید.
این ابزار فرمت های مورد نیاز را برای شما تولید کرده و همچنین در صورت
تمایل می توانید CSS آن را هم دریافت و استفاده نمایید.

حداقل نسخه مرورگرها در پشتیبانی از فرمت های مختلف فونت در جدول زیر نمایش داده شده است. (جدول زیر)

Font formatIEChromeFirefoxSafariOpera
TTF/OTF۹.۰*۴.۰۳.۵۳.۱۱۰.۰
WOFF۹.۰۵.۰۳.۶۵.۱۱۱.۱
WOFF2پشتیبانی نمی شود۳۶.۰۳۵.۰*پشتیبانی نمی شود۲۶.۰
SVGپشتیبانی نمی شود۴.۰پشتیبانی نمی شود۳.۲۹.۰
EOT۶.۰پشتیبانی نمی شودپشتیبانی نمی شودپشتیبانی نمی شودپشتیبانی نمی شود

*IE: فرمت فونت فقط وقتی کار می کند که نصب و فراخوانی شده باشد.

*Firefox: به طور پیش فرض پشتیبانی نمیکند, اما قابل فعال شدن است با تعریف یک FLag حالت True برای استفاده از WOFF2.

راهنمای استفاده از وب فونت

در سایت زیر تنها در ۳ مرحله می توانید فرمت های مورد نظر خود را ایجاد و آنها را به همراه CSS مربوطه دانلود و استفاده نمایید.

  • مرحله ۱: آپلود فونت (ttf/eot/woff/…)
  • مرحله ۲: انجام تنظیمان لازم و انتخاب فونت های مورد نظر
  • مرحله ۳: دانلود فونت ها

نمونه فراخوانی فونت در صفحه با استفاده از قابلیت font-face@:

  @font-face {
  font-family: 'BYekan';
  src: url('fonts/BYekan.eot?#') format('eot'),  /* IE6–۸ */
       url('fonts/BYekan.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
       url('fonts/BYekan.ttf') format('truetype');  /* Saf3—۵, Chrome4+, FF3.5, Opera 10+ */
}

عناوین مرتبط

اشتراک گذاری: Telegram twitter facebook googleplus
instagram.com/iranfont telegram.me/iranfont

دیدگاه بگذارید

اولین نفری باشید که نظر می‌گذارد!

avatar
wpDiscuz
  • کارکرد فونت ها در تایپوگرافی ها

    با در ۲ اردیبهشت، ۱۳۹۶ - 2 نظرات

    کاربرد فونت ها در تایپوگرافی. ما در این یادداشت شما را با کاربرد و تایپوگرافی و نکاتی درباره فونت ها در تایپوگرافی آشنا خواهیم کرد. ایران فونت

  • نقش فونت‌ های نوشتاری در صنعت تبلیغات

    با در ۶ اردیبهشت، ۱۳۹۶ - 0 نظرات

    نقش فونت‌ های نوشتاری در صنعت تبلیغات / تزیینی یا کاربردی ، مسئله این است مخاطبان ایرانی برای نوشتار ارزش ویژه‌ای قائلند. این نکته‌ای است که بسیاری از طراحان تبلیغاتی به آن اشاره می‌کنند و به همین خاطر دائم سعی دارند سراغ جملات و شعارهای راحتی بروند که مخاطبان در نگاه اول آنها را بفهمند؛ […]

  • مقدمه ای برفونت ها و آیین نگارش

    با در ۶ اردیبهشت، ۱۳۹۶ - 0 نظرات

    مقدمه ای برفونت ها و آیین نگارش همان گونه كه هر شخص با قلم خویش, نوعی متفاوت از قلم دیگری می نویسد, فونت ها و آیین نگارش هم مثل هم نیستند و هر كدام شكل منحصربه فردی دارند. ● درآمد در دوران گذشته که هنوز دستگاهی اختراع نشده بود تا متن را به‌صورت منظم و […]

Mellat-logo logo-enamad logo-samandehi Saman-logo

کلیک روی تبلیغات = حمایت از ایران فونت