Share
Questo suggerimento rapido mostra come creare collegamenti di numeri di telefono con HTML. Le tecniche in questo suggerimento funzionano su dispositivi Android e iPhone e possono migliorare notevolmente l'esperienza dei visitatori di siti Web mobili.
Se hai bisogno di ulteriore aiuto con qualsiasi aspetto dello sviluppo mobile, sentiti libero di incaricare uno degli esperti di Envato Studio. Altrimenti, continua a leggere per le istruzioni.
Per impostazione predefinita su iOS e Android, il browser del dispositivo crea "magicamente" collegamenti senza testo interpretato come numero di telefono. Quando l'utente tocca uno di questi collegamenti, verrà avviata l'applicazione del telefono cellulare. I modelli esatti dei numeri di telefono che verranno automaticamente trasformati in collegamenti variano tra piattaforme, ma ho elencato diversi dei modelli che ho testato con successo qui sotto:
Se il tuo sito o la tua app utilizza uno dei formati cross-device sopra indicati, i tuoi utenti dovrebbero già essere in grado di effettuare rapidamente chiamate semplicemente toccando il testo.
La ricetta per creare il tuo numero di telefono è semplice. Invece di utilizzare un normale collegamento basato sul protocollo HTTP / S o sul file system, è possibile utilizzare il protocollo "tel:". Funziona come un normale collegamento, solo al posto di href attributo che punta a un URL o un file, anteponi "tel:" o "tel: //" a un numero di telefono.
Guarda i seguenti esempi per vedere questo in azione:
Se vuoi parlare, chiamami!
+1 (555) 555-5555
NOTA: il codice sopra dovrebbe essere testato su un dispositivo fisico. Non funzionerà con l'emulatore dell'SDK iOS.
L'ultimo frammento di esempio è particolarmente degno di nota. Molti sviluppatori web non hanno il lusso di eseguire test estesi su dispositivi mobili sia su iPhone che su Android, quindi sarebbe facile perdere il fatto che alcuni dei formati telefonici elencati all'inizio di questo suggerimento non verranno riconosciuti automaticamente tutti i dispositivi.
Poiché i formati di telefono riconosciuti possono variare a seconda del dispositivo, ti suggerisco di inserire sempre i tuoi numeri di telefono in un collegamento con il prefisso "tel: //". Questo non solo consentirà di collegare il maggior numero di dispositivi all'applicazione del telefono, ma questo sembra anche un approccio più esplicito, accessibile e semantico alla gestione dei collegamenti telefonici..
Ovviamente, se il contenuto che stai creando potrebbe essere visualizzato su un dispositivo senza telefono, dovresti utilizzare una lingua lato server per aggiungere solo i collegamenti "tel:" quando necessario, oppure dovresti controllare il tipo di dispositivo con JavaScript e aggiungere progressivamente i collegamenti alla pagina, quando applicabile.
Sia per Android che per iPhone, puoi disattivare facilmente il collegamento automatico del numero di telefono con il seguente meta tag:
Questo metatag disabiliterà il collegamento automatico del numero di telefono, consentendo comunque di creare manualmente i collegamenti del numero di telefono utilizzando il metodo "tel: //" sopra descritto.
Questo è tutto per questo tutorial! Se vuoi approfondire ulteriormente lo sviluppo del tuo cellulare, dai un'occhiata alla vasta selezione di modelli utili per l'app su Envato Market. Ce ne sono migliaia tra cui scegliere, sia per Android che per iOS.
Modelli di app per dispositivi mobili sul mercato Envato
Accentsconagua
+1 (555) 555-5555