HTML — فاویکون (Favicon)

آخرین بروزرسانی: 1404/07/05

قبلی: عنصر picture بعدی: عنوان صفحه (Page Title)

فاویکون (Favicon) در HTML

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

افزودن فاویکون به سایت

می توانید هر تصویری را به عنوان فاویکون استفاده کنید. کافی است تصویر خود را در پوشه اصلی سایت یا پوشه images ذخیره کنید. رایج ترین نام فایل favicon.ico است. سپس باید از تگ <link> بعد از تگ <title> استفاده کنید.

<!DOCTYPE html>
<html>
<head>
  <title>My Page Title</title>
  <link rel="icon" type="image/x-icon" href="/images/favicon.ico">
</head>
<body>
  <h1>این یک عنوان است</h1>
  <p>این یک پاراگراف است.</p>
</body>
</html>

نکته: فاویکون باید تصویری ساده و با کنتراست بالا باشد تا در اندازه کوچک واضح دیده شود.

فرمت های پشتیبانی شده فاویکون

مرورگرها از فرمت های مختلفی برای فاویکون پشتیبانی می کنند. جدول زیر این پشتیبانی را نشان می دهد:

ICO
PNG
GIF
JPEG
SVG

خلاصه فصل

برای افزودن فاویکون از تگ <link> استفاده کنید.
فرمت های رایج شامل ICO، PNG، GIF، JPEG و SVG هستند.