Favicon din logo: dimensiuni pentru browser și Google
Faviconul este simbolul mic al site-ului. Folosiți simbolul logoului, nu numele complet micșorat. Filele, Google și aplicațiile web instalate au cerințe diferite; testați destinația reală.
Pe această pagină

Ce fișier pentru fiecare utilizare?
| Destinație | Fișier | Dimensiune / verificare |
|---|---|---|
| Filă de browser | SVG / ICO / PNG | 16, 32 px |
| Google Search | PNG / ICO | >48×48 px; PNG96 |
| Ecran principal Apple | apple-touch-icon.png | 180×180 px |
| PWA instalată | PNG + site.webmanifest | 192×192, 512×512 px |
Pentru Google folosiți formate acceptate precum PNG sau ICO: SVG nu este în lista actuală. Pictograma pătrată trebuie să aibă cel puțin 8×8 px; Google recomandă peste 48×48, deci 96×96 este util, nu învechit. Adăugați linkul pe pagina principală, păstrați URL-ul stabil și permiteți accesul Googlebot la pagină și Googlebot-Image la imagine. Respectarea regulilor nu garantează afișarea.
Crearea și publicarea pictogramei
- Porniți de la un simbol recognoscibil; eliminați sloganul și detaliile fine.
- Verificați forma la 16 și 32 px pe fundal deschis și închis.
- Exportați din vector. Alegeți un folder favicon din pachetul LogoSaga și păstrați căile manifestului.
- Adăugați linkurile de mai jos numai pentru fișiere existente pe server. PNG96 este un export suplimentar pentru căutare.

<link rel="icon" href="/favicon.ico" sizes="16x16 32x32 48x48" />
<link rel="icon" href="/favicon.svg" type="image/svg+xml" />
<link rel="icon" href="/favicon-96x96.png" type="image/png" sizes="96x96" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" sizes="180x180" />
<link rel="manifest" href="/site.webmanifest" />
Un SVG poate folosi prefers-color-scheme, dar testați browserele și versiunile vizate. Un simbol lizibil pe ambele fundaluri este o soluție de rezervă robustă. Pictogramele Apple touch și ale manifestului sunt fișiere separate, nu variante automate ale SVG-ului din browser.
De ce nu apare?
Deschideți URL-ul direct: trebuie să returneze o imagine, nu eroare sau autentificare. Verificați linkurile paginii principale și accesul roboților. În browser reîncărcați sau ștergeți cache-ul local al pictogramelor. Pentru Google păstrați URL-ul și solicitați indexarea paginii principale în Search Console; poate dura zile sau săptămâni. Redenumirea repetată nu repară căutarea.
Ghiduri practice conexe: Testarea unui logo: 10 verificări înainte de lansare · Logo pentru Profilul companiei Google: dimensiuni și încărcare
Creează un logo cu un favicon asortatÎntrebări frecvente
Ce dimensiune ar trebui să aibă un favicon?
Pentru Google folosiți formate acceptate precum PNG sau ICO: SVG nu este în lista actuală. Pictograma pătrată trebuie să aibă cel puțin 8×8 px; Google recomandă peste 48×48, deci 96×96 este util, nu învechit. Adăugați linkul pe pagina principală, păstrați URL-ul stabil și permiteți accesul Googlebot la pagină și Googlebot-Image la imagine. Respectarea regulilor nu garantează afișarea.
Ce format ar trebui să aibă un favicon — SVG, PNG sau ICO?
Faviconul este simbolul mic al site-ului. Folosiți simbolul logoului, nu numele complet micșorat. Filele, Google și aplicațiile web instalate au cerințe diferite; testați destinația reală.
Se poate schimba un favicon în modul întunecat?
Un SVG poate folosi prefers-color-scheme, dar testați browserele și versiunile vizate. Un simbol lizibil pe ambele fundaluri este o soluție de rezervă robustă. Pictogramele Apple touch și ale manifestului sunt fișiere separate, nu variante automate ale SVG-ului din browser.
De ce nu apare sau nu se actualizează favicon-ul meu?
Deschideți URL-ul direct: trebuie să returneze o imagine, nu eroare sau autentificare. Verificați linkurile paginii principale și accesul roboților. În browser reîncărcați sau ștergeți cache-ul local al pictogramelor. Pentru Google păstrați URL-ul și solicitați indexarea paginii principale în Search Console; poate dura zile sau săptămâni. Redenumirea repetată nu repară căutarea.
Surse
- Define a favicon to show in search results — Google Search Central
- Web app manifest: icons — MDN Web Docs
- Configuring Web Applications — Apple Developer