آموزش ساخت وب فونت

سلام

در طراحی سایت ها و صفحات وب ، یکی از عناصر مهم شکل و قالب نوشته ها است . چرا که نوشته ها مهمترین برقرار کننده ارتباط بین بیننده و سایت است و اگر قالب و شکل مناسبی نداشته باشند دچار دلزدگی و خستگی بازدید کننده وب سایت خواهد شد . شاید بتوان ساخت وب فونت را از نظر سئو نیز بررسی کرد و در سئوی وب سایت شما موثر دانست . در ادامه با ریسمان همراه باشید .

حال با بررسی فونت ها و گشت و گذار در دنیای فونت ها یک فونت را انتخاب کردیم که مناسب سایت ماست ، این فونت را به چه صورت و چگونه باید در سایتمان استفاده نماییم ؟ پاسخ ، استفاده از وب فونت است .

وب فونت چیست ؟

یک وب فونت (web font)  از چهار فرمت ttf , eot , woff , svg تشکیل شده است که این چهار فرمت توسط اعضای مختلف سایت تفسیر می شوند . مثلا کد های CSS و کد ها HTML و کد های JAVA هر کدام از نوعی از این فرمت ها استفاده می کنند .

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

آموزش ساخت وب فونت

آموزش ساخت وب فونت

آموزش ساخت وب فونت :

برای ساخت وب فونت که شامل فرمت های گوناگونی می شود که البته رایج ترینشان همان چهار تایی است که معرفی کردیم ، نرم افزار هایی هستند که فونت های معمولی با فرمت ttf را تبدیل به فرمت های دیگر وب فونت می کنند .

اما ساده تر از نصب و استفاده از نرم افزار استفاده از سرویس ها و سایت های آنلاینی است که خدمات ساخت وب فونت را ارائه می دهند . با جستجو در اینترنت تعداد زیادی از این گونه سایت ها را پیدا خواهید کرد .

ما نیز در ایجا یک نمونه از این سایت ها را که خیلی راحت کار تبدیل فونت ها و ساخت وب فونت را انجام می دهد به شما معرفی می کنیم . سایت FONT 2 WEB به آدرس www.font2web.com  به سادگی عملیات تبدیل فونت را به فرمت های گوناگون و ساخت وب فونت انجام می دهد .

کافی است که فوت هایتان را با فرمت های ttf و otf در این سایت آپلود کنید و درخواست تغییر به هر کدام از فرمت های .ttf, .otf, .eot, .woff and .svg را بدهید . پس از تنها پند ثانیه وب فونت شما آماده دانلود است .

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

استفاده از وب فونت :

اگر از CMS وردپرس استفاده می کنید ؛ در قالب اصلی سایتتان در قسمت ویرایش کد ها ؛ فایل Style.css را بررسی کنید ، قسمتی برای معرفی خانواده فونت ها یا فونت فمیلی ( Font Family ) قرار گرفته است که به معرفی این چهار فرمت و نام فونت ها پرداخته است . همچنین این فونت ها در پوشه ی قالب شما در پوشه ای به نام فونت قرار گرفته اند . ابتدا فونت های مورد نظر خود با چهار فرمت معرفی شده را در پوشه فونت قرار دهید و سپس در قسمت کد های قالب به معرفی آن ها بپردازید . البته به شما توصیه می کنم که به جای تغییر در کد های قالب ، نام فونت های استفاده شده در قالبتان را به فونت هایی که ساخته اید نسبت دهید و سپس این فونت های جدید را به نسخه های قدیمیشان در سایتتان تعویض کنید .

این مطلب تالیفی است و حق نشر برای سایت ریسمان محفوظ است .

انتشار این مطلب تنها با ذکر نام ریسمان به عنوان منبع و قرار دادن لینک فعال مطلب مجاز است .

امیدوارم مورد استفاده شما قرار گرفته باشد .

لینک مطلب :   http://goo.gl/W8O3KF

اشتراک گذاري در کلوب اشتراک گذاري در گوگل پلاس اشتراک گذاري در فيسبوک

شاید این مطالب را هم دوست داشته باشید

پاسخ دهید

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