Gör det enkelt att ringa upp telefonnummer
Märk upp telefonnummer med tel-länkar, så att man kan ringa upp ett telefonnummer direkt, genom att klicka på det.
Rekommendationer för länkade telefonnummerLänk hit
- Markera telefonnummer i koden som telefonlänkar (tel:). Det ger möjlighet att direkt ringa upp numret, på samma sätt som e-postlänkar (mailto:) ger möjlighet att skicka e-post.
- Ange det fullständiga telefonnumret, inklusive det internationella prefixet, i länken – även om det nummer som visas på sidan bara innehåller den lokala delen. Då fungerar länken oavsett varifrån användaren ringer.
ExempelkodLänk hit
Följande kod gör telefonnumret till en länk för att ringa upp det direkt:
<a href="tel:+46855050000">08 – 55 05 00 00</a>
Ni kan styra utseendet på länkarna med stilmallar. I exemplet har länken en egen stilmallsklass.
Vissa mobiltelefoner och webbläsare hittar automatiskt sifferkombinationer som ser ut som telefonnummer. De gör det alltså möjligt att ringa ett nummer även utan kodlänkning. Risken är dock att näraliggande siffror, som inte ingår i telefonnumret, ändå tolkas som en del av numret, till exempel ett klockslag. Därför är länkar att rekommendera.
För fler rekommendationer om länkar (till exempelvis e-postadresser), se R5. Skriv tydliga länkar.
Om denna riktlinje
- Riktlinje nr: 90
- Prioritet: 5
- Kortadress: webbriktlinjer.se/90
- Ämnesområden: Teknik & kod
- Målgrupp: Apputvecklare Redaktör
Kommentarer (7)
Om man väljer att länka telefonnummer, vad tänker man sig ska hända på enheter som inte är telefoner om användaren klickar på det? I bästa fall associerar webbläsaren och/eller operativsystemet klicket med att starta, eller erbjuda sig att starta, ett telefon-kapabelt program som t.ex. Skype. I värsta fall öppnas en telefonapplikation som användaren inte nyttjar eller så visas ett felmeddelande om att enheten saknar något.
Många användare hanterar givetvis detta utan problem och kopierar telefonnumret om hen t.ex. vill lägga in det i en kontaktbok eller klistra in det i en telefon-applikation som inte webbläsaren har som förstaval. För den som använder kontextmenyn och väljer ”Kopiera länk” är det inga problem – annat än att hen kan behöva rensa bort protokoll-texten ”tel:” i början av numret – men många användare kopierar text genom att markera den. Att markera texten i en länk är hopplöst, pekaren går över till att bli något man klickar med och inte markerar text med. Samma sak med touch-enheter, ett fingertryck triggar en länk lättare än att markera texten i den.
På smarta mobiler fungerar det oftast bra för de flesta användare med länkade telefonnummer, i alla fall om hen vill använda enhetens egen telefonfunktion. Det finns dock en hel del som använder andra telefoni-kapabla appar för att ringa.
Om man ska förlita sig på en smart telefons webbläsares egen tolkning av vad som är ett telefonnummer är skrivsättet det avgörande. I vissa enheter beror det på språkinställningarna. Bäst i längden är antagligen att använda rekommenderade standarder för hur man skriver telefonnummer på aktuellt språk och att deklarera språket i HTML-koden. Skrivsättet av telefonnumret i texten ovan, ”08 – 55 05 00 00”, använder mellanslag runt ett tankstreck (U+2013) som avdelare. Safari och Chrome i iOS 10 identifierar t.ex. inte detta som ett telefonnummer. Skrivet med ett bindestreck (U+2010) utan mellanslag runt, fungerar det. Bindestreck utan mellanslag är också vad Språkrådgivningen[1] rekommenderar – och tidigare Språknämndens Svenska skrivregler. Det är också vad Christer Hellmark rekommenderar i Typografisk Handbok och vad PTS använder i sina kontaktuppgifter som länkas som exempel ovan.
[1] http://www.sprakochfolkminnen.se/sprak/sprakradgivning/frageladan.html?url=-27634753%2Fcgi-bin%2Fsrfl%2Fvisasvar.py%3Fsok%3DTelefonnummer%26svar%3D61433&sv.url=12.c17e514db30bb2a810ea
Tack, mycket relevanta observationer och kommentarer!
Angående rekommendationen ”e-postlänkar (mailto:) ger möjlighet att skicka e-post” ovan.
Trots att länkade e-postadresser har använts sen 90-talet är det problematiskt för många användare. För att det ska hjälpa användaren ska webbläsaren eller operativsystemet associera mailto-länkar med det e-postprogram som användaren använder på aktuell enhet. De som använder webbmail kan bli rätt förvirrade eller irriterade när ett e-postprogram som operativsystemet startar öppnar en dialogruta där hen ska fylla i SMTP-uppgifter och annat. Inte alla greppar vad som hände. Andra blir irriterade.
Vad användaren måste göra i ovanstående fall är att kopiera e-postadressen och klistra in i det e-postprogram hen använder. För den som använder kontextmenyn och väljer ”Kopiera länk” är det inga problem men många användare kopierar text genom att markera den. Att markera texten i en länk är hopplöst, pekaren går över till att bli något man klickar med och inte markera text med. Samma sak med touch-enheter, ett fingertryck triggar en länk lättare än att markera text.
Alternativet är givetvis att inte vara alltför ambitiös i viljan att försöka hjälpa användaren utan istället skriva ut e-postadressen som ren text som hen kan markera och kopiera in i till-fältet i det e-postprogram hen använder, webb-baserat eller inte. En del webbläsare, i synnerhet på touch-enheter, väljer att göra e-postadresser till en länkar ändå, men det kan vi inte påverka.
Tack för en tänkvärd kommentar! Vi jobbar just nu med en ny text om länkar till e-postadresser. Återkommer!
I koden som är ovan så är det inlagt felaktiga citattecken. Använder man koden som det står så kommer länken inte fungera eftersom det är två olika typografiska citattecken snarare än det korrekta som man använder i kod osv. Ni använder ” och ″ medan det ska vara två stycken ”.
Tack för bra kommentar!
Bättre nu?
PS. Är säkert en funktion i ert CMS som gör om detta, för nu blev mina också förvrängda. Bör finnas en funktion för att kunna klistra in kod-snuttar etc på korrekt sätt.
Skriv kommentar
Funktionen för att skriva kommentarer här kräver att du accepterar kakor. Läs mer om kakorna. Vill du inte det så kan du skicka en kommentar direkt till PTS.