Glavni problem u vezi sa dodavanjem favikona u HTML je taj što je potrebno dodatno kodiranje. Favikone su male ikone koje se pojavljuju na kartici preglednika ili adresnoj traci web stranice. Da biste dodali favicon na HTML stranicu, morate uključiti element linka s atributom rel postavljenim na “ikona prečice” i href atributom postavljenim na lokaciju favicon datoteke. Ovo može biti dugotrajno i teško za one koji nisu upoznati sa HTML kodiranjem. Osim toga, neki pretraživači možda neće prepoznati određene tipove favikona, tako da je važno osigurati da je vaš favicon kompatibilan sa svim pretraživačima prije nego što ga dodate na svoju stranicu.
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
1. Ova linija koda kreira vezu do eksterne datoteke, koja se koristi za prikaz male ikone pored naslova stranice na kartici pretraživača.
2. Atribut “rel” specificira odnos između trenutnog dokumenta i povezanog dokumenta, koji je u ovom slučaju ikona prečice.
3. Atribut “href” specificira lokaciju povezanog dokumenta, što je u ovom slučaju “favicon.ico”.
4. Atribut “type” specificira tip medija povezanog dokumenta, koji je u ovom slučaju slika u formatu x-ikone.
Šta je favicon
Favicon (skraćenica od “ikona favorita”) je mala slika veličine 16×16 koja je povezana s određenom web-stranicom ili web stranicom. Prikazuje se u adresnoj traci pretraživača, pored naslova stranice i na listi obeleživača. Favikoni se najčešće koriste kako bi korisnicima omogućili jednostavan način za identifikaciju i navigaciju između različitih web stranica.
Kako da dodam favicon u HTML
Favicon je mala ikona koja se pojavljuje na kartici preglednika web stranice. Koristi se za identifikaciju vaše web stranice i učini je prepoznatljivijom posjetiteljima. Da biste dodali favicon u HTML, morat ćete uključiti sljedeći kod u odjeljak vašeg HTML dokumenta:
Zamijenite “path/to/favicon.ico” putanjom do mjesta gdje ste pohranili svoju favicon datoteku. Datoteka treba da bude u .ico formatu i veličine 16×16 piksela ili 32×32 piksela.
Kako dodati SVG favicon
1. Kreirajte SVG fajl: Prvi korak je da kreirate SVG fajl koji želite da koristite kao favicon. Možete ga kreirati sami pomoću uređivača vektorske grafike kao što je Adobe Illustrator ili Inkscape, ili ga možete preuzeti s weba.
2. Konvertujte SVG u ICO format: Kada imate svoju SVG datoteku, potrebno je da je konvertujete u ICO format. To se može učiniti pomoću besplatnog online pretvarača kao što je Convertio ili CloudConvert.
3. Dodajte favicon link tag u HTML: Nakon što imate svoj ICO fajl, dodajte sljedeći kod u odjeljak vašeg HTML dokumenta:
Ovo će reći pretraživačima da je ovo favicon za vašu web stranicu i da bi trebali da je prikažu kada neko posjeti vašu web lokaciju.
4. Testirajte i riješite probleme: Konačno, isprobajte svoj novi favicon tako što ćete posjetiti svoju web stranicu u različitim pretraživačima i uređajima i uvjerite se da svuda izgleda dobro! Ako postoje bilo kakvi problemi, pokušajte ih riješiti pomoću alata kao što su Google Chrome DevTools ili Firefox Web Developer Tools.
