×
سلام
ورود و عضویت
آیا هنگامی که برای جست و جوی یک موضوع، چندین تب مختلف را همزمان در مرورگر خود باز می‌کنید، به آیکون‌های کوچک کنار عنوان سایت دقت کرده‌اید؟ می‌دانید این آیکون‌ها چیست و چرا از آن‌ها استفاده می‌کنیم؟ این آیکون‌های کوچک فاوآیکون هستند که یکی از معیارهای امتیازدهی در سئو محسوب می‌شوند. فاوآیکون‌ها با وجود اینکه کوچک هستند، نقش مهمی در برند سازی برای کسب و کار شما ایفا می‌کنند که در این مقاله در مورد آن صحبت می‌کنیم. همچنین با نحوه ساخت فاوآیکون و قرار دادن آن در وبسایت خود نیز آشنا می‌شویم. پس تا انتهای این مقاله با ما همراه باشید.
فاوآیکون، تصویر یا نماد کوچکی است که در کنار عنوان سایت در مرورگر نشان داده می‌شود. با استفاده از فاوآیکون، کاربرانی که همزمان چندین صفحه باز در مرورگر دارند، قادر هستند تا زودتر صفحه شما را پیدا کنند. بنابراین استفاده از فاوآیکون‌ها باعث تجربه کاربری بهتر و افزایش زیبایی سایت می‌شود.
در سال 1999 برای اولین بار در اینترنت اکسپلورر 5 ، فاوآیکون‌ها برای کمک به مخاطبان برای تشخیص صفحات مورد استفاده قرار گرفتند. در دسامبر سال 1999، کنسرسیوم وب جهانی (W3C)، فاوآیکون را استاندارد سازی کرد که بر اساس این استاندارد سازی، فاوآیکون می‌تواند در هر دایرکتوری وبسایت و با هر فرمت تصویری، قابل استفاده باشد.
favicon
فاوآیکون‌ها کوچک و معمولا در ابعاد 16*16 پیکسل هستند. اما نقش آن‌ها در شناخته شدن وبسایت شما قابل توجه است. در ادامه به اهمیت استفاده از فاوآیکون می‌پردازیم.
در این قسمت روش‌های مختلف قرار دادن فاوآیکون در سایت وردپرسی را شرح می‌دهیم.
ابتدا وارد هاست خود شوید. سپس در files روی گزینه File manager کلیک کنید. وارد Public_html شده و به دایرکتوری Wp-content بروید و در آن دایرکتوری Themes را باز کنید. در اینجا روی گزینه upload که در بالای صفحه وجود دارد، کلیک کنید. تصویر فاوآیکون خودتان را قرار دهید. سپس روی فایل header.php کلیک راست کنید و گزینه edit را بزنید. در فایل باز شده، کد زیر را در بین دو تگ <title></title> قرار دهید.
<link rel=”shortcut icon” href=”favicon.png”/>
اضافه کردن فاوآیکون
در این روش، ابتدا وارد سایت https://realfavicongenerator.net/ شوید و فاوآیکون خود را بارگذاری کنید تا یک url برای آن ساخته شود. روی گزینه Generate your Favicons and HTML code کلیک کنید تا یک کد HTML ایجاد شود و آن را کپی کنید. در افزونه insert headers and footers، کد خود را در قسمت <head> صفحه قرار دهید و تنظیمات را ذخیره کنید.
ابتدا در پنل سایت وردپرسی خود، به قسمت نمایش و سپس به قسمت سفارشی سازی مراجعه کنید.
قسمت سفارشی سازی قالب
گزینه هویت سایت را انتخاب کنید.
هویت سایت
به قسمت نمادک سایت بروید و فاوآیکون مورد نظر خود را بارگذاری کنید تا نمایش داده شود.
نمادک سایت
فاوآیکون مورد نظر خود را در هاست خود و در ریشه وبسایت قرار دهید. پوشه Public_html را باز کنید و به مسیر Wp-content بروید، در آن به مسیر Themes بروید. سپس کد زیر را در فایل header.php اضافه کنید.
<link rel=”icon” href=”http://yourwebsite.com/favicon.png” type=”image/x-icon” /><link rel=”shortcut icon” href=”http://yourwebsite.com/favicon.png” type=”image/x-icon”/> در نهایت گزینه save changes را بزنید تا تغییرات ذخیره شوند.
اندازه مناسب فاوآیکون
فاوآیکون‌ها اندازه 16*16 پیکسل و فرمت ico دارند. اگر می‌خواهید فاوآیکون اختصاصی ایجاد کنید می‌توانید از اندازه‌های زیر استفاده کنید.
16 پیکسل: مناسب استفاده در همه مرورگرها
24 پیکسل: سایت پین شده در اینترنت اکسپلورر 9
32 پیکسل: صفحه برگه جدید در اینترنت اکسپلورر، دکمه نوار وظیفه در ویندوز 7
57 پیکسل: صفحه اصلی استاندارد ios، نسل اول آیفون تا 3G
72 پیکسل: نماد صفحه اصلی iPad
96 پیکسل: فاویکون مورد استفاده پلتفرم Google TV
114 پیکسل: نماد صفحه اصلی iPhone 4
128 پیکسل: Chrome Web Store
195 پیکسل: Opera Speed Dial
بهتر است از اندازه 16* 16 پیکسل برای طراحی فاوآیکون خود استفاده کنید. همانطور که گفته شد این اندازه در همه مرورگرها قابل استفاده است.
طراحی فاوآیکون
طراحی فاوآیکون‌ها بهتر است که ساده باشد. با توجه به اینکه فاوآیکون‌ها اندازه کوچکی دارند، استفاده از جزئیات زیاد در طراحی، باعث می‌شود که شلوغ به نظر برسند و کاربر به آسانی متوجه مفهوم آن نمی‌شود.
فاوآیکون باید نشان دهنده هویت سایت شما باشد. بنابراین باید به گونه‌ای طراحی شوند که کاربران با دیدن آن متوجه شوند کسب و کار شما چیست و در چه حوزه‌ای فعالیت می‌کنید.
رنگی که برای طراحی فاوآیکون خود از آن استفاده می‌کنید، باید با توجه به کسب و کارتان انتخاب شود. همچنین باید با هر پس زمینه‌ای قابل دیدن باشد.
مناسب‌ترین فرمت برای فاوآیکون‌ها، .ico است.
تصاویری که در طراحی استفاده می‌کنید را با استفاده از ابزارهای مربوطه مانند فوتوشاپ، بهینه‌سازی کنید تا حجم کمتری داشته باشند.
سخن پایانی
در این مقاله با فاوآیکون و تاریخچه آن آشنا شدیم. دانستیم چرا باید از آن‌ها استفاده کنیم و یاد گرفتیم که چگونه و از چه ابزاری باید استفاده کنیم تا آن‌ها را طراحی کنیم و در نهایت در وبسایت خود قرار دهیم. اگر هنوز برای وبسایت خود فاوآیکون نساخته‌اید یا قصد دارید آن را تغییر دهید، می‌توانید طبق آموزش‌های این مقاله اقدام کنید و اعتبار برند خود را افزایش دهید. همچنین نکات گفته شده برای طراحی فاوآیکون را مد نظر قرار دهید تا طرح زیباتری خلق کنید. از اینکه تا پایان این مقاله با ما همراه بودید از شما سپاسگزاریم.
شروع کن، آموزش ببین. بعدش اجرا کن و شکست بخور. هیچ ایرادی ندارد. و این پروسه را اینقدر ادامه بده که برسی به قله. برای یک صعود هیجان انگیز، باید شروع کرد. قدم به قدم ادامه داد و طبق یک نقشه و با استفاده از تجربه سایرین، به مسیر خود ادامه داد. باعث افتخار ماست که در این مسیر در کنار شما باشیم. روزی که رسیدید به قله، این متن رو برای دوستان نزدیک‌تون ارسال کنید تا اونها هم شروع کنند. ارادتمند شما، تیم آساوردپرس
