Ecco un’interessante tutorial su come inserire in WordPress dei numeri di telefono cliccabili da smartphone. Il tutorial è stato realizzato da MCrapanzano, utente attivissimo della community di TalentGo.it.
Come inserire numeri di telefono cliccabili su smartphone
Il numero di utenti che visitano siti Web dai propri smartphone è in costante aumento. Molte aziende inseriscono i relativi numeri di telefono sul proprio sito web, ma senza renderli cliccabili e quindi riducendo il valore della costumer experience.
Qui vi riporto qualche metodo semplice per creare dei numeri di telefono cliccabili, sia per utenti desktop che per utenti mobile.
Se un numero di telefono è scritto in un formato riconoscibile molti smartphone dovrebbero riconoscerlo automaticamente come numero di telefono e convertirlo in un link. Tuttavia, se si desidera che il numero sia sostituito da un testo di ancoraggio, o se si vuole collegarlo un’immagine, si rende necessario creare manualmente il collegamento
Il formato corretto di scrivere un numero di telefono per renderlo riconoscibile alla maggior parte dei dispositive mobile è:
<Codice Nazione> <(Prefisso Locale) > <numero Telefonico > : ie: +39 (02) 965-1212
Tuttavia la maggior parte degli smartphone riconosce anche questi formati:
+39029651212
+39.02.965.1212
02-965-1212
02 965 1212
Scrivere i numeri di telefono in formato corretto aiuta a convertirli automaticamente in link per utenti di telefonia mobile, ma non garantisce il risultato, in quanto gli utenti con telefoni più vecchi non possono vedere il link. Vediamo alcuni esempi:
Esempio 1
[html]<!–Questo link funziona su Android e iPhone. Sarà visibile per gli utenti desktop,
ma si tradurrà in un errore quando si fa clic –>
<a href="tel://+39029651212">+39 (02) 965-1212</a> <a href="tel://39029651212">Chiamaci</a>[/html]
Il problema con il link sopra è che sarà visibile agli utenti di tutti i dispositive, quindi se un utente desktop prova a cliccare su di esso il risultato dipendere dalla risposta del browser: per esempio non farà nulla su Google Chrome ma mostrerà un errore in Firefox.
Esempio 2
[html]<!– Questo link apre Skype su desktop e notebook; sui telefoni cellulari chiederà agli utenti
se desiderano aprire skype o comporre il numero utilizzando il proprio telefono –>
<a href="callto://39029651212">+39 (02) 695-1212</a>[/html]
Nell’esempio sopra abbiamo usato il protocollo callto di Skype. Questo ha il vantaggio che gli utenti smartphone saranno in grado di chiamare il numero usando il proprio servizio di telefonia, mentre gli utenti desktop e di altri dispositivi saranno in grado di effettuare una chiamata utilizzando Skype.
Esempio 3
[html]</strong><!—Collegare un numero a un’immagine –>
<a href="callto://39029651212" title="Contattaci">
<img src="/images/telefono.png" alt="Contattaci" /></a><strong>[/html]
Nell’esempio sopra abbiamo invece collegato un link a un’immagine a un numero utilizzando il protocollo Skype callto. Il problema con questa sintassi è che uno smartphone riconosce il protocollo di Skype, ma non riconosce il numero di telefono. Inoltre, potrebbe non offrire all’utente la possibilità di chiamare con il proprio telefono cellulare.
Una buona soluzione per rendere i numeri di telefono cliccabili su smartphone può essere utilizzare lo script (versione js) per il browser-detect proposto qui http://detectmobilebrowsers.com/ e impostare una funzione if(isMobile()) per distinguere i comportamenti.
