Il tuo carrello
Non ci sono più articoli nel tuo carrello
- Tecnoacquisti.com
- Blog PrestaShop e Tutorial Ecommerce
- ecommerce, normative, commercio online, sito web
Scopri le caratteristiche e dimensioni favicon, come crearla, perché è importante e come inserirla nel tuo sito web o ecommerce
La cura dei particolari è essenziale per aziende e privati che hanno un sito web o una pagina online. La relazione tra qualità grafica del proprio sito web e la capacità di attrarre utenza è estremamente evidente pensando alle impostazioni date dai browser più importanti.
Tra gli elementi più interessanti che si legano a questa relazione ci sono le favicon, elementi grafici essenziali che accompagnano gli utenti nella loro navigazione internet e vero e proprio trampolino di lancio per le aziende che vogliono dare un riferimento costante ai loro sostenitori. Nelle prossime righe analizzeremo la definizione, le caratteristiche, i vantaggi e i software dedicati per la creazione di una favicon di qualità.
Caratteristiche e dimensioni favicon
La definizione evidenzia come questo elemento grafico possa migliorare l'interazione tra utente e sito di riferimento, ma quali sono le caratteristiche tecniche ideali per sfruttarne al meglio le potenzialità?
- Dimensioni;
- Estensioni.
Tecnicamente una favicon ha una grafica di 16x16 pixel, ma non è difficile crearne una di dimensioni maggiori, per esempio di 128x128 pixel, dato che il sistema utilizzato per il proprio codice sorgente ridimensionerà l'immagine in modo appropriato.
Considerando gli standard di Microsoft puoi creare anche favicon di dimensioni 64x64, 32x32 e 24x24 pixel a seconda di dove hai la necessità che si identifichi meglio. Nello specifico la visualizzazione ottimale di una favicon su Microsoft Edge è di 16x16 pixel nella barra degli indirizzi, 32x32 pixel nelle nuove tab e di 24x24 pixel nella barra del browser.
Aspetto su cui devi fare attenzione è l'estensione di riferimento, una favicon ha un'estensione ICO, ideale proprio per la creazione di immagini molto piccole. Se il tuo software di riferimento per la creazione di favicon non ha questa estensione, puoi comunque utilizzare i formati JPG e PNG, quest'ultima particolarmente indicata se vuoi apportare modifiche in seguito e successivamente convertire il formato ICO.
Cos'è una favicon
Ti starai sicuramente chiedendo cosa possa essere una favicon. Da un punto di vista prettamente tecnico questo termine definisce un elemento grafico estremamente piccolo, usualmente identificato come un logo, che viene utilizzato da una pagina web o da un sito internet per evidenziarne l'identità.
La parola favicon è la fusione dei termini Favorites e Icon, come è facile dedurre dalla traduzione identifica la rappresentazione grafica di un'icona che puoi usare nei preferiti. Inizialmente le favicon erano presenti solo nel browser Microsoft Explorer per il salvataggio dei siti web nella barra dei preferiti, successivamente anche gli altri software di ricerca hanno implementato tale funzionalità portandola a diventare uno standard.
A cosa serve una favicon
La funzione principale di una favicon risiede nella sua capacità di essere riconosciuta immediatamente. Ogni utente, grazie all'identificazione visiva dell'immagine saprà perfettamente e in modo rapido quale sia il sito associato, riducendo i tempi di ricerca e garantendo al sito stesso un'identità del brand ben definita.
Oltre alla facilità di identificazione nella canonica barra dei preferiti, vi è un'immediatezza nell'interazione con il sito di riferimento anche durante la navigazione. Infatti, soltanto con lo sguardo è possibile riconoscere e interagire con il sito aiutando aziende e privati nel migliorare il brand building.
I vantaggi di una favicon per aziende e privati
L'utilizzo sempre più esteso della creazione di una favicon da parte di aziende e privati non è assolutamente casuale. Una strategia di marketing efficace ottimizza in modo oculato ogni aspetto grafico per attrarre un numero maggiore di utenti. Ma quali sono i benefici concreti che un privato o un'azienda possono ricavare dalla realizzazione di una favicon? Vediamo i principali.
- Valorizzare il marchio;
- Ottimizzazione del lavoro;
- Attrarre utenza;
- Costo;
- Semplicità di realizzazione.
Valorizzare il marchio: gli utenti sul web sono molto legati all'aspetto grafico di un contesto digitale. La possibilità di avere un'icona chiara e attraente incrementa notevolmente la fiducia in quel brand, valorizzandolo di conseguenza.
Ottimizzazione del lavoro: avere un'icona chiara e distinguibile nella barra dei preferiti è fondamentale per ottimizzare i tempi di lavoro. Sempre più persone lavorano in smart working e ottimizzare il tempo a disposizione è essenziale per ottenere risultati. Un'icona di qualità permette di gestire meglio le fasi lavorative.
Attrarre utenza: la percezione visiva è una componente essenziale per le aziende che vogliono attrarre nuova utenza. Le persone tendono a legarsi a un sito web graficamente gradevole non solo nella navigazione, ma anche nella cura dei particolari, affiliandosi nel tempo.
Costo: tra i vantaggi più rilevanti di una favicon c'è il suo costo. Infatti, grazie ai tantissimi software a disposizione è possibile crearne una o più di una senza spendere molto.
Semplicità di realizzazione: la creazione di una favicon è estremamente semplice anche per chi non hai dimestichezza con i software di editing fotografico. Le dimensioni ridotte non sono un limite e potrai sperimentare diversi formati a seconda delle tue necessità.
Come creare una favicon
Preso atto dei vantaggi che potresti avere da una favicon è opportuno comprendere quali siano i metodi per crearne una di qualità. Sebbene sul web esistano diversi siti online capaci di creare una favicon personalizzata, possiamo usare comuni programmi di foto ritocco - visti in questa guida - oppure molto più indicati programmi di grafica vettoriali quali Adobe Illustrator, Corel Draw o Inkscape. Trattandosi principalmente di un logo la grafica vettoriale è la più indicata, potremo trasformare poi la nostra icona anche nelle icone touch per Android e iPhone.
Un servizio online molto utile è https://realfavicongenerator.net/ che ci permetterà non solo di convertire la nostra favicon nel formato corretto, ma di generare un icona specifica per ogni piattaforma. Potremo anche testare il nostro ecommerce in Prestashop o il nostro sito aziendale in WordPress, al fine di verificare se l'implementazione della favicon sia corretta.
Pure PrestaShop mette a disposizione un servizio di conversione: https://addons.prestashop.com/en/create-favicon.php?pab=1
Conclusione
Una strategia di marketing efficace e un'identità del brand di qualità passano attraverso la cura dei particolari. Sebbene molti ritengano superficiale la realizzazione di una favicon per il proprio sito web, in realtà questa può fare la differenza. I vantaggi, come evidenziato nel paragrafo precedente, sono notevoli e non sfruttarli al meglio sarebbe un vero peccato. Senza contare che qualsiasi Tools di ottimizzazione SEO segnalerà la mancanza di questa importante icona, che andrebbe oggi estesa tramite l'adozione anche delle Touch Icon per i dispositivi mobili. Le touch incon permettono al vostro cliente di aggiungere alla home del proprio dispositivo il vostro ecommerce che apparirà come un'APP. Il nostro modulo ArtWebMaster premette l'inseriemento delle Touch Icon in PrestaShop. Il Template Warehouse integra già la funzione, nel modulo: IqitThemeEditor - Backoffice.
Per inserire la favicon in PrestaShop 1.7 basta andare in: Design -> Tema & Logo
Autore: Loris Modena
SENIOR DEVELOPER
Per Ind Loris Modena titolare di Arte e Informatica, inizia a lavorare nel settore informatico nel 1989 quale sistemista addetto alla manutenzione e installazione di sistemi informatici. Inizia a programmare per il web nel 1997 occupandosi di programmazione CGI in PERL e successivamente passando alla programmazione in PHP e JavaScript. In questo periodo si avvicina al mondo Open source e alla gestione di server Linux.