حتما تا کنون تصاویر کوچک یا همان آیکن را در کنار آدرس بار یا محل نمایش عنوان سایت در مرورگر خود دیده اید.این تصاویر کوچک اصطلاحا favicon که مخفف Favorits Icon است نام دارد.هر سایت یا فروشگاهی میتواند فاو آیکن داشته باشد و ایجاد آن به ظاهر و درک بهتر بیننده کمک خواهد کرد.در این مقاله قصد داریم تا چگونگی استفاده از آن را برای شما کاملا توضیح دهیم.
در حال حاضر بیشتر افرادی که با اینترنت کار می کنند هر روز فاو آیکن های مختلفی را می بینند. مغز ما تصاویر را زودتر از متون تجزیه و تحلیل می کند.زمانی که شما وبسایتی را جست و جو می کنید با دیدن فاو آیکن ها بسیار راحت تر و سریع تر سایت مورد نظر خود را پیدا می کنید. اگر شما تب های زیادی را در مرورگر خود باز کرده باشید چگونه وبسایت مورد نظر خود را پیدا می کنید؟ در این موقعیت favicon به کمک شما می آیند و با دیدن آیکن وبسایتی که مد نظرتان است به راحتی آن را پیدا می کنید.
<link rel="icon" type="image/x-icon" href="images/favicon.ico" />
البته کدها و فرمت های دیگری نیز برای فراخوانی favicon وجود دارند که در زیر به آن ها اشاره میکنیم
<!-- Favicon Format -->
<link rel="icon" type="image/png" href="http://example.com/favicon.png" />
<link rel="icon" type="image/gif" href="http://example.com/favicon.gif" />
<!-- Opera Speed Dial Favicon -->
<link rel="icon" type="image/png" href="/speeddial-160px.png" />
<!-- Standard Favicon -->
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
<!-- For iPhone 4 Retina display: -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="/apple-touch-icon-114x114-precomposed.png">
<!-- For iPad: -->
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="/apple-touch-icon-72x72-precomposed.png">
<!-- For iPhone: -->
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-57x57-precomposed.png">
اگر سایت شما با سیستم مدیریت محتوای وردپرس ساخته شده است جهت انتخاب آیکن کافیست به قسمت سفارشی سازی در نوار ابزار بالای سایت رفته و در قسمت هویت سایت نمادک سایت یا فاو آیکن خود را بارگزاری نمایید