Cambiare Colore alla Address Bar del Browser (Google Chrome)

 In Web Design

Potrebbe esserti capitato, utilizzando il tuo dispositivo mobile, di vedere che la Address Bar, ossia la sezione del Browser nella quale andiamo a inserire la url dei siti, cambi colore su alcuni siti, il più delle volte adattandosi allo stile del sito stesso. Questo succede utilizzando le ultime versioni di Google Chrome per navigare.

Potresti pensare che sia Google a decidere quale colore meglio si adatti al contenuto e che attivi questa funzione solo ad alcuni portali attentamente selezionati ma la verità è che in pochissimi secondi e utilizzando una sola riga di codice sarai in grado di ottenere lo stesso risultato anche sul tuo sito.

Come modificare il colore della Address Bar

Tutto quello di cui hai bisogno è un accesso FTP, io consiglio sempre caldamente FileZilla (semplicissimo da scaricare e utilizzare) e di sapere dove si trova la sezione <head> della tua pagina.

La sezione <head> è quella che contiene tutti i meta tag che definiscono titolo, descrizione, favicon e molte altre informazioni per motori di ricerca, social, sistemi di monitoraggio e altro ancora. Nella maggior parte dei CMS (Content Management System) come WordPress e simili o nei siti strutturati in php questa sezione è normalmente contenuta in un singolo file per tutte le pagine (normalmente chiamato header.php e presente nella cartella del tema, se presente). Se invece stai lavorando con pagine in html saprete benissimo che si tratta della sezione che precede il <body> della pagina.

All’interno di questa sezione dovremo quindi andare a inserire questa singola riga di codice

<meta name=”theme-color” content=”#43616d“>

L’unica accortezza che dovrai usare sarà quella di cambiare il codice in verde con quello in esadecimale del colore che volete utilizzare.

Salvato e caricato il file è fatta, avete colorato la Address Bar del colore scelto.

Un paio di consigli

L’argomento è semplice e abbiamo visto come risolverlo in un attimo ma ci tengo a darti ancora un paio di consigli per evitare di sottovalutare l’impatto della scelta del colore.

  • Per prima cosa consiglio sempre di usare pochi colori nel tema, lo stretto indispensabile, massimo 3-4 diversi contando il bianco e il nero. La Address Bar dovrebbe quindi rendere più uniforme la pagina e questo è il principale motivo per pensare i cambiarne il colore.
  • Non bisogna trascurare l’idea di non cambiare affatto il colore, non è sempre una buona idea, a volte mantenere lo stile neutro del Browser è la scelta migliore.
  • Il colore deve sempre essere testato, usare un colore troppo chiaro o che renda illeggibile la sezione non è giustificato dall’esigenza di seguire i colori del tema.

Non è immediato infine realizzare che si possono creare colori diversi per diverse sezioni del sito assegnandone diversi header. Attenzione però, se da un lato è un’idea molto interessante per diversificare gli argomenti, dall’altra deve essere ponderata con attenzione perchè rischia di confondere l’utente che potrebbe non essere più sicuro di trovarsi sullo stesso sito, sopratutto se la versione mobile dello stesso è molto semplificata per lasciare spazio al testo.

Davide Gavazzi
Davide Gavazzi, appassionato di SEO, SEM, Social Media Marketing e Web Design. Si occupa di Web dal 2011 creando e gestendo siti, Social, Pubblicità e tutto ciò che riguarda l'Online.
Post Recenti

Lascia un commento

Contattami

Hai domande? Puoi scrivermi utilizzando il form seguente e sarai ricontattato il prima possibile.

Non leggibile? Cambia testo.

Start typing and press Enter to search