In questo articolo scopriremo i vantaggi dell’utilizzo di una favicon in un sito WordPress. Ma vi spieghiamo anche come crearne una e vi illustriamo tre semplici opzioni per aggiungerla al vostro sito.<\/p>\n
Infine, concludiamo l’articolo con alcuni consigli e best practice per WordPress. Cominciamo!<\/p>\n
I Vantaggi di una Favicon in WordPress<\/h2>\n
Se avete mai avuto troppe schede aperte contemporaneamente (colpevole!), potete probabilmente apprezzare l’utilit\u00e0 di una favicon. Una favicon permette agli utenti di identificare rapidamente il vostro sito web quando hanno pi\u00f9 schede aperte nel loro browser:<\/p>\n A seconda del numero di schede aperte, il titolo del sito potrebbe non essere sempre visibile. Pertanto, l’aggiunta di una favicon pu\u00f2 aiutare a\u00a0migliorare l’UX per i tuoi visitatori<\/a>.<\/p>\n Oltre a migliorare la riconoscibilit\u00e0 del brand, l’utilizzo di una favicon in WordPress pu\u00f2 anche far apparire il vostro sito pi\u00f9 professionale e credibile. A sua volta, questo pu\u00f2 contribuire ad aumentare la fiducia dei clienti.<\/p>\n Inoltre, se qualcuno salva il vostro sito web nella schermata iniziale del proprio dispositivo mobile, la vostra favicon apparir\u00e0 come icona. L’utilizzo del logo del vostro brand o di immagini simili pu\u00f2 contribuire a rendere il vostro sito pi\u00f9 riconoscibile e, nel complesso, a creare un’estetica coerente.<\/p>\n\n Se avete gi\u00e0 una favicon siete pronti per ad utilizzarla (la maggior parte delle aziende utilizza il proprio logo o una sua variante) e potete saltare direttamente alla sezione successiva. Se non ce l’avete ancora, ecco come creare la vostra immagine della favicon.<\/p>\n In passato, per la vostra favicon dovevate utilizzare un file ICO specifico. Oggi, invece, tutti i browser moderni supportano favicon in formato ICO, PNG e GIF. Anche il JPEG \u00e8 ampiamente supportato (si legga al riguardo: JPG vs JPEG<\/a>), ma non in tutte le versioni di Internet Explorer, il che lo rende meno ideale per l’impiego come favicon.<\/p>\n Se avete familiarit\u00e0 con Photoshop, potete utilizzarlo per creare manualmente una favicon. Tuttavia, spesso \u00e8 pi\u00f9 facile utilizzare uno strumento di base basato su cloud per creare l’icona della favicon a partire da un’immagine esistente.<\/p>\n RealFaviconGenerator<\/a> (la versione cloud-based del plugin di cui parleremo pi\u00f9 avanti) \u00e8 un’ottima opzione perch\u00e9:<\/p>\n Altri generatori di favicon utili sono:<\/p>\n Per utilizzare RealFaviconGenerator, iniziate col caricare l’immagine che volete utilizzare cliccando su Select your Favicon image<\/strong>:<\/p>\n Nella schermata successiva, potete configurare i dettagli specifici del proprio set di favicon (se lo desiderate). Quando avete finito, scorrete fino in fondo e fate clic su Generate your Favicons and HTML code<\/strong>:<\/p>\n Nella pagina successiva, fate clic su Favicon package<\/strong> per scaricare le vostre favicon:<\/p>\n Ricordatevi di lasciare aperta questa pagina se volete aggiungere manualmente la favicon al vostro sito.<\/p>\n Ci sono alcuni suggerimenti per il design e la formattazione che vale la pena di citare e valutare prima di creare una favicon. La cosa pi\u00f9 importante \u00e8 che la dimensione consigliata per le favicon \u00e8 di 512\u00d7512 pixel.<\/p>\n Sebbene la vostra favicon per WordPress sar\u00e0 un quadrato perfetto, potete anche utilizzare un’immagine rettangolare e ritagliarla prima o dopo\u00a0averla caricata su WordPress<\/a>. WordPress \u00e8 dotato di una funzionalit\u00e0 di ritaglio integrata<\/a>\u00a0per le icone del sito, se le aggiungete tramite il Customizer (cosa che vi spiegheremo a breve).<\/p>\n Inoltre, \u00e8 importante notare che la vostra favicon sar\u00e0 visualizzata come un quadrato 16\u00d716 px. Pertanto, dovreste scegliere un’immagine che abbia un bell’aspetto una volta che sia stata ridotta a quelle dimensioni. Anche se verr\u00e0 visualizzata a quelle dimensioni, dovrebbe comunque avere un’altezza e una larghezza di almeno 512 px.<\/p>\n Infine, \u00e8 un’idea intelligente rivedere alcune delle linee guida di Google<\/a> per la creazione e l’utilizzo di favicon. Questo aiuter\u00e0 a garantire che la vostra icona venga visualizzata in modo ottimale nei motori di ricerca<\/a> e nelle schede del browser.<\/p>\n Una volta che avete la vostra favicon, siete pronti ad aggiungerla al vostro sito WordPress. Diamo un’occhiata a tre possibili metodi.<\/p>\n A partire da WordPress 4.3, tutti i siti WordPress includono una funzione per l’icona del sito che rende facile caricare e ritagliare un’immagine da utilizzare come favicon. Per la maggior parte degli utenti, questo \u00e8 il metodo pi\u00f9 semplice e veloce per aggiungere una favicon a WordPress.<\/p>\n Tutto ci\u00f2 di cui avrete bisogno \u00e8 un’immagine di almeno 512\u00d7512 pixel. WordPress si occuper\u00e0 del resto. Per iniziare, andare su Aspetto \u2192 Personalizza<\/strong> nella bacheca di WordPress:<\/p>\n Da l\u00ec, navigate fino alla scheda Identit\u00e0 del sito<\/strong>:<\/p>\n Quindi, cercate in basso la sezione Icona del sito<\/strong>, e fate clic sul pulsante Seleziona l’icona del sito<\/strong>:<\/p>\n Si aprir\u00e0 la normale interfaccia della\u00a0Media Library di WordPress<\/a>. Potete scegliere un’immagine esistente nella vostra Libreria Media o caricarne una nuova. Se avete utilizzato RealFaviconGenerator per creare la vostra favicon, assicuratevi che il pacchetto che avete scaricato sia decompresso.<\/p>\n Una volta che avete trovato l’immagine che vi piace, cliccateci sopra e scegliete Seleziona<\/strong> nell’angolo in basso a destra:<\/p>\n Se la vostra immagine non \u00e8 gi\u00e0 un quadrato perfetto (ad esempio 512\u00d7512 px), nella schermata successiva WordPress vi dar\u00e0 la possibilit\u00e0 di ritagliarla.<\/p>\n Utilizzate la casella per evidenziare la porzione di immagine che volete utilizzare per la vostra icona. Potete vedere un’anteprima di come apparir\u00e0 la vostra immagine ritagliata sul lato destro dell’interfaccia.<\/p>\n Una volta che siete soddisfatti di come appaiono le cose, fate clic su Ritaglia Immagine<\/strong> per concludere l’operazione:<\/p>\n Questo \u00e8 tutto! Tutto quello che dovete fare \u00e8 selezionare Salva e Pubblica<\/strong> per mettere in linea la vostra favicon. Se mai vorrete cambiare la vostra favicon in futuro, potete tornare a questa interfaccia.<\/p>\n Se preferite un plugin alla funzionalit\u00e0 nativa delle icone del sito WordPress, potete utilizzare un popolare plugin gratuito chiamato\u00a0Favicon di RealFaviconGenerator<\/a> (lo strumento basato sul cloud di cui abbiamo parlato prima).<\/p>\n Questo plugin \u00e8 semplice da usare quanto il Customizer nativo di WordPress. Tuttavia, offre opzioni di compatibilit\u00e0 aggiuntive per vari dispositivi e icone delle app. Per utilizzarlo, installate e attivate il plugin gratuito<\/a>\u00a0dalla vostra\u00a0bacheca di WordPress<\/a>:<\/p>\n Una volta attivato il plugin, andate su Aspetto \u2192 Favicon<\/strong> per creare il vostro set di favicon. Tutto quello che dovete fare \u00e8 selezionare o caricare un’immagine che sia almeno 70\u00d770 px (idealmente 260\u00d7260 px):<\/p>\n Dopo aver selezionato la vostra immagine, fate clice su Generate favicon<\/strong>. Quando fate clic su quel pulsante, il plugin vi fa uscire dal vostro sito WordPress e vi porta al sito RealFaviconGenerator.<\/p>\n Nella parte inferiore del sito, scorrete verso il basso per selezionare Generate your Favicons and HTML code<\/strong> (vedi la sezione precedente). Durante l’operazione, Real Favicon Generator vi rimander\u00e0 alla vostra bacheca di WordPress:<\/p>\n Dopo di che, la vostra favicon sar\u00e0 configurata e pronta ad andare in linea. Potete visualizzare le anteprime su diversi dispositivi nell’interfaccia del plugin.<\/p>\n Se preferite fare le cose manualmente, potete aggiungere una favicon al vostro\u00a0sito WordPress tramite File Transfer Protocol (FTP)<\/a> o File Manager, se il vostro host utilizza\u00a0cPanel<\/a>.<\/p>\n Se scegliete questo metodo, dovrete anche creare l’immagine della favicon. Potete farlo seguendo i passaggi che abbiamo descritto in precedenza.<\/p>\n Per questa dimostrazione utilizzeremo il pacchetto che abbiamo creato e scaricato da RealFaviconGenerator, le istruzioni valgono anche se avete utilizzato uno strumento diverso per creare la vostra favicon.<\/p>\n Per aggiungere manualmente una favicon al vostro sito WordPress, dovrete:<\/p>\n I file dovrebbero essere nella stessa directory delle cartelle wp-admin<\/i> e wp-content<\/i>. Successivamente, prendete il codice fornito da RealFaviconGenerator in precedenza, e:<\/p>\n L’utilizzo del plugin Insert Headers and Footers \u00e8 ottimale perch\u00e9 assicura che non si perda la favicon se si cambiano i temi di WordPress<\/a>.<\/p>\n Installare e attivare Insert Headers and Footers. Poi andate in Impostazioni \u2192 Insert Headers and Footers<\/strong> e incollate il codice nella sezione Scripts in Header<\/strong>:<\/p>\n Assicuratevi di salvare le modifiche. A questo punto avete finito!<\/p>\n Se volete che ogni sito del vostro network multisita\u00a0abbia una favicon unica, il modo pi\u00f9 semplice \u00e8 utilizzare un plugin per favicon come quello descritto sopra. Anche se \u00e8 possibile modificare i file del tema in modo da abilitare favicon uniche per ogni sito della rete, la procedura \u00e8 molto pi\u00f9 complicata rispetto all’utilizzo di un plugin.<\/p>\n Potreste anche prendere in considerazione l’utilizzo di un Content Delivery Network (CDN)<\/a> per servire le vostre immagini della favicon. I tre metodi di cui abbiamo parlato in questo post permettono di memorizzare tutte le vostre immagini delle favicon sul vostro server. Tuttavia, potete ottimizzare ancora di pi\u00f9 il vostro sito utilizzando un CDN per servire quelle immagini.<\/p>\n Quando\u00a0installate Cloudflare<\/a> o un servizio come KeyCDN<\/a>, i browser dei visitatori caricheranno la vostra favicon dal vostro CDN al posto del server del vostro sito. Se utilizzate un plugin come\u00a0CDN Enabler<\/a>, questo dovrebbe riscrivere automaticamente l’URL della favicon di WordPress in modo che funzioni con i metodi sopra descritti.<\/p>\n\n Una favicon di WordPress pu\u00f2 contribuire ad aumentare la riconoscibilit\u00e0 del vostro brand e a migliorare l’UX per i visitatori del vostro sito web. Fortunatamente, avete diverse opzioni tra cui scegliere, il che vi permette di aggiungere facilmente una favicon in WordPress.<\/p>\n I tre metodi principali che potete seguire per aggiungere una favicon al vostro sito WordPress sono i seguenti:<\/p>\n Le Favicon sono quelle piccole icone che appaiono accanto ai nomi dei siti web nelle schede del browser. Tuttavia, anche se \u00e8 da l\u00ec che hanno …<\/p>\n","protected":false},"author":103,"featured_media":36640,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[1556,6753],"topic":[25872,25873],"class_list":["post-36625","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-wordpresshelp","tag-wptips","topic-suggerimenti-wordpress","topic-sviluppo-wordpress"],"yoast_head":"\n![\"La](\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2020\/05\/favicon-kinsta-chrome.png\")
<\/a>Come Creare una Favicon per WordPress<\/h2>\n
\n
\n
![\"Caricare](\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2020\/05\/caricamento-immagine-sorgente-favicon-realfavicongen.jpg\")
![\"La](\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2020\/05\/schermata-opzioni-generatore-favicon-real.jpg\")
![\"La](\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2020\/05\/schermata-scaricare-pacchetto-favicon.jpg\")
Suggerimenti per la Creazione di una Favicon per WordPress<\/h3>\n
Come Aggiungere una Favicon al vostro Sito WordPress (3 Soluzioni Facili)<\/h2>\n
1. Utilizzare il Customizer di WordPress per Caricare la Vostra Favicon<\/h3>\n
![\"Il](\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2020\/05\/menu-aspetto-wordpress.jpg\")
![\"L'opzione](\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2020\/05\/opzione-site-identity-wordpress-customizer.jpg\")
![\"Il](\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2020\/05\/pulsante-seleziona-icona-sito-wp-customizer.jpg\")
![\"Selezionare](\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2020\/05\/selezione-immagine-vostra-favicon-wordpress.jpg\")
![\"Ritagliare](\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/05\/crop-favicon-image-1024x490.png\")
2. Installare un Plugin per Aggiungere la Vostra Favicon di WordPress<\/h3>\n
![\"Il](\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2020\/05\/plugin-favicon-realfavicongenerator-wp.jpg\")
![\"Aggiungere](\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2020\/05\/schermata-aggiungere-favicon-wp-utilizzando.jpg\")
![\"La](\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2020\/05\/schermo-vedere-anteprima-apparira-favicon-wordpress.png\")
3. Aggiungere Manualmente la Vostra Favicon via FTP<\/h3>\n
\n
\n
![\"Aggiungere](\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2020\/05\/aggiunta-codice-favicon-utilizzando-plugin-inserisci.jpg\")
Altri Suggerimenti su Come Utilizzare le Favicon in WordPress<\/h2>\n
Riepilogo<\/h2>\n
\n