Összefoglaló
A favicon-kinyerő letölt bármely weboldalt, és felsorolja az összes ikont, amelyet deklarál: a HTML-ben lévő rel="icon" és Apple-érintőikon hivatkozásokat, a webalkalmazás-manifeszt ikonjait, és az alapértelmezett /favicon.ico fájlt. Minden ikonhoz tartozik a deklarált méret, a formátum, a forrás és egy letöltőgomb, a legnagyobbtól a legkisebbig rendezve, továbbá az újrafelhasználható HTML-címkék, valamint előnézet egy böngészőfülön és egy keresési találatban. Használd saját webhelyed átnézésére, egy hiányzó favicon hibájának felderítésére vagy márkaikonok gyűjtésére egy címtárhoz.
Szeretnél többet megtudni? Kérdezd meg
A favicon-kinyerő megmutatja, mit tesz közzé valójában egy weboldal ikonként, ami gyakran nem az, amire a tulajdonosai gondolnak. Egy újratervezés után régi favicon.ico marad a gyökérben, egy sablon csak 16 pixeles ikont deklarál, a manifeszt pedig törölt fájlokra mutat. Ezek a részletek azért számítanak, mert a favicon utazik: a Google megjelenítheti a webhelyneved mellett a találatokban, feltéve, hogy négyzet alakú, legalább 8x8 pixeles, ideálisan 48x48-nál nagyobb, és a keresőrobot be tudja járni (Google Search Central, faviconok a keresési találatokban).
Hogyan működik a favicon-kinyerő?
Illeszd be egy oldal címét, teljesítsd a botellenőrzést, és indítsd a kinyerést. Az eszköz úgy tölti le az oldalt, ahogy egy keresőrobot, követi az átirányításokat, és három forrást olvas.
| Forrás | Amit az eszköz olvas | Címke az eredményekben |
|---|---|---|
| HTML-fej | Minden <link> elem, amelynek rel értéke tartalmazza az „icon” szót: icon, shortcut icon, apple-touch-icon és változataik, méretekkel és típussal | html |
| Webalkalmazás-manifeszt | A rel="manifest" által hivatkozott fájl, és annak icons listájának minden eleme | manifest |
| Alapértelmezett hely | A domain gyökerében lévő /favicon.ico, csak akkor marad meg, ha a szerver képpel válaszol | fallback |
A relatív útvonalakat teljes URL-ekké alakítja, az ismétlődéseket eltávolítja, az adatURI-ként beágyazott ikonokat pedig kihagyja. Az eredmények ezután a következőket mutatják:
- Összegzés a domainnel, a talált faviconok számával, egy „Manifest detected” jelvénnyel, ha van manifeszt, és a legnagyobb ikonnal.
- Az ikonlista, a deklarált méret szerint a legnagyobbtól a legkisebbig, mindegyik a típusával, a rel értékével, a forráscímkével és egy letöltőgombbal.
- Minden ikon HTML-kódja hivatkozáscímkeként, készen a másolásra.
- Előnézet a kis ikonról egy böngészőfülön, és egy keresési típusú találat mellett.
Az ingyenes verzió napi három kinyerést engedélyez.
Hogyan auditálod a saját faviconodat a kinyerővel?
Először futtasd a kinyerőt a főoldaladon, mert a Google minden hosztnév főoldaláról olvassa a faviconot, majd sablonként egy belső oldalon. Utána ellenőrizd a négy pontot.
- Van-e 48 pixeles vagy nagyobb ikon? Nézd a lista tetejét. Ha a legnagyobb deklarált méret 16x16 vagy 32x32, a Google és a nagy felbontású kijelzők felnagyítják.
- Valósak-e a méretek? Az eszköz a címkében vagy a manifesztben deklarált méretet mutatja, nem a fájl méretét. Töltsd le a legnagyobb ikont, és ellenőrizd a méreteit. Egy 192x192-t állító címke 32 pixeles fájlon gyakori maradvány.
- Betöltődik-e minden fájl? Kattints minden letöltési linkre. Egy 404-es manifeszt-ikon megtöri az Android kezdőképernyő-ikonját; a fő ikon 404-es hibája üres négyzetet hagy.
- Teljes-e a készlet? Legalább egy PNG vagy ICO ikon kell a böngészőknek, egy 180x180-as Apple-érintőikon, és a manifesztben egy 192-es és 512-es pár; a web.dev megjegyzi, hogy a Chromium mindkét manifeszt-méretet igényli (web.dev, webalkalmazás-manifeszt hozzáadása).
Ha valami hiányzik, a favicon-generátor egyetlen négyzet alakú képből elkészíti a hat szabványos méretet és a címkéket.
Miért mutat a Google rossz faviconot, vagy egyet sem?
A legtöbb eset néhány ok valamelyikére vezethető vissza. A kinyerő segít megerősíteni, melyik érvényes.
| Amit látsz | Valószínű ok | Mit ellenőrizz a kinyerésben |
|---|---|---|
| Általános földgömb a saját ikonod helyett | Nincs ikon deklarálva a főoldalon, vagy a fájl nem indexelhető | Nulla favicon, vagy csak tartalék; ezután ellenőrizd a fájlt a robots.txt szerint |
| Egy régi logó | Egy korábbi ikon még deklarálva van, vagy még a /favicon.ico-n van | Több, eltérő kialakítású ikon a listában |
| Elmosódott ikon | Csak egy kis ikon érhető el | A legnagyobb deklarált méret 48x48 alatt van |
| Nyújtott vagy vágott ikon | Nem négyzet alakú fájl | Töltsd le a legnagyobb fájlt, és ellenőrizd a szélességét és a magasságát |
| Más ikon egy aldomainen | Minden hosztnévhez saját favicon tartozik a Google-ben | Futtasd a kinyerőt minden aldomain főoldalán |
A Google két szabályt érdemes megjegyezni: a favicon URL-jének stabilnak kell lennie, és a Googlebot-Image-nek engedélyezve kell lennie a fájl bejárásához. A robots.txt ellenőrző megmutatja, ha egy szabály blokkolja. Javítás után a Google-nek újra be kell járnia a főoldalt, ami néhány naptól néhány hétig tarthat.
A lista az SVG-ikonokat is mutatja, amelyeket image/svg+xml típussal deklarálnak. A modern böngészőkben tisztán skálázódnak, de a Google-keresés a támogatott faviconformátumok közé a BMP-t, a GIF-et, az ICO-t, a PNG-t, a JPEG-et, a PPM-et és a TIFF-et sorolja, ezért tarts meg egy PNG vagy ICO változatot egy SVG-ikon mellett.
Mire másra használhatod a favicon-kinyerőt?
A saját webhelyeden túl a kinyerés időt spórol, valahányszor tiszta márkaikonokra van szükséged a megfelelő méretben.
- Versenytárs-áttekintés. Nézd meg, hogyan márkázzák a versenytársak a füleiket és a kezdőképernyő-ikonjaikat, és közzétesznek-e teljes manifesztet.
- Címtárak és összehasonlító oldalak. Gyűjtsd össze minden listázott cég ikonját a legnagyobb elérhető méretben, képernyőkép helyett.
- Linkelőnézetek és műszerfalak. Jeleníts meg felismerhető ikonokat a linkek mellett egy belső eszközben vagy jelentésben.
- Migrációs ellenőrzések. Egy webhely áthelyezése előtt és után ellenőrizd, hogy ugyanazok az ikonok ugyanazokon az URL-eken vannak-e deklarálva.
Ha több ikon van deklarálva, a böngészők a type és a sizes attribútumok alapján választanak, és hiba esetén a következőre lépnek (MDN, hivatkozástípusok). A kinyerő sorrendje a deklarált méretet követi, ami nem mindig az, amelyet a böngésző használ, ezért teszteld a számodra fontos böngészőkben.
Újrahasználhatod a kinyert faviconokat?
Auditokhoz, összehasonlításokhoz és egy márkára való hivatkozáshoz igen. A saját ikonodként nem. A favicon általában logó, a védjegy pedig bármilyen szó, kifejezés, szimbólum vagy minta lehet, amely árukat vagy szolgáltatásokat azonosít (USPTO, az Egyesült Államok szabadalmi és védjegyhivatala: mi a védjegy). Egy cég ikonjának megmutatása a neve mellett egy címtárban azonosítja azt a céget; saját webhelyed képviseletére használva félrevezeti a látogatókat. Kétség esetén kérdezd meg a márka tulajdonosát.
Melyek a kinyerés korlátai?
- A méretek deklaráltak, nem mértek. Az eszköz azt mutatja, amit a címke vagy a manifeszt állít.
- Nincs JavaScript-renderelés. A betöltés után szkript által beillesztett ikonok nem láthatók.
- A tartalékot 16x16-osnak feltételezi. Egy /favicon.ico fájl több méretet is tartalmazhat; töltsd le, hogy lásd őket.
- Egyszerre egy oldal. Csak néhány sablonon deklarált ikonok jelennek meg, ha ezeket az oldalakat kinyered.
A favicon része annak, ahogyan a márkád megjelenik a Google-találatokban és az AI-asszisztensek forráslistáiban. Hogy lásd, megnevezik-e a márkádat egyáltalán ezekben a válaszokban, az AI-említéskövetés havonta ellenőrzi, a GEO és SEO műszerfal pedig a Google-kattintásaidat követi az AI-s láthatóságoddal együtt.
Ellenőrizd, mit tesz közzé valójában a webhelyed, mielőtt újratervezed vagy hibát keresel. Kinyerd az ikonjaidat fent, majd a Sorank-csomagok között találod, hogyan növelheted autopilot módban annak a márkának a láthatóságát, amelyhez ezek az ikonok tartoznak.
