Jak dodać ikonę strony w HTML

Naucz się, jak dodać ikonę strony w HTML (Favicon).

Jak dodać ikonę strony w HTML

Ikona strony (favicon) to mały obrazek wyświetlany obok tytułu strony w karcie przeglądarki.

Możesz użyć dowolnego obrazu, który lubisz jako ikonę strony. Możesz również stworzyć swoją własną ikonę strony na stronie, takiej jak https://favicon.cc.

Wskazówka:Ikona strony to mały obraz, więc powinna być prostą i o wysokiej kontrastowości.

Ikona strony wyświetla się po lewej stronie tytułu strony w karcie przeglądarki, jak poniżej:

Przykłady ikon witryny

Aby dodać ikonę strony do swojej strony, zapisz obraz ikony strony w głównym katalogu serwera internetowego lub utwórz w głównym katalogu folder o nazwie "images" i zapisz obraz ikony strony w tym folderze. Nazwa obrazu ikony strony jest zwykle "favicon.ico".

Następnie, w pliku "index.html", w <title> Dodaj jeden za elementem <link> Elementy, takie jak poniżej:

<!DOCTYPE html>
<html>
<head>
  <title>My Page Title</title>
  <link rel="icon" type="image/x-icon" href="/images/favicon.ico">
</head>
<body>
<h1>To jest Nagłówek</h1>
<p>To jest akapit.</p>
</body>
</html>

Spróbuj sam

Teraz, zapisz plik "index.html" i załaduj go ponownie w przeglądarce. Twoja karta przeglądarki powinna teraz wyświetlać ikonę strony po lewej stronie tytułu strony.