Favicon آن تصویر کوچک جالب در کنار نوار آدرس شما در مرورگر شما است. این چیزی است که سایت شما را در برگه نشانک ها متمایز می کند و می تواند برای افزایش آگاهی از نام تجاری استفاده شود. اگر سایتی دارید اما هرگز به فکر ایجاد یک favicon نبوده اید ، باید در تصمیم خود تجدید نظر کنید. به طور فزاینده ای ، توسعه دهندگان نرم افزار از favicons برای جنبه های مختلف برنامه های خود مانند نمادهای صفحه اصلی در رایانه لوحی استفاده می کنند. خوشبختانه طراحی ، ایجاد و پیاده سازی یک favicon کاری است که تقریباً همه می توانند در صورت انجام مراحل صحیح انجام دهند.
مراحل
روش 1 از 3: طراحی Favicon شما
مرحله 1. یک favicon ایجاد کنید که نشان دهنده وب سایت شما باشد
نوع وب سایتی که دارید باید ظاهر مورد علاقه شما را تعیین کند. سعی کنید چیزی را طراحی کنید که مطابق تصویر برند شما باشد و برای افراد قابل تشخیص و به یاد ماندنی باشد. مورد علاقه شما اولین چیزی است که افراد هنگام مشاهده برگه ها در مرورگر خود مشاهده می کنند و همچنین در نشانک های افراد ظاهر می شود.
- به عنوان مثال ، اگر وب سایت غذایی دارید ، انتخاب فاویکنی که دارای میوه یا سبزیجات است ، ممکن است آن را به یاد ماندنی تر کند.
- اگر وب سایت شما برای یک شرکت حقوقی یا شرکت سرمایه گذاری است ، یک فاویکون سنتی و شیک بهترین است.
- اگر وب سایت شما برای افراد جوان تر طراحی شده است ، سعی کنید یک فاویکون بازیگوش و رنگارنگ ایجاد کنید.
مرحله 2. تصمیم بگیرید که آیا یک پس زمینه شفاف می خواهید
اگر پس زمینه ای را تعیین نکنید ، سفید می شود ، که ممکن است به مارک شما نچسبد. پس زمینه شفاف رنگ مرورگر شخص را به خود گرفته و در برخی موارد ساده تر به نظر می رسد. در موارد دیگر ، داشتن یک رنگ برای پس زمینه باعث می شود حروف پیش زمینه یا گرافیک ظاهر شوند. تصمیم بگیرید که چه چیزی برای طراحی شما مناسب تر است و هنگام طراحی آن را در نظر داشته باشید.
اساسی ترین فاویکون مربع 16 16 16 است و رنگ پس زمینه دارد
مرحله 3. یک favicon ایجاد کنید که خواندن آن آسان است
از آنجا که تصویر مورد علاقه شما کوچک است ، مهم است که بتوانید مارک خود را بدون سردرگمی بازدیدکنندگان خود به اشتراک بگذارید. فاویکونی که خواندن آن سخت است ، تأثیر منفی بر جای می گذارد و می تواند در مورد کیفیت کارهایی که می توانید ارائه دهید ، س questionsالاتی را در ذهن بازدیدکنندگان ایجاد کند. تصاویر و لوگوهای بسیار پیچیده هنگامی که به اندازه 16x16 یا 32x32 پیکسل کوچک شوند ، خوب به نظر نمی رسند.
- اگر لوگوی موجود شما بسیار پیچیده است ، می توانید از تاکتیک ها برای ساده سازی آن استفاده کنید ، بنابراین در اندازه دلخواه قابل تشخیص است. به جای نشان دادن کل نام شرکت ، از حروف اول استفاده کنید یا به جای استفاده از تصویر ، یک نماد ساده طراحی کنید.
- اگر قبلاً یک لوگوی ساده دارید ، می توانید تصویر را کوچک کرده و آن را به عنوان مورد علاقه خود تنظیم کنید. ممکن است لازم باشد قبل از تبدیل آن به فایل نماد ، آن را تغییر دهید.
- همچنین می توانید از تصویری از یک شی استفاده کنید که موضوع کلی سایت شما را توصیف می کند.
مرحله 4. یک فاویکون زیبا و زیبا ایجاد کنید
ساختار فاویکون شما فرم آن نامیده می شود. فاویکون ها معمولاً شکل هایی مانند دایره یا مربع به خود می گیرند. وقتی فاویکون خود را طراحی می کنید ، به طور کلی بهتر است بتواند در یکی از این اشکال اصلی جا بگیرد ، زیرا اشکال فرم آزاد اغلب در 16x16 پیکسل ممکن است در هم پیچیده یا گیج شوند. یکی دیگر از جنبه های مهم طراحی شما وحدت زیبایی است. وحدت زیبایی شامل جزئیات و اندازه اجزای مختلف در favicon شما و نحوه متعادل شدن favicon شما است. هرچه جزئیات یکنواخت تر باشد ، فاویکون شما منسجم تر به نظر می رسد. به عنوان مثال ، استفاده از انواع فونت ها یا اندازه های مختلف در دلخواه شما برای چشم خوشایند نیست و می تواند فاویکون شما را گیج یا کثیف نشان دهد.
- یکی دیگر از نمونه های وحدت زیبایی شناختی حفظ گوشه های گرد در تمام اشکال در فاویکون شما است.
- یک مثال خوب از نمادی که تغییر شکل داده ، فاویکن گوگل است. از مربع به دایره تبدیل شده است.
مرحله 5. از رنگ هایی استفاده کنید که برای برند شما منسجم باشد
وقتی فاویکون خود را ایجاد می کنید ، باید آن را در عمق رنگ 8 بیتی (256 رنگ) یا 24 بیتی (16.7 میلیون رنگ) ایجاد کنید ، زیرا این امر در مرورگرهای مدرن کار می کند. اطمینان حاصل کنید که رنگهایی که انتخاب می کنید در جاهای دیگر وب سایت شما یافت می شوند یا به نوعی با نام تجاری شما مرتبط هستند. یک رنگ دلخواه با رنگ هایی که در وب سایت ، لوگو یا برنامه های کاربردی شما وجود ندارد ، به یادماندنی نخواهد بود و افراد نمی توانند نماد را با نام تجاری شما مرتبط کنند.
- برخی از کاربردهای خلاقانه رنگ favicon شامل GitHub است که بسته به وضعیت سیستم شما رنگ ها را تغییر می دهد و Trello که بسته به رنگ پس زمینه شما تغییر می کند.
- رایج ترین رنگ هایی که در فاویکن ها استفاده می شود قرمز و آبی است.
مرحله 6. هنگام طراحی یک فاویکون ، مخاطبان خود را در نظر بگیرید
به غیر از شناسایی نام تجاری خود ، فاویکون شما باید برای بازدیدکنندگان جذاب به نظر برسد. افراد با سلایق ، علایق و هنجارهای اجتماعی متفاوت از منظرهای مختلف به نمادشناسی متفاوت نگاه خواهند کرد. تفاوت های فرهنگی در جامعه ما وجود دارد و می تواند مخاطبی را که سعی می کنید جذب کنید سردرگم یا دفع کند.
به عنوان مثال ، Mac Os X از تمبر استفاده می کند که یک نماد جهانی برای نامه است. استفاده از صندوق پستی چندان مثر نخواهد بود زیرا صندوق های پستی در نقاط مختلف جهان متفاوت است
مرحله 7. نظر دوستان و همکاران را جلب کنید
در حالی که از نظر گرافیکی فوق العاده فشرده نیست ، فاویکون بخش مهمی از نام تجاری شما است. به عنوان مثال ، به وب سایت های مورد علاقه خود مانند توییتر ، جیمیل ، فیس بوک یا wikiHow فکر کنید و اینکه چقدر فاویکون را با نام تجاری مرتبط می کنید. اگر چشم خوبی به طراحی ندارید ، یا از این که می خواهید از چه طرحی برای سایت خود استفاده کنید ، گیج شده اید ، با دوستانی که چشم به طراحی دارند یا در زمینه طراحی گرافیک کار می کنند مشورت کنید.
- از دوستان خود بخواهید ببینند آیا کسی می تواند مشاوره طراحی را به صورت رایگان ارائه دهد یا خیر.
- شرکت های بزرگتر دارای طراحان گرافیک داخلی هستند که می توانند تصویر مورد علاقه خود را ایجاد کنند.
روش 2 از 3: ایجاد Favicon شما
مرحله 1. از نرم افزار ویرایش عکس برای ایجاد مورد علاقه خود استفاده کنید
می توانید از نرم افزارهای ویرایش عکس مانند Adobe Photoshop یا Illustrator برای ایجاد تصویر مورد علاقه خود استفاده کنید. این نرم افزارهای کاربردی همچنین به شما امکان می دهند اندازه را تغییر دهید و تصویر را با فرمت مناسب صادر کنید. برخی از نرم افزارها به شما این امکان را می دهند که فاویکن خود را با دست ایجاد کنید.
- همچنین برنامه های ویرایش مخصوص favicon وجود دارد که می توانید بصورت آنلاین پیدا کنید.
- از یک موتور جستجو استفاده کنید و "ویرایشگرهای مورد علاقه" را تایپ کنید.
- اندازه بوم خود را 512x512 پیکسل کنید زیرا این عدد به اکثر اندازه های مورد علاقه تقسیم می شود و هنوز به اندازه کافی بزرگ است تا بتوانید به طور موثر ویرایش کنید.
- سایر نرم افزارهای رایج ویرایش عکس شامل GIMP ، PhotoScape و Paint. NET است.
- هنگام استفاده از این نرم افزار ، نمی توانید فایل های.ico را مستقیماً ویرایش کنید ، اما می توانید از فایل های.png ،-j.webp" />
مرحله 2. اندازه مورد علاقه خود را تغییر داده و ذخیره کنید
32x32 پیکسل اندازه موارد دسکتاپ ویندوز است در حالی که 16x16 پیکسل اندازه دلخواه در برگه مرورگر شما است. بعد از اینکه فاویکون خود را در قالب بزرگتر ایجاد کردید ، مهم است که اندازه آن را کاهش دهید تا بتوانید ببینید که چگونه در مرورگرهای افراد ظاهر می شود. اگر قابل خواندن نیست یا از نظر زیبایی خوشایند نیست ، از ابتدا با طرح اصلی خود شروع کنید. به پلتفرم هایی فکر کنید که وب سایت یا برنامه شما به احتمال زیاد در آنها مورد استفاده قرار می گیرد و سپس یک favicon ایجاد کنید تا همه پایگاه های شما را پوشش دهد.
- توجه به این نکته ضروری است که سخت افزارها و نرم افزارهای مختلف از اندازه های مختلف فاویکون استفاده می کنند.
- برخی از سایزهای مورد علاقه دیگر عبارتند از 57x57px برای صفحه اصلی استاندارد iOS ، 72x72px برای iPad ، 96x96px برای Google TV ، 128x128px برای فروشگاه وب Chrome و 195x195px برای شماره گیری سریع Opera.
- اگر می خواهید تمام پایه های خود را پوشش دهید ، می توانید نسخه های مورد علاقه خود را در هر یک از این اندازه ها ایجاد کنید.
- نسخه های جداگانه مورد علاقه خود را ذخیره کنید ، بنابراین کاری را که انجام داده اید از دست ندهید.
مرحله 3. فایل های خود را با استفاده از مبدل ترکیب کنید
نکته جالب در مورد فایل های.ico این است که می توانید بیش از یک فایل را برای ایجاد آن ترکیب کنید. این مفید است زیرا مرورگرها و نرم افزارهای مختلف به یک فاویکون با اندازه متفاوت نیاز دارند. برای اینکه مطمئن شوید فاویکون شما در همه سیستم عامل های مختلف خوب به نظر می رسد ، فایل های خود را با استفاده از مبدل آنلاین تبدیل کنید. برای پیدا کردن برنامه های آنلاین رایگان برای انجام این کار ، "icon converter" را در موتور جستجوی مورد علاقه خود تایپ کنید. فایل ادغام شده را به عنوان "favicon.ico" ذخیره کنید.
- همچنین می توانید از برنامه ای مانند GIMP که دارای ویژگی داخلی است استفاده کنید ، یا افزونه ای به نام ICO FORMAT را در Adobe Photoshop بارگیری کنید.
- یک پوشه جدید ایجاد کنید تا بتوانید موارد دلخواه یا کارهای در حال انجام را ذخیره کنید.
- برای پیدا کردن ابزارهای مختلف که می توانید از آنها استفاده کنید ، ".ico converter" یا "favicon generator" را در موتور جستجو تایپ کنید.
روش 3 از 3: پیاده سازی Favicon شما
مرحله 1. اگر از ویرایشگر وب سایت استفاده می کنید ، مورد علاقه خود را بارگذاری کنید
بسیاری از ویرایشگران وب سایت دارای یک فرم داخلی هستند که به شما امکان می دهد مورد علاقه خود را به صورت خودکار در وب سایت خود بارگذاری کنید. اگر از ویرایشگر وب سایت استفاده می کنید که دارای این برنامه است ، در منوی تنظیمات وب سایت خود به دنبال گزینه هایی باشید که عبارت "Upload Favicon" یا "Add Favicon" را نشان می دهد. فایل favicon.ico خود را انتخاب کرده و آن را در سایت خود بارگذاری کنید.
اگر مکانی برای بارگذاری مورد علاقه خود در ویرایشگر وب سایت خود پیدا نکردید ، باید آن را به صورت دستی انجام دهید
مرحله 2. فایل را در فهرست اصلی سایت خود بارگذاری کنید
اگر وب سایت شما از پروتکل انتقال فایل یا FTP پشتیبانی می کند ، می توانید از سرویس گیرنده FTP خود برای بارگذاری فایل favicon.icon جدید خود در فهرست اصلی (index) خود استفاده کنید. اگر نه ، باید به صفحه میزبان وب خود بروید و تصویر را به صورت دستی بارگذاری کنید. به یاد داشته باشید که فایل favicon.ico موجود را با فایل جدید خود جایگزین کنید.
مرحله 3. فایل را به هدر خود اضافه کنید
مکانی را پیدا کنید که بتوانید به فایل های PHP و CSS سایت خود دسترسی پیدا کنید. به فایل header.php سایت خود بروید و آن را ویرایش کنید. تحت نوع برچسب ،"
-
. این باید سایت شما را به مورد دلخواه شما متصل کند.
از آنجا که از PHP استفاده می کنید ، به این معنی است که هر سایتی که از فایل هدر شما استفاده می کند ، اکنون دارای همان favicon است
مرحله 14 آیکون Favicon خود را ایجاد کنید مرحله 4. مرورگر خود را بازخوانی کنید
پس از اتمام بارگذاری مورد علاقه ، می توانید مرورگر خود را تازه کنید تا تصویر جدید خود را در کنار نوار آدرس مشاهده کنید. برای رفتن مستقیم به تصویر مورد علاقه خود به روز شده ، عبارت "https://www.yourdomain.com/favicon.ico" را تایپ کنید.
- اگر مورد علاقه شما در ابتدا ظاهر نمی شود ، ممکن است مجبور شوید کش مرورگر خود را بازنشانی کنید.
- برای پاک کردن حافظه پنهان ، به تنظیمات مرورگر خود بروید و فایل های موقت اینترنت ، کوکی ها و سابقه خود را حذف کنید.
