آموزش استفاده از فونت آیکن در طراحی سایت

در سایت های مختلف حتما آیکن های گرافیکی جذابی را دیده اید که برای شبکه های اجتماعی و یا برای داخل نوشته ها از آن استفاده شده است. حالا اینکه این آیکن ها عکس هستند و یا فونت؟ بیشتر درباره اش صحبت میکنیم و یا اینکه اصلا چه فرقی با هم دارند؟ و با اینکه کدوم یکی بهتر است؟
پس با ما همراه باشید تا درباره فونت آیکن ها با هم صحبت کنیم.
در سایت ها موقع طراحی سایت برای نمایش قشنگ تر شبکه های اجتماعی از آیکن های رنگی استفاده میکنند. ولی یک نکته وجود دارد آن هم اینکه اگر تعداد این آیکن ها زیاد باشد برای لود صفحه دچار مشکل میشوید اگر این آیکن ها را به صورت img داخل سایت قرار داده باشید. چون وب سایت برای لود این عکس ها مجبور است وقت صرف کند. راه حل برای استفاده از آیکن ها زیبا در سایت چیست؟
برای حل مشکل لود آیکن و همچنین سرعت … هنگام طراحی وب سایت از فونت آیکن استفاده میشود.

فونت آیکن چیست؟

در واقع فونت آیکن ها تصویر های وکتوری هستند که در قالب یک فونت ارائه میشوند. که شامل ویژگی های کم حجم بودن، سادگی استفاده ، توانایی تغییر در سایز بدون تغییر در کیفیت آیکن… را دارد.
فونت آیکن های زیادی در حال آمادن در بازار اینترنتی هستند.از معروف ترین فونت آیکن های موجود میتوان به Font Awesome اشاره کرد.
نحوه استفاده از Font Awesome در طراحی سایت
آخرین ورژن موحود فونت آیکن را از سایت http://fontawesome.io/ دانلود کنید. پس از دانلود در سیستم پوشه font و css آن را در فایل پروژه خود ذخیره کنید.
بعد از آن فایل ها را به سیستم خود متصل کنید. برای css کافی است آن را در head سایت خود اضافه کنید. حالا میتوانید از فونت آیکن ها در سایت خود استفاده کنید
وارد بخش آیکن های سایت http://fontawesome.io/icons/ شوید.همانطور که میبینید این سایت تعداد آیکن های فوق العاده زیادی دارد که میتوانید از آن ها در زمینه ای مختلف سایتتان استفاده کنید.

همچنین میتوانید با fa-2x ، fa-3x … اندازه ایکن را انتخاب کنید
نکته مهم: به دلیل اینکه این آیکن ها به صورت فونت هستند برای تغییر در رنگ و اندازه و جای ایکن ها… میتوانید از css استفاده کنید و به آن ها رنگ دلخواه را بدهید.

علت استفاده از فونت آیکن ها

وجود آیکن هایی که توانایی تنظیم سایز بدون تغییر در کیفیت آیکن صورت میگیرد. و همچنین سرعت بالا در بود آن ها از مهمترین ویژگیه ای استفاده از فونت آیکن ها است.ما در اینجا به معرفی font پرداختیم شما میتوانید از فونت آیکن های دیگری برای سایت خودتان استفاده کنید که این بر اساس سلیقه شخصی شما است.نکته مهم در استفاده از تمامی فونت آیکن ها این است که شما نحوه اجرا و استفاده از آن ها را یاد بگیرید