Faviconin luominen
Vaihda yksinkertainen kuva verkkosivuston taulukon kuvaksi (favicon) ja verkkosivun kuvakokoon. Tarkista, että muotoilu pysyy tunnistettavissa pieninä kokoina, lataa tiedostot ja noudata sisällytettyä asennusnäytteitä.
Ennen kuin aloitat
- Sisäänkäynti
- Yksi JPG, PNG tai staattinen WebP kuva.
- Lähtö
- ZIP, jossa on ICO, PNG ikoneet, manifesti ja HTML esimerkki.
Lataus työkalu...
Kuinka käyttää tätä työkalua
- Valitse JPG, PNG tai staattinen WebP kuva.
- Kasvaa neliöön tai lisää padding ja tarkista ikonin ennusteet.
- Lataa ZIP ja mukauta esimerkit reittejä verkkosivustosi.
Ymmärrä tulos
Verkkosivun sivuston taulukon ikoni (favicon) näkyy usein hyvin pienessä koossa. Selvä symboli tai kirjain toimii yleensä paremmin kuin yksityiskohtainen taideteos tai pieni teksti. Tuotetut tiedostot on edelleen ladattava ja viitattava verkkosivustollesi.
Miksi verkkosivun taulukon ikoni (favicon) näyttää huimaalta tai liian pieneltä?
Laaja sanamuoto tai yksityiskohtainen kuva voi tulla lukemattomaksi pienessä selaimen taulukossa. Aloita yksinkertaisella neliön symboli ja tarkista todelliset 16-pikselin ja 32-pikselin ennusteet. Padding säilyttää täyden lähteen, mutta voi jättää laajan logo hyvin pieneksi; neliökerrointi täyttää ikonin ja voi leikata sen reunat. Tarkista molemmat vaihtoehdot ennen tuloksen asentamista.
Minkä verkkosivusto-tietokannan (favicon) tiedostoja minun pitäisi ladata verkkosivuilleni?
ZIP sisältää favicon.ico, PNG icons, apple-touch-icon.png, site.webmanifest and install.html.txt Esimerkkinä linkit. Poista arkisto ensin; ZIP: n lataaminen yksin ei asenna kuvaketta. Esimerkkejä reitteistä oletetaan, että tiedostot ovat verkkosivuston juurella. Säädä nämä reitit toiseen kaapeliin tai käytä alustan sivun ikonin asetusta ja tarkista sitten julkaistu sivu ja sen kaappi.
Kokeile näytteitä
Kokeile alkuperäistä näytettä tarkastamaan tuettu työnkulku. Menestyksekäs näyte ei ole takuu jokaiselle panokselle.
Alkuperäinen kuvamalli ↓Jos tulos ei ole sitä, mitä odotat
Sivusto näyttää edelleen vanhan ikonin.
Tiedostojen luominen ei asenna niitä. Tarkista ikonin URL-osoitteet ja sivun merkinnät, poista sitten sivuston kaavio ja testaa tuoretta selaimen istuntoa. Selaimen ja hakutuloksen kuvakkeet voivat päivittää eri aikoina.
Seuraava hyödyllinen työkalu: SVG–PNG-muunnin →Tärkeät rajat
- Kuvan sisäänkäynti vain; muuntaa SVG ensin PNG:lle.
- Työkalu ei muutu verkkosivustosi konfiguraatiota.
- Tarkista oma verkkosivustosi asennuksen jälkeen, koska caching ja alustan käyttäytyminen voivat vaihdella.
- Maksimi 10 MB 12 miljoonaa pikseliä. Tulokset sisältävät ICO: n, PNG-kuvan, webmanifestin ja esimerkin HTML: n ZIP: ssä.
Usein kysyttyjä kysymyksiä
Onko tämä asentaa sivuston taulukon ikonin (favicon) sivustollani?
Ei ei Se valmistaa tiedostoja ja esimerkki. Lataa tiedostot ja päivitä reitit tai verkkosivustosi asetukset.
Onko paketti tehnyt verkkosivustollani PWA?
Ei ei Ikonitiedostot ja perus webmanifest ovat vain osa web-sovelluksen asennusta.
Miksi logo on vaikea lukea 16 pikseliä?
Täydelliset yksityiskohdat voivat kadota tällaisessa koossa. Kokeile yksinkertaisempaa symbolia, vahvempaa muotoa tai enemmän tilaa merkin ympärillä.
Liittyvät oppaat
Kysymyksiä vai korjauksia? mrkcal@mrkcal.com