Sfat rapid pentru telefonul mobil legături la numărul de telefon

Acest sfat rapid demonstrează modul de creare a legăturilor cu numărul de telefon cu HTML. Tehnicile din acest sfat lucrează atât pe dispozitive Android cât și pe iPhone și pot îmbunătăți considerabil experiența vizitatorilor site-urilor mobile.

Dacă aveți nevoie de ajutor suplimentar pentru orice aspect al dezvoltării mobile, nu ezitați să comisionați unul dintre experții Envato Studio. În caz contrar, citiți instrucțiunile.

Linkuri telefonice implicite

Implicit pe iOS și Android, browserul pentru dispozitive va crea "în mod magic" link-uri din text interpretat ca număr de telefon. Când utilizatorul întrerupe una dintre aceste linkuri, va fi lansată aplicația pentru telefonul dispozitivului. Tipurile de numere de telefon care vor fi transformate automat în link-uri variază între platforme, dar am enumerat mai multe modele pe care le-am testat cu succes:

  • 555-5555 (Numai iPhone)
  • (555) 555-5555 (Android + iPhone)
  • +1 (555) 555-5555 (Numai iPhone)
  • 555 5555 (Numai iPhone)
  • 555 555 5555 (Android + iPhone)
  • +1 555 555 5555 (Numai iPhone)
  • 555,5555 (Numai iPhone)
  • 555.555.5555 (Android + iPhone)
  • +1 555.555.5555 (Numai iPhone)

Dacă site-ul dvs. sau aplicația utilizează unul dintre formatele de mai multe dispozitive de mai sus, utilizatorii dvs. ar trebui să poată efectua rapid apeluri doar prin atingerea textului.

Crearea de legături cu numărul de telefon

Rețeta pentru crearea propriilor legături de număr de telefon este simplă. În loc să utilizați o legătură normală bazată pe protocolul HTTP / S sau pe sistemul de fișiere, puteți folosi protocolul "tel:". Acest lucru funcționează la fel ca o legătură normală, numai în loc de href atributul care indică o adresă URL sau un fișier, prefixați fie "tel:", fie "tel: //" către un număr de telefon.

Consultați următoarele exemple pentru a vedea acest lucru în acțiune:

 

Dacă vrei să vorbești, sună-mă!

Sunați acum! +1 (555) 555-5555

NOTĂ: Codul de mai sus trebuie testat pe un dispozitiv fizic. Nu va funcționa pe emulatorul SDK pentru iOS.

Ultimul fragment de exemplu este de remarcat în special. Mulți dezvoltatori web nu au luxul de a efectua testarea extensivă a dispozitivelor mobile atât pe iPhone, cât și pe Android, astfel încât ar fi ușor să pierdeți faptul că unele formate de telefon listate la începutul acestui sfat nu vor fi recunoscute automat toate dispozitivele.

Deoarece formatele telefonului recunoscute pot să difere de la un dispozitiv la altul, vă recomand să introduceți întotdeauna numerele dvs. de telefon într-un link cu prefixul "tel: //". Nu numai că o va face astfel încât cel mai mare număr de dispozitive să fie conectat la aplicația telefonică, dar aceasta pare a fi o abordare mai explicită, mai accesibilă și mai semantică pentru manipularea legăturilor telefonice.

Desigur, dacă conținutul pe care îl creați ar putea fi vizionat pe un dispozitiv fără telefon, trebuie să utilizați o limbă de pe server pentru a adăuga doar linkurile "tel:" atunci când este necesar sau ar trebui să verificați tipul de dispozitiv cu JavaScript și adăugați linkurile la pagină progresiv, dacă este cazul.

Dezactivarea detectării legăturii

Atât pentru Android cât și pentru iPhone, puteți dezactiva cu ușurință conectarea automată a numărului de telefon cu următorul meta tag:

Această etichetă meta va dezactiva autocuparea numărului de telefon, permițându-vă în același timp să creați manual linkuri către numărul de telefon utilizând metoda "tel: //" descrisă mai sus.

Asta e pentru acest tutorial! Dacă doriți să vă dezvoltați în continuare mobilul, verificați selecția imensă de template-uri utile pe Envato Market. Există mii de a alege, atât pentru Android cât și pentru iOS.

Șabloane de aplicații mobile pe Envato Market
Cod