Jak oznaczyć numery telefonów?

Chcę oznaczyć numer telefonu jako link do wywołania w dokumencie HTML. Przeczytałem podejście do mikroformatów i wiem, że tel:schemat byłby standardowy, ale dosłownie nigdzie nie został wdrożony.

Definiuje Skype, o ile wiem, skype:i callto:ten ostatni po zyskała pewną popularność. Zakładam, że inne firmy mają albo inne plany, albo wskakują do callto:pociągu.

Jaka byłaby najlepsza praktyka oznaczania numeru telefonu, aby jak najwięcej osób korzystających z oprogramowania VoIP mogło po prostu kliknąć łącze, aby uzyskać połączenie?

Pytanie dodatkowe: Czy ktoś wie o komplikacjach związanych z numerami alarmowymi, takimi jak 911 w USA lub 110 w Niemczech?

Twoje zdrowie,

Aktualizacja: Microsoft NetMeeting przyjmuje callto:schematy pod WinXP. To pytanie sugeruje, że Microsoft Office Communicator będzie obsługiwał tel:schematy, ale nie callto:te. Świetnie, Redmond!

Aktualizacja 2: Dwa i pół roku później. Wydaje się, że sprowadza się do tego, co chcesz zrobić z liczbą. W kontekście mobilnym tel:jest to najlepsza droga. Kierowanie na komputery zależy od Ciebie, jeśli uważasz, że Twoimi użytkownikami jest więcej użytkowników Skype ( callto:) lub prawdopodobnie tel:zainstalujesz coś takiego jak Google Voice ( ). Moje osobiste zdanie brzmi: w razie wątpliwości użyj tel:(zgodnie z odpowiedzią @Sidnicious).

Aktualizacja 3: Użytkownik @ rybo111 zauważył, że Skype w Chrome w międzyczasie wskoczył na tel:modę. Nie mogę tego zweryfikować, ponieważ żadna maszyna nie jest pod ręką, ale jeśli to prawda, oznacza to, że w końcu mamy tutaj zwycięzcę:tel:

Program tel:ten został zastosowany pod koniec lat 90. XX wieku i udokumentowany na początku 2000 r. RFC 2806 (który został przestarzały w wyniku bardziej szczegółowego RFC 3966 w 2004 r.) I nadal jest udoskonalany . Wsparcie tel:na iPhonie nie było decyzją arbitralną.

callto:, chociaż jest obsługiwany przez Skype, nie jest standardem i należy go unikać, chyba że jest skierowany konkretnie do użytkowników Skype.

Mnie? Po prostu zacznę uwzględniać poprawnie utworzone tel:identyfikatory URI na twoich stronach (bez wąchania agenta użytkownika) i czekam, aż reszta telefonów na świecie nadąży :)

Przykład :

<a href="tel:+18475555555">1-847-555-5555</a>

Moje wyniki testu:

Dzwonić do:

• Przeglądarka Nokia: nic się nie dzieje
• Google Chrome: prosi o uruchomienie skype, aby zadzwonić pod ten numer
• Firefox: prosi o wybranie programu do połączenia z tym numerem
• IE: prosi o uruchomienie skype, aby zadzwonić pod ten numer

tel:

• Przeglądarka Nokia: działa
• Google Chrome: nic się nie dzieje
• Firefox: „Firefox nie wie, jak otworzyć ten adres URL”
• IE: nie można znaleźć adresu URL

Najlepiej jest zacząć od tel: który działa na wszystkich telefonach komórkowych

Następnie wprowadź ten kod, który będzie działał tylko na komputerze i tylko po kliknięciu łącza.

Używam http://detectmobilebrowsers.com/ do wykrywania przeglądarek mobilnych, możesz użyć dowolnej metody

if (!jQuery.browser.mobile) {
    jQuery('body').on('click', 'a[href^="tel:"]', function() {
            jQuery(this).attr('href', 
                jQuery(this).attr('href').replace(/^tel:/, 'callto:'));
    });
}

Więc w zasadzie obejmujesz wszystkie swoje bazy.

tel: działa na wszystkich telefonach, aby otworzyć dialer z numerem

callto: działa na twoim komputerze, aby połączyć się ze skype z Firefoxa, Chrome

Jak można się spodziewać, obsługa WebKit tel:obejmuje również przeglądarkę mobilną z systemem Android - FYI

Zachowuję tę odpowiedź do celów „historycznych”, ale już jej nie polecam. Zobacz odpowiedź @Sidnicious powyżej i moją aktualizację 2.

Ponieważ wygląda to na remis między callto a telem, chcę wrzucić możliwe rozwiązanie w nadziei, że wasze komentarze przywrócą mnie na światło ;-)

Korzystanie callto:, ponieważ większość klientów stacjonarnych sobie z tym poradzi:

<a href="callto:0123456789">call me</a>

Następnie, jeśli klientem jest iPhone, zamień łącza:

window.onload = function () {
  if (navigator.userAgent.match (/iPhone/i)) {
    var a = document.getElementsByTagName ("a");
    for (var i = 0; i < a.length; i++) {
      if (a[i].getAttribute ('href').search (/callto:/i) === 0) {
        a[i].setAttribute ('href', a[i].getAttribute ('href').replace (/^callto:/, "tel:"));
      }
    }
  }
};

Jakieś zastrzeżenia wobec tego rozwiązania? Czy powinienem zacząć od tel:?

Mobile Safari (iPhone i iPod Touch) korzysta ze tel:schematu.

Jak wybrać numer telefonu ze strony internetowej na iPhonie?

RFC3966 definiuje standardowy identyfikator URI IETF dla numerów telefonów, tj. Identyfikator URI „tel:”. To jest standard. Nie ma podobnego standardu, który określa „callto:”, jest to szczególna konwencja dla Skype'a na platformach, na której można zarejestrować obsługę URI w celu jej obsługi.

to działało dla mnie:

1. wykonaj link zgodny ze standardami:

        <a href="tel:1500100900">

2. zastąp go, gdy przeglądarka mobilna nie zostanie wykryta, dla skype:

$("a.phone")
    .each(function()
{ 
  this.href = this.href.replace(/^tel/, 
     "callto");
});

Wybór linku do zastąpienia przez klasę wydaje się bardziej wydajny. Oczywiście działa tylko na kotwicach z .phoneklasą.

Włączyłem tę funkcję, if( !isMobile() ) { ...aby uruchamiała się tylko po wykryciu przeglądarki pulpitu. Ale ten jest prawdopodobnie przestarzały ...

function isMobile() {
    return (
        ( navigator.userAgent.indexOf( "iPhone" ) > -1 ) ||
        ( navigator.userAgent.indexOf( "iPod" ) > -1 ) ||
        ( navigator.userAgent.indexOf( "iPad" ) > -1 ) ||
        ( navigator.userAgent.indexOf( "Android" ) > -1 ) ||
        ( navigator.userAgent.indexOf( "webOS" ) > -1 )
    );
}

Użyłem tel:do mojego projektu.

Działa w Chrome, Firefox, IE9 i 8, Chrome Mobile i mobilnej przeglądarce na moim smartfonie Sony Ericsson.

Ale callto:nie działało w przeglądarkach mobilnych.

Chciałbym użyć tel:(zgodnie z zaleceniami). Ale aby mieć lepszą rezerwę / brak wyświetlania stron błędów, użyłbym czegoś takiego (używając jquery):

// enhance tel-links
$("a[href^='tel:']").each(function() {
    var target = "call-" + this.href.replace(/[^a-z0-9]*/gi, "");
    var link = this;

    // load in iframe to supress potential errors when protocol is not available
    $("body").append("<iframe name=\"" + target + "\" style=\"display: none\"></iframe>");
    link.target = target;

    // replace tel with callto on desktop browsers for skype fallback
    if (!navigator.userAgent.match(/(mobile)/gi)) {
        link.href = link.href.replace(/^tel:/, "callto:");
    }
});

Zakłada się, że przeglądarki mobilne, które mają znaczek mobilny w ciągu użytkownikaAgent-string, obsługują tel:protokół. W pozostałej części zastępujemy łącze callto:protokołem, aby zapewnić powrót do Skype'a, jeśli jest dostępny.

Aby ukryć strony błędów dla nieobsługiwanych protokołów, odsyłacz jest kierowany do nowej ukrytej ramki iframe.

Niestety nie wydaje się możliwe sprawdzenie, czy adres URL został pomyślnie załadowany do elementu iframe. Wygląda na to, że nie są wywoływane żadne zdarzenia błędów.

Ponieważ callto:jest domyślnie obsługiwany przez skype (skonfigurowany w ustawieniach Skype), a inni też go obsługują, zalecałbym używanie callto:zamiast skype:.

Chociaż Apple zaleca tel:w swoich dokumentach Mobile Safari, obecnie (iOS 4.3) akceptuje callto:to samo. Dlatego polecam korzystanie callto:z ogólnej strony internetowej, ponieważ działa ona zarówno ze Skype, jak i iPhone'em i spodziewam się, że będzie działać również na telefonach z Androidem.

Aktualizacja (czerwiec 2013)

Nadal pozostaje kwestia decydowania o tym, co ma oferować Twoja strona internetowa. Na moich stronach internetowych udostępniam zarówno linki, jak tel:i te callto:(oznaczone jako Skype), ponieważ przeglądarki Desktop na Macu nie robią nic z tel:linkami, podczas gdy mobilny Android nie robi nic z callto:linkami. Nawet Google Chrome z wtyczką Google Talk nie reaguje na tel:linki. Mimo to wolę oferować oba łącza na pulpicie, na wypadek gdyby ktoś miał problem z uzyskaniem tel:linków do pracy na swoim komputerze.

Jeśli projekt witryny podyktowałby, że podam tylko jeden link, użyłbym tel:linku, który chciałbym zmienić callto:w przeglądarkach komputerowych.

Korzystając z jQuery, zamień wszystkie amerykańskie numery telefonów na stronie na odpowiednie callto:lub tel:schematy.

// create a hidden iframe to receive failed schemes
$('body').append('<iframe name="blackhole" style="display:none"></iframe>');

// decide which scheme to use
var scheme = (navigator.userAgent.match(/mobile/gi) ? 'tel:' : 'callto:');

// replace all on the page
$('article').each(function (i, article) {
    findAndReplaceDOMText(article, {
        find:/\b(\d\d\d-\d\d\d-\d\d\d\d)\b/g,
        replace:function (portion) {
            var a = document.createElement('a');
            a.className = 'telephone';
            a.href = scheme + portion.text.replace(/\D/g, '');
            a.textContent = portion.text;
            a.target = 'blackhole';
            return a;
        }
    });
});

Dzięki @jonas_jonas za pomysł. Wymaga doskonałej funkcji findAndReplaceDOMText .

Używam normalnego języka <a href="tel:+123456">12 34 56</a>znaczników i uniemożliwiam klikanie tych linków użytkownikom komputerów za pośrednictwempointer-events: none;

a[href^="tel:"] {
    text-decoration: none;
}
.no-touch a[href^="tel:"] {
    pointer-events: none;
    cursor: text;
}

w przeglądarkach, które nie obsługują zdarzeń wskaźnika (IE <11), można zapobiec kliknięciu za pomocą JavaScript (przykład opiera się na Modernizr i jQuery):

if(!Modernizr.touch) {
    $(document).on('click', '[href^="tel:"]', function(e) {
        e.preventDefault();
        return false;
    });
}