Как помечать номера телефонов?

Я хочу пометить номер телефона как вызываемую ссылку в документе HTML. Я прочитал подход к микроформатам и знаю, что tel:схема будет стандартной, но буквально нигде не реализована.

Skype определяет, насколько я знаю, skype:и callto:, последний получив некоторую популярность. Я предполагаю, что у других компаний есть или другие схемы или прыгать на callto:поезд.

Что было бы лучше всего пометить телефонным номером, чтобы как можно больше людей с программным обеспечением VoIP могли просто щелкнуть ссылку, чтобы получить звонок?

Дополнительный вопрос: кто-нибудь знает об осложнениях с номерами экстренных служб, такими как 911 в США или 110 в Германии?

Ура,

Обновление: Microsoft NetMeeting принимает callto:схемы под WinXP. Этот вопрос говорит о том, что Microsoft Office Communicator будет обрабатывать tel:схемы, но не схемы callto:. Отлично, Редмонд!

Обновление 2: два с половиной года спустя. Кажется, все сводится к тому, что вы хотите сделать с номером. В мобильном контексте tel:это путь. Ориентация на десктопы зависит от вас, если вы считаете, что ваши пользователи больше относятся к Skype ( callto:) или, скорее всего, установят что-то вроде Google Voice ( tel:). Мое личное мнение tel:таково , когда сомневаешься использовать (в соответствии с ответом @Sidnicious).

Обновление 3: Пользователь @ rybo111 отметил, что Skype в Chrome тем временем вскочил на tel:подножку. Я не могу проверить это, потому что нет машины с обоими под рукой, но если это правда, это означает, что у нас наконец есть победитель:tel:

tel:Схема была использована в конце 1990 - х годов и задокументированы в начале 2000 года с RFC 2806 (который был устаревающие более-основательной RFC 3966 в 2004 году) и продолжает совершенствоваться . Поддержка tel:на iPhone не была произвольным решением.

callto:Хотя он поддерживается Skype, он не является стандартным и его следует избегать, если он не предназначен специально для пользователей Skype.

Меня? Я просто начал бы включать правильно сформированные tel:URI на ваших страницах (без прослушивания пользовательского агента) и подождать, пока остальные телефоны мира догонят :).

Пример :

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

Результаты моего теста:

позвонить:

• Браузер Nokia: ничего не происходит
• Google Chrome: просит запустить скайп, чтобы позвонить по номеру
• Firefox: просит выбрать программу для вызова номера
• IE: просит запустить Skype для вызова номера

тел:

• Браузер Nokia: работает
• Google Chrome: ничего не происходит
• Firefox: «Firefox не знает, как открыть этот URL»
• IE: не удалось найти URL

Лучше всего начать с тел: который работает на всех мобильных телефонах.

Затем вставьте этот код, который будет запускаться только на рабочем столе и только при нажатии на ссылку.

Я использую http://detectmobilebrowsers.com/ для определения мобильных браузеров, вы можете использовать любой метод, который вы предпочитаете

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

Таким образом, в основном вы охватываете все свои базы.

тел: работает на всех телефонах, чтобы открыть звонилку с номером

Callto: работает на вашем компьютере, чтобы подключиться к Skype из Firefox, Chrome

Как и следовало ожидать, поддержка WebKit tel:распространяется и на мобильный браузер Android - FYI

Я держу этот ответ для «исторических» целей, но больше не рекомендую его. Смотрите ответ @Sidnicious выше и мое обновление 2.

Так как это похоже на ничью между парнями из callto и tel, я хочу добавить возможное решение в надежде, что ваши комментарии вернут меня на путь света ;-)

Использование callto:, так как большинство настольных клиентов будут обрабатывать это:

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

Затем, если клиент iPhone, замените ссылки:

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:"));
      }
    }
  }
};

Есть ли возражения против этого решения? Должен ли я лучше начать с tel:?

Mobile Safari (iPhone & iPod Touch) использует tel:схему.

Как набрать номер телефона с веб-страницы на iPhone?

RFC3966 определяет стандартный URI IETF для телефонных номеров, то есть URI «tel:». Это стандарт. Нет аналогичного стандарта, определяющего «callto:», это конкретное соглашение для Skype на платформах, где можно зарегистрировать обработчик URI для его поддержки.

это сработало для меня:

1. сделать ссылку, соответствующую стандартам:

        <a href="tel:1500100900">

2. заменить его, когда мобильный браузер не обнаружен, для Skype:

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

Выбор ссылки для замены через класс кажется более эффективным. Конечно, это работает только на якоря с .phoneклассом.

Я включил его в функцию, if( !isMobile() ) { ...поэтому он срабатывает только при обнаружении браузера на рабочем столе. Но этот, вероятно, устарел ...

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 )
    );
}

Я использовал tel:для своего проекта.

Он работал в Chrome, Firefox, IE9 & 8, Chrome Mobile и мобильном браузере на моем смартфоне Sony Ericsson.

Но callto:не работал в мобильных браузерах.

Я бы использовал tel:(как рекомендовано). Но чтобы иметь лучший запасной вариант / не отображать страницы ошибок, я бы использовал что-то вроде этого (используя 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:");
    }
});

Предполагается, что мобильные браузеры, имеющие мобильный штамп в строке userAgent, поддерживают tel:протокол. В остальном мы заменим ссылку на callto:протокол, чтобы иметь запасной вариант в Skype, где это возможно.

Чтобы подавить страницы ошибок для неподдерживаемых протоколов, ссылка нацелена на новый скрытый фрейм.

К сожалению, не представляется возможным проверить, был ли URL успешно загружен в iframe. Кажется, что никаких событий ошибки не происходит.

Поскольку callto:по умолчанию поддерживается Skype (настроен в настройках Skype), и другие также поддерживают его, я бы рекомендовал использовать callto:вместо skype:.

Хотя Apple рекомендует tel:в своих документах для Mobile Safari, в настоящее время (iOS 4.3) он принимает callto:то же самое. Поэтому я рекомендую использовать callto:общий веб-сайт, так как он работает как со Skype, так и с iPhone, и я ожидаю, что он будет работать и на телефонах Android.

Обновление (июнь 2013 г.)

Это все еще вопрос решения, что вы хотите, чтобы ваша веб-страница предлагала. На своих сайтах я предоставляю tel:и callto:ссылки, и ссылки (последние помечены как Skype), так как настольные браузеры на Mac ничего не делают со tel:ссылками, а мобильный Android ничего не делает со callto:ссылками. Даже Google Chrome с плагином Google Talk не отвечает на tel:ссылки. Тем не менее, я предпочитаю предлагать обе ссылки на рабочем столе на случай, если кто-то столкнулся с проблемой заставить tel:ссылки работать на своем компьютере.

Если бы дизайн сайта требовал, чтобы я указывал только одну ссылку, я бы использовал tel:ссылку, которую я бы попытался изменить в callto:браузерах настольных компьютеров.

Используя jQuery, замените все номера телефонов США на странице соответствующими callto:или tel:схемами.

// 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;
        }
    });
});

Спасибо @jonas_jonas за идею. Требуется отличная функция findAndReplaceDOMText .

Я использую обычную <a href="tel:+123456">12 34 56</a>разметку и делаю эти ссылки недоступными для пользователей настольных ПК черезpointer-events: none;

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

для браузеров, которые не поддерживают события указателя (IE <11), щелчок можно предотвратить с помощью JavaScript (пример опирается на Modernizr и jQuery):

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