HTML Sık Kullanılan Simgesi
Favicon, tarayıcı sekmesinde sayfa başlığının yanında görüntülenen küçük bir resimdir.
HTML'de Favicon Nasıl Eklenir
Beğendiğiniz herhangi bir resmi favicon olarak kullanabilirsiniz. Ayrıca https://favicon.cc gibi sitelerde kendi favicon'unuzu oluşturabilirsiniz .
İpucu: Favicon küçük bir resimdir, bu nedenle yüksek kontrastlı basit bir resim olmalıdır.
Tarayıcı sekmesinde sayfa başlığının solunda aşağıdaki gibi bir favicon resmi görüntülenir:

Web sitenize favicon eklemek için site ikonu imajınızı web sunucunuzun kök dizinine kaydedin ya da kök dizinde images adlı bir klasör oluşturun ve favicon imajınızı bu klasöre kaydedin. Bir site simgesi görüntüsünün ortak adı "favicon.ico"dur.
Ardından, <link>
"index.html" dosyanıza <title>
öğeden sonra şöyle bir öğe ekleyin:
Örnek
<!DOCTYPE html>
<html>
<head>
<title>My Page
Title</title>
<link rel="icon" type="image/x-icon" href="/images/favicon.ico">
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
Şimdi "index.html" dosyasını kaydedin ve tarayıcınıza yeniden yükleyin. Tarayıcı sekmeniz artık favicon resminizi sayfa başlığının solunda göstermelidir.
Favicon Dosya Biçimi Desteği
Aşağıdaki tablo, bir favicon görüntüsü için dosya biçimi desteğini gösterir:
Browser | ICO | PNG | GIF | JPEG | SVG |
---|---|---|---|---|---|
Edge | Yes | Yes | Yes | Yes | Yes |
Chrome | Yes | Yes | Yes | Yes | Yes |
Firefox | Yes | Yes | Yes | Yes | Yes |
Opera | Yes | Yes | Yes | Yes | Yes |
Safari | Yes | Yes | Yes | Yes | Yes |
Bölüm özeti
<link>
Bir favicon eklemek için HTML öğesini kullanın
HTML Bağlantı Etiketi
Tag | Description |
---|---|
<link> | Defines the relationship between a document and an external resource |
Mevcut tüm HTML etiketlerinin tam listesi için HTML Etiket Referansımızı ziyaret edin .