puhelinyhteydet ovat asia. Kuten ankkuri linkki napauttamalla (luultavasti) siirry toiselle sivulle, nämä ovat linkkejä tap soittaa numero puhelimeen kykenevä laite. He ovat olleet täällä jo jonkin aikaa. Silti ne aiheuttavat minulle paljon hämmennystä. Esimerkiksi monet laitteet tunnistavat automaattisesti puhelinnumerot ja tekevät linkityksen meille, mutta eivät aina.

mobiililaitteilla on riittävästi verkkoliikennettä ja runsaasti puheluihin kykeneviä työpöytäsovelluksia, että puhelinlinkeistä kannattaa tietää enemmän.,

Default Käyttö

– Meillä on pätkä puhelimen linkkejä tällä sivustolla, joka on ollut voimassa vuodesta 2011:

<a href="tel:1-562-867-5309">1-562-867-5309</a>

Tämä toimii myös teksti linkit:

<a href="tel:1-562-867-5309">Click to Call!</a>

tel: ei ole niin paljon ominaisuus, koska se on protokolla, paljon samalla tavalla, että http: ja mailto: pöytäkirjat <a> tag ominaisuus. Spec itsessään ei ole mitään sanottavaa, vaikka HMTL5 ei tarjota tuki custom protokollan käsittelijät, joiden avulla tällaista protokollaa voidaan käyttää.,

Olet luultavasti ihmettelevät, miksi tel: voidaan katsoa, default käyttö puuttuessa virallinen spec sitä. Voit luottaa siihen, että se oli ehdotettu standardi jo vuonna 2000 ja myöhemmin hyväksyi iOS, joten se käytännössä tapa mennä noin 2007. On olemassa muita puhelinpohjaisia protokollia (joihin pääsemme myöhemmin), mutta keskitymme tel: ottaen huomioon sen suhteellisen näkyvyyden.,

Selain Tukea

katso tel: pop up kuin protocol handler linkkejä, joilla ei ole virallista asiakirjat; ja missä ei ole todisteita, me usein nähdä eroja selain, tuki ja käyttäytyminen. Se ei tarkoita, että selaimet eivät tunnistaisi <a> tag itse. Sen sijaan, selaimet saattavat tehdä erilaisia päätöksiä siitä, mitä tehdä, kun linkkiä napsautetaan. Selain voi esimerkiksi olettaa, että toisen sovelluksen on avattava ja käynnistää dialogin, jossa kysytään, mitä sovellusta käyttää. Muissa tapauksissa yhteys saatetaan jättää kokonaan huomiotta.,

Selaimen Ei se linkki?,td>Kyllä Käynnistää puhelun
iOS Kyllä Laukaisee vaihtoehdot soittaa, viesti, kopioida tai lisätä numeron Yhteystiedot-sovellus
Opera (OSX) Kyllä Laukaisee valintaikkuna, jossa vahvistetaan, käyttää toinen sovellus
Android (Windows) Kyllä Laukaisee virhe dialogi, joka ei tunnista pöytäkirja
Safari Kyllä Käynnistää FaceTime

Muotoilu Puhelin Linkit

Muotoilu puhelin numerot on kuin mikä tahansa linkki., Itse asiassa, se perii oletuksena muotoilu ankkurit:

a { color: orange; text-decoration: none;}

sanotaan, että meillä on vain tyylejä soveltaa puhelin linkkejä., Voimme tehdä, että pseudo-valitsin, joka etsii ulos tel: tekstiä tietyn URL-osoitteen:

a { color: orange; text-decoration: none;}

Tuts+ on mukava temppu käyttäen ::before pseudo valitsin lisätä unicode-puhelimen merkki ennen numero näkyy:

a:before { content: "\260e"; margin-right: 0.5em;}

Vaihtoehto Puhelin-Liittyvät Linkit

Usko tai älä, tel: ei ole ainoa tapa aloittaa puhelun, jossa on linkki. Tässä muutamia muita mukautettuja puhelinpohjaisia protokollan käsittelijöitä käytettävissämme.,

  • callto: Aivan kuin tel: mutta käyttää aloittaa puhelut kautta Skype-sovellus.
  • automaattinen tunnistus: monet selaimet havaitsevat automaattisesti HTML: ssä olevan puhelinnumeron ja linkittävät sen sinulle-merkintää ei tarvitse muuttaa. esimerkiksi iOS tekee tämän täysin, vaikka se ei näyttänyt olevan Chromen Androidissa.
  • sms: Ohita puhelu ja mennä suoraan tekstiviestin. Tämä näyttää olevan paljon vähemmän tuettu kuin tel: on yksi selaimissa, kuten mobiili.,

    • fax:palaa tulevaisuuteen faksikoneilla. Jälleen tarkkanäköinen luotettavuus.

Parhaat Käytännöt

Se on aika hauska puhua parhaita käytäntöjä, kun se tulee jotain ilman tekniset tiedot. Spec Kyllä antaa lyhyen lausunnon ”klikkaa soittaa” – ideasta, mutta tässä on muutamia asioita, jotka kannattaa pitää mielessä työskennellessään puhelinnumeroiden ja linkkien kanssa.

Harkitse Yhteydessä

puhelin-linkin voi tehdä erinomainen call-to-toiminta, erityisesti matkapuhelimissa, joissa se vähentää kitkaa sisältöä ja soittaa., Samalla puhelinlinkkejä voitaisiin pitää esteenä työpöytäkokemukselle, jossa puhelinsoitto ei olisi mahdollinen, jos laitteesta puuttuu sitä tukeva sovellus.

Yksi idea olisi luoda luokan nimenomaan puhelin linkkejä ja yrittää näyttää tai piilottaa ne sen perusteella, mitä tiedämme selaimen. Modernizr ja median kyselyt ovat käteviä täällä, joskin täysin epätarkkoja.

käytä maakoodeja

maakoodia ei tarvita, mutta se voisi olla mukava kosketus kohteisiin, joissa on kansainvälistä liikennettä., Maakoodeja voi edeltää + , mutta sitäkään ei tarvita.

<a href="tel:+01-562-867-5309">1-562-867-5309</a>

hakukoneoptimointi

SEO asiantuntijoita voisi olla enemmän lisää tästä kuin minä, mutta Google tarjoaa jäsenneltyä tietoa muodossa paikallisille yrityksille ja sitä pitäisi käyttää puhelin-linkkejä enemmän tunnistettavissa indeksoijat, muotoilu hakutulossivuilla tavalla, joka tekee numero paljon enemmän käytännöllisiä., Dudley Kerroksinen tarjoaa erinomaisen yleiskuvan kanssa seuraava esimerkki:

toisella puolella haluavat hakukoneet seurata puhelimen linkkejä, voit lisätä rel="nofollow" lannistaa linkkejä seurataan ja indeksoitu. Tämä voisi olla hyvä idea tahansa linkki ei ole nimetty call to action, koska web crawlers olisi taipuvainen seuraamaan sitä mihinkään.,

<a href="tel:+01-562-867-5309" rel="nofollow">1-562-867-5309</a>

sammuttamalla Numeron Tunnistus iOS

Jos aiot lisätä puhelimen linkkejä markup, saatat myös haluta harkita poistaminen käytöstä iOS-auto-havaitsemaan puhelimen numeroita ja ensisijainen tyylejä. Lisää seuraava asiakirja <head> kääntää että pois päältä:

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

kirjallisuutta