Disattivare i numeri di telefono blu su Safari e iOS

Home - Web Design - Disattivare i numeri di telefono blu su Safari e iOS

Disattivare i numeri di telefono blu su Safari e iOS

Negli ultimi tempi mi è capitato di portare a termine un sito per un cliente e di dover disattivare la funzione dei numeri blu per l’interazione dai dispositivi iOS per il browser Safari. Mi sono accorta infatti che, nella versione per Safari, non si vedeva il numero di telefono nel footer. Ohibò, come mai?

Ci è voluto un po’ per capirlo, ma poi ho notato che Safari modifica il colore del numero di telefono, trasformandolo in blu, e creando un link di collegamento. Che problema c’è? Ti viene spontaneo pensare. Il problema sorge nel momento in cui lo sfondo del footer, o del sito in generale, è blu o di un colore che crea poco contrasto tra il link e lo sfondo: a quel punto, comprenderai che il numero di telefono si vede pochissimo o non si vede affatto, provocando un discreto problema per quanto riguarda l’esperienza d’interazione (se t’interessa approfondire l’argomento, ne ho scritto qua) degli utenti che navigano con iPhone, per esempio. I quali, non c’è bisogno di dirlo, sono un bel po’!

Apro una parentesi che riguarda i dati di Google Analytics: probabilmente, col tempo, attraverso i dati e il comportamento degli utenti dai dispositivi Apple, avremmo notato una tendenza a non portare a termine l’obiettivo che potrebbe essere, appunto, il contatto telefonico, e piano piano avremmo individuato il problema. Ma per fortuna ce ne siamo accorti prima, risolvendo la problematica! Come? Te lo spiego qui di seguito.

Come disattivare la funzione numeri di telefono blu del tuo sito su iOS

Su un sito creato in HTML o comunque dove si ha pieno controllo del codice si può inserire un tag apposito che è:

<meta name="format-detection" content="telephone=no">

Io trovo più veloce aggiungere un CSS per impedire a Safari di modificare lo stile (lo si costringe a seguire il colore deciso sul sito). Ecco il codice che dovrai inserire nel Custom CSS del tuo sito WordPress:

a[href^=tel] {
text-decoration:inherit;
color: inherit;
}

Perché disattivare la funzione numeri blu per il tuo sito su Safari e iOS è così importante? Come dicevo sopra, si rischierebbe di annullare i contatti da questi dispositivi, rendendo nulla l’esperienza di questi utenti e vanificandone la permanenza sul sito. Il sito può essere veloce, navigabile, intuitivo, piacevole, stimolante, capace dunque di convertire i visitatori in micro e macro conversioni (contatti, appunto, oppure anche acquisti). Ma, se la fase finale, la call to action per attuare la conversione, non è visibile oppure non funziona, avremo fatto un terribile buco nell’acqua per il nostro cliente.

Ecco dunque un’altra lezione appresa da quest’esperienza: quando fai un sito, controlla sempre tutti i link e i dettagli con estrema attenzione, su ciascun browser e dispositivo.

Se ti serve una mano per disattivare la funzione numeri blu per il tuo sito su Safari e iOS, contattami, sarò felice di aiutarti.

Categorie Web Design

Resta aggiornat@ sui nuovi articoli!

Iscrivi alla mia newsletter mensile - zero spam!

.

CONTATTI


Da remoto in tutto il mondo!

(+39) 379 204 2131

info@nicolecurioni.com

© 2011 - 2022 MADE WITH ✨ BY NICOLE CURIONI WEB.DESIGN

P.IVA 10530630960 - PRIVACY POLICY - COOKIE POLICY