فیلم آموزش قراردادن فیوآیکن (favicon) در صفحات وب

مشاوره رایگان

برای مشاوره در زمینه
سایت و سئو
با ما تماس بگیرید.

شبکه های اجتماعی ما
دوره سئو مقدماتی

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

4976 نفر
4 دقیقه
سینا صالحی فرد
بروزرسانی در: دی 30, 1396

فهرست مطالب

حتماً تا به حال تصویر کوچک کنار عنوان صفحات وب را هنگام بازدید سایت های مختلف دیده اید. این تصویر که به آن فیوآیکن (favicon) می گویند، با استفاده از کدهای html، به صفحات سایت اضافه می شود. اگر می خواهید بدانید که چگونه به صفحه ی وب خود، فیوآیکن را اضافه کنید تا در تمامی مرورگرها قابل مشاهده باشد، فیلم آموزشی زیر را ببینید:

[hdplay id=21]

برای دانلود فیلم آموزشی و اسنیپت های آموزش مربوطه از لینک های زیر استفاده کنید :

[free_vip]

[video_download cat=’html’ url=’http://dl.onliner.co/html-videos/favicon.mp4′]دانلود فیلم آموزش قراردادن فیوآیکن (favicon) در صفحات وب[/video_download]
[/free_vip]

دسترسی سریع :

متن فیلم آموزشی قراردادن فیوآیکن (favicon) در صفحات وب

Favicon

تصویر کوچکی است که کنار عنوان صفحه (title) در مرورگر نمایش داده می شود.

favicon1

برای قرار دادن favivon از تگ link که به صورت self close نوشته می شود استفاده می کنیم. این تگ در بین تگ head قرار می گیرد.

[html]
<link />
[/html]

 

حال باید با صفت rel=”shortcut icon” نوع چیزی که داریم را مشخص کنیم و با صفت “http://adress.com/ax.png”=href آدرس تصویر را مشخص نماییم.

نکته : فیو آیکون می تواند فرمت های عکس gif,png , jpg و…. بگیرد.

مثال :

[html]

<html>
<head>
<title>welcome</title>
<link rel="shortcut icon"  href="https://onliner.co/favicon-onliner.png"/>
<head>
<body>
</body>
</html>

[/html]

نتیجه :

favicon2

نکته : اگر میخواهید در ورژن های قدیمی مرورگرها فیوآیکن شما نمایش داده شود، از تصویر با پسوند ico استفاده کنید. بهتر است اندازه فیو آیکن شما 16*16 باشد.

دسترسی سریع :

به این صفحه رتبه دهید
2 دیدگاه
انتشار: اردیبهشت 20, 1393
طراحی سایت خود را به ما بسپارید!
همین حالا برای مشاوره رایگان اقدام کنید.
طراحی سایت خود را به ما بسپارید!
همین حالا برای مشاوره رایگان اقدام کنید.
سینا صالحی فرد
  • سلام ممنون از اموزش های عالیتون
    من از شناسه placeholder استفاده کردم اما جز دستورات پیش فرض نیست تو محیط دریم ویور سی اس 5 کار میکنم خروجی هم عمل نکرد
    اما با اون اسکریپت جواب گرفتم ولی تو اینترنت اکسپلورر اسکریپت جواب نداد IE9

    • Avatar photo گروه طراحی سایت :

      سلام
      اسکریپت که همه جا ساپورت میشه مگر اینکه به پیام ها و یا تنظیمات مرورگرتون توجه نکرده باشید.
      و اما placeholder مربوط به html5 هست که باید چک بشه که مرورگرتون ازش پشتیبانی می کنه یا خیر.

آیا نیازمند راهنمایی هستید؟
همین حالا برای مشاوره رایگان اقدام کنید
با پر کردن فرم، یک قدم به رشد آنلاین نزدیک‌تر شوید!
فرم درخواست مشاوره

برای راحتی شما عزیزان می‌توانید اطلاعات خود را در کادر زیر وارد کنید تا کارشناسان ما با شما تماس بگیرند

مشاوره رایگان
پیمایش به بالا