Share
Jeg kommer ikke til å begynne med dette raske tipset med den gamle "disse dagene folk ser på nettsteder på en rekke enheter" spiel, men det er ekte. Mange mobile enheter vil gjøre en god jobb med å gjenkjenne telefonnumre i HTML-en din, slik at de klikkes slik at du kan ringe direkte til det nummeret - men ikke alltid.
Hva skjer hvis en brukers mobil ikke gjenkjenner et telefonnummer som "kallbart"? Kanskje, for eksempel, måten du har oppgitt nummeret, ikke er gjenkjent av plattformen. Ubesvart mulighet!
(Sjekk ut Mark Hammonds liste over mønstre som er anerkjent for iOS og Android ...)
Denne er død enkel: pakk telefonnumrene dine i ankre, men i stedet for å bruke http * protokoll (eller hva du ellers normalt holder fast i et anker) bruk tlf: eller tlf: //. På denne måten, selv om du har brukt et ukjent mønster, vil enheten fortsatt vite hva du skal gjøre:
+44 (0) 111 - 222 333 44
Ikke-støttende nettlesere (for eksempel skrivebordet ditt) vet ikke hva de skal gjøre med tlf: protokoll enda - med mindre brukeren har noen form for utvidelse aktivert som tillater Skype å gjenkjenne telefonnumre. Google Chrome vil gjerne ignorere klikket, men for øyeblikket begynner andre store nettlesere å gråte. Andre enheter uten telefoner (for eksempel iPad) vil gjenkjenne nummeret og be om at brukeren legger til en kontakt i adresseboken - dette ville være en fornuftig tilnærming til desktop-nettlesere også.
Som ekstrautstyr, la oss gjøre det enda tydeligere for brukeren at de ser på en telefonkobling ved å utforme hver enkelt. Vi bruker en attributtverdivelger for dette, rettet mot bare :før pseudoelement av lenker som inneholder strengen tlf: innenfor deres href Egenskap:
a [href ^ = "tel:"]: før innhold: "\ 260E"; skjerm: blokk; margin-høyre: 0.5em;
Den lille karat der ^ betyr at det er på jakt etter noen elementer som har href attributter begynne med strengen vi spesifiserer. tlf: og tlf: // vil derfor begge være dekket her. Vi har slått inn en liten unicode-telefon \ 260e;, så vi trenger ikke engang å bruke et webfontikon. Hyggelig.
Hyggelig nyanse eh? 
Accentsconagua
farge: tomat tro det eller ei… Vi er alle ferdige her, i navnet på tilgjengelighet gir den en prøve!
