شاید برای طراحی قالب سایت به این برخورد کرده باشید که چه نوع ایکونی استفاده کنید.

قبلا تا جایی که من میدونم تقریبا از ایکون های GIF و PNG به صورت تک تک استفاده میشد اما بعد از یه مدتی اکثر ایکون های مورد استفاده رو در یک تصویر PNG ذخیره میکردند و هنوز هم بسیاری از سایت ها به این صورت هستن.

درحال حاضر روش های جدیدی اومده مثل استفاده از فونت ایکون یا ایکون های SVG اما کدوم برای استفاده بهتر هست ؟

لود تک تک ایکون های SVG درخواست هایی که باید به سمت سرور بره رو بالا میبره و باعث کند شدن سرعت بارگذاری سایت میشه. همچنین هنوز برخی مرورگر ها هستن که از این ایکون های SVG پشتیبانی کاملی نمیکنند.

ایکون های PNG در صورتی که همگی در یک فایل تصویری قرار بگیره یکی از روش های تقریبا مناسب هست اما در رزولیشن های بالا و پایین ممکنه بی کیفیت بشه که اگر ریز بینانه نگاه کنیم اصلا جلوه جالبی نداره .

اما فونت ایکون.

فونت ایکون یکی از بهترین روش ها هست که و فقط یکبار لود میشه و میتونید راحت ازش استفاده کنید. فونت ایکون رو میشه با کد تغییر رنگ داد و دقیقا مثل فونت های دیگه عمل میکنه. تغییر سایز تغییر رنگ و ..

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

ایکون های SVG و PNG گرافیکی و دارای تنوع زیادی هستن.

در مجموع برای استفاده از ایکون در سایت به نظر من بهتره از فونت ایکون استفاده بشه و برای موارد خاص که نیاز به ایکون های گرافیکی هست از سایر حالت های SVG ویا PNG استفاده بشه.

یکی از منابع فوق العاده فونت ایکون : http://fontawesome.io

یکی از منابع فوق العاده ایکون های SVG و PNG هم : http://flaticon.com

هست.

امیدوارم مفید باشه. تشکر