تبدیل PNG به ICO برای فاویکون واضح
فاویکون تصویر کوچکی است که به وبسایت هویت بصری می‌دهد. آن را در تب مرورگر کنار عنوان صفحه، در فهرست نشانک‌هایتان، در منوی کشویی نوار آدرس تاریخچه مرور و گاهی کنار نتایج جستجو می‌بینید. کوچک است، اما کار زیادی انجام می‌دهد: یک فاویکون شناخته‌شده به کاربران کمک می‌کند تب شما را در میان ده‌ها تب دیگر پیدا کنند و نشان می‌دهد سایت کامل و مراقبت‌شده است. فرمت کلاسیک برای آن آیکون کوچک ICO است، و ساده‌ترین راه برای ساختن آن شروع از یک PNG مربعی تمیز و تبدیل آن است.
این ابزار یک تصویر PNG را می‌گیرد و همین‌جا درون مرورگرتان به فاویکون ICO تبدیل می‌کند. تبدیل با استفاده از دستگاه خودتان به صورت محلی اجرا می‌شود، بنابراین تصویری که انتخاب می‌کنید هرگز به سرور آپلود نمی‌شود. این مهم است وقتی آیکون شما یک لوگو یا دارایی برندی است که ترجیح می‌دهید به شخص ثالث ندهید. وقتی فایل آماده شد، فقط آن را دانلود می‌کنید.
فرمت ICO چیست و چرا چندین اندازه دارد
ICO یک فرمت ظرف آیکون است که در Microsoft Windows ریشه دارد، که در آن آیکون‌های استفاده‌شده برای برنامه‌ها، میانبرها و پوشه‌ها را ذخیره می‌کند. ویژگی تعریف‌کننده‌اش، و دلیلی که به استاندارد فاویکون وب تبدیل شد، این است که یک فایل ICO می‌تواند همان تصویر را در چندین وضوح به یکباره نگه دارد. به جای یک بیت‌مپ ثابت، فایل مجموعه کوچکی از تصاویر مربعی را بسته‌بندی می‌کند و به مرورگر یا سیستم‌عامل اجازه می‌دهد هر اندازه‌ای که برای جایی که باید آیکون را ترسیم کند مناسب است انتخاب کند.
این واقعاً مفید است. یک تب مرورگر به یک آیکون کوچک نیاز دارد، یک نوار نشانک ممکن است از یکی کمی بزرگ‌تر استفاده کند، و یک میانبر پین‌شده روی دسکتاپ می‌تواند چیز بزرگ‌تری بخواهد. با یک ICO چند اندازه، هر زمینه نسخه‌ای را که مناسب است انتخاب می‌کند، بنابراین آیکون شما به جای اینکه از یک بیت‌مپ کوچک بزرگ شود و تاری شود تیز می‌ماند. ICO همچنین شفافیت را حفظ می‌کند، که گوشه‌های یک لوگوی گرد یا نامنظم را در برابر هر رنگ تبی تمیز نگه می‌دارد.
اندازه‌های توصیه‌شده فاویکون
برای فاویکون وبسایت، سه اندازه ارزش گنجاندن دارند: ۱۶x۱۶، ۳۲x۳۲ و ۴۸x۴۸ پیکسل. نسخه ۱۶ پیکسلی آن است که بیشتر مرورگرها در تب و نوار آدرس نشان می‌دهند. نسخه ۳۲ پیکسلی روی نمایشگرهای با وضوح بالاتر و در برخی نماهای نشانک و تاریخچه استفاده می‌شود، پس چیزها را روی صفحه‌های مدرن تیز نگه می‌دارد. نسخه ۴۸ پیکسلی زمینه‌های بزرگ‌تر مانند میانبرهای سایت Windows را پوشش می‌دهد. چون همه آن‌ها درون یک فایل ICO زندگی می‌کنند، یک دارایی تحویل می‌دهید و اجازه می‌دهید هر رابطی چیزی را که نیاز دارد انتخاب کند.
از یک PNG مربعی شروع کنید تا چیزی کشیده نشود. اگر تصویر منبع شما مستطیلی یا خیلی بزرگ است، ابتدا با تغییر اندازه دهنده تصویر ما آن را به یک مربع تمیز برش دهید یا مقیاس دهید، سپس تبدیل را اجرا کنید. یک طرح ساده و پرتضاد در ۱۶ پیکسل بسیار بهتر از یک تصویرسازی پرجزئیات خوانده می‌شود، پس اشکال پُررنگ را به متن ریز ترجیح دهید.
چطور فاویکون را به سایتتان اضافه کنید
وقتی فایل ICO را داشتید، آن را به وبسایتتان آپلود کنید، به طور سنتی به ریشه سایت به صورت favicon.ico. بسیاری از مرورگرها آن را آنجا به طور خودکار پیدا می‌کنند، اما بهترین روش این است که آن را به صراحت در head HTML اعلام کنید تا هیچ حدس و گمانی وجود نداشته باشد. یک تگ link مانند این اضافه کنید:
<link rel="icon" type="image/x-icon" href="/favicon.ico">
این خط را داخل بخش <head> صفحاتتان قرار دهید. ویژگی rel="icon" به مرورگر می‌گوید این منبع آیکون صفحه است، و href به هر جایی که فایل را ذخیره کردید اشاره می‌کند. اگر از یک مسیر نسبی به ریشه مانند مثال بالا استفاده کنید، همان اعلام در هر صفحه سایتتان کار می‌کند. بعد از استقرار، ممکن است نیاز داشته باشید یک بارگذاری سخت انجام دهید یا کش را پاک کنید قبل از اینکه آیکون جدید ظاهر شود، چون مرورگرها فاویکون‌ها را به شدت نگه می‌دارند.
تبدیل خصوصی در مرورگر شما
همه چیز روی دستگاه شما اتفاق می‌افتد. PNG که انتخاب می‌کنید به صورت محلی خوانده، رمزگشایی و به صورت ICO رمزگذاری می‌شود، و هیچ‌چیزی در طول فرآیند دستگاهتان را ترک نمی‌کند. هیچ حساب کاربری، صف انتظار و ذخیره‌سازی سمت سرور وجود ندارد، که این را حتی برای لوگوهای منتشرنشده یا کارهای مشتری تحت قرارداد راحت می‌کند. برای روش‌های بیشتر آماده‌سازی و مرتب‌سازی گرافیک‌ها، مجموعه کامل ابزارهای تصویر ما را ببینید.
سوالات متداول
آیا تصویرم جایی آپلود می‌شود؟
خیر. PNG کاملاً در مرورگر شما روی دستگاه خودتان به ICO تبدیل می‌شود. هیچ‌چیزی به سرور ارسال نمی‌شود و هیچ‌چیزی ذخیره نمی‌شود، بنابراین تصویرتان خصوصی می‌ماند.
فاویکون من باید چه اندازه‌هایی داشته باشد؟
مفیدترین اندازه‌ها ۱۶x۱۶، ۳۲x۳۲ و ۴۸x۴۸ پیکسل هستند. تصویر ۱۶ پیکسلی در تب‌های مرورگر نشان داده می‌شود، در حالی که بزرگ‌تری‌ها آیکون را روی نمایشگرهای با وضوح بالا و میانبرهای دسکتاپ تیز نگه می‌دارند.
چرا از ICO به جای فقط PNG استفاده کنم؟
ICO فرمت فاویکون دیرینه است و می‌تواند چندین اندازه را درون یک فایل ذخیره کند. مرورگرها و سیستم‌عامل وضوحی را که در هر زمینه‌ای مناسب است انتخاب می‌کنند، بنابراین آیکون به جای اینکه از یک بیت‌مپ منفرد مقیاس شود تیز می‌ماند.
آیا ICO شفافیت PNG را نگه می‌دارد؟
بله. فرمت ICO از شفافیت پشتیبانی می‌کند، بنابراین نواحی شفاف PNG حفظ می‌شوند و آیکون به تمیزی با هر رنگ تب یا پس‌زمینه‌ای ترکیب می‌شود.
چطور فاویکون را به وبسایتم اضافه کنم؟
فایل ICO را روی سایتتان آپلود کنید، معمولاً به صورت favicon.ico در ریشه، و یک تگ link در head HTML اضافه کنید مانند link rel icon type image x-icon href slash favicon.ico. سپس کش مرورگرتان را پاک کنید تا آن را ببینید.
تصویر منبع من مربعی نیست. چه باید کنم؟
ابتدا آن را برش دهید یا به یک مربع مقیاس دهید تا کشیده نشود. می‌توانید از تغییر اندازه دهنده تصویر ما یک مربع تمیز بسازید، سپس آن را برای بهترین فاویکون به ICO تبدیل کنید.