Favicon
Favicon (ang. favorites icon, ikona ulubionych) – ikona, która pojawia się przed adresem w polu adresowym przeglądarki internetowej lub na karcie z otwartą stroną www. Ikona ta ma postać obrazka, według pierwotnych propozycji bitmapy ICO lub PNG w wymiarach 16×16 lub 32×32 pikseli[1], w późniejszym czasie przy braku zgodnej standaryzacji autorzy części przeglądarek samorzutnie wprowadzili obsługę innych wymiarów (np. bitmap 180×180 dla iOS[2]) i formatów (np. SVG[3]).
Przeglądarki wyświetlają ikonę favicon:
- zdefiniowaną w kodzie HTML znacznikiem „link”, np.
<link rel="icon" type="image/png" href="icon.png">
lub
<link rel="shortcut icon" href="icon.ico">
- gdzie „icon.png” oznacza względny lub absolutny adres URL pliku favicon;
lub z użyciem data URI(ang.) w postaci reprezentacji Base64:
<link href="data:image/x-icon;base64,AAABAAEAE.....qqAABVVQAA" rel="icon" type="image/x-icon">
- umieszczoną w głównym katalogu, w którym znajduje się strona internetowa, bez potrzeby definiowania adresu favicon w kodzie strony, np.
https://pl.wikipedia.org/favicon.ico
Obie metody (czyli definiowanie adresu favicon w kodzie oraz umieszczanie pliku favicon.ico w katalogu głównym) mogą być stosowane równocześnie.
Niektóre przeglądarki wyświetlają ikonę na pasku adresu tylko wtedy, gdy strona została dodana do folderu Ulubione/Łącza/Zakładki (np. Internet Explorer 6). Inne jak Safari nie wyświetlają obrazków favicon wcale.
Favicony można także animować, zmieniając je dynamicznie poprzez JavaScript[4], niektóre przeglądarki obsługują także format animacji GIF[5].
Zobacz też[edytuj | edytuj kod]
Przypisy[edytuj | edytuj kod]
- ↑ How to Add a Favicon to your Site - QA @ W3C, www.w3.org [dostęp 2019-06-23] (ang.).
- ↑ Configuring Web Applications, developer.apple.com [dostęp 2019-06-23].
- ↑ Can I use... Support tables for HTML5, CSS3, etc, caniuse.com [dostęp 2019-06-23].
- ↑ Vanilla JavaScript library for loading animation in favicon (favicon loader). GitHub.
- ↑ Favicon - MDN Web Docs Glossary: Definitions of Web-related terms. developer.mozilla.org. [dostęp 2021-09-27]. (ang.).