Aggiungi il tuo logo e qualche dettaglio per ottenere tutte le icone, un'immagine di condivisione e i tag head in un unico .zip. Ottieni favicon.ico, le icone PNG e Apple, un web manifest, un'immagine di condivisione 1200 per 630 e i tag head da incollare. La tua immagine non lascia mai questo dispositivo. È gratis.
Come creare le icone e i tag, passo dopo passo
- Scegli un Logo o un'immagine, oppure trascinala sulla pagina. Un logo quadrato di 512 px o più funziona meglio.
- Scegli lo stile dell'immagine di condivisione: Logo su colore o Foto intera.
- Compila Nome del sito, Titolo della pagina, Descrizione, Indirizzo della pagina e nome utente di X.
- Scegli il Colore di sfondo e il Colore del tema, che colora la barra del browser del telefono.
- Controlla l'anteprima della card di condivisione e delle icone.
- Premi Scarica .zip e Copia HTML.
- Carica i file nella tua cartella dei file, poi incolla i tag nell'head delle tue pagine.
Cosa c'è nel pacchetto
favicon.ico contiene icone da 16, 32 e 48 pixel per ogni browser. favicon-16.png e favicon-32.png sono le versioni nitide usate dai browser moderni. apple-touch-icon.png è per le schermate iniziali di iPhone e iPad, e le icone Android più site.webmanifest vengono usate quando qualcuno installa il tuo sito. og-image.png è l'immagine mostrata quando il tuo link viene condiviso, e head.html ha ogni tag pronto da incollare.
Ottenere una buona immagine di condivisione
Le app di chat e i siti social mostrano l'immagine a circa 1200 × 630, poi la ritagliano o la riducono per card più piccole, quindi tieni breve il titolo e chiaro il logo. Lo stile Logo mette il tuo logo sul colore di sfondo accanto al titolo. Lo stile Foto riempie la card con la tua immagine e mette il titolo su un'ombra morbida, il che funziona meglio per foto larghe. Le immagini di condivisione richiedono un indirizzo https:// completo, quindi compila l'indirizzo della pagina.
Controllare che funzioni
Dopo aver caricato i file, apri la tua pagina e guarda il sorgente per vedere i tag. Molti siti mettono in cache le card di condivisione, quindi se compare ancora una vecchia immagine, aggiungi una versione all'indirizzo dell'immagine, come og-image.png?v=2, oppure chiedi allo strumento di anteprima dei link della piattaforma di recuperare di nuovo la pagina.
Consigli
- Usa un logo semplice che resti chiaro a 16 pixel.
- Scegli un colore di sfondo che corrisponda al tuo brand.
- Scrivi una breve descrizione che faccia venire voglia di cliccare.
- Controlla poi la tua pagina con la scansione pre-lancio.
Per un set di tag più completo, come robots e dettagli dell'articolo, vedi il generatore di meta tag, e per la sola icona, il generatore di favicon.
Chi lo usa
Chi lancia un sito personale, un portfolio, un negozio o la pagina di una piccola attività, e sviluppatori che vogliono ogni icona e file di condivisione creato in un colpo solo.
Domande
Dove metto i file?
Carica tutto il contenuto dello .zip nella cartella dei file del tuo sito, poi incolla i tag nell'head delle tue pagine.
Mi servono tutte le icone?
Usando il set completo l'icona si vede bene nei browser, nelle schermate iniziali dei telefoni e quando il tuo sito viene installato.
Il mio logo viene caricato?
No. Tutto viene creato nel tuo browser.