—»     —»   Ссылки на телефонные номера при помощи HTML5
  Раздел: Tips and Tricks   Комментариев: 4  

Ссылки на телефонные номера при помощи HTML5



Обычно телефонные номера добавляются на страницу сайта в виде простого статичного текста, и это не дает пользователям возможности взаимодействовать с этим элементом. Так как все больше и больше людей начинают пользоваться интернетом при помощи мобильного телефона, пришло время поменять обычные цифры на сайте на кликабельные области, которые позволили бы посетителям набирать номер простым нажатием по нему на странице.

Ссылки на телефонные номера при помощи HTML5

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

Посредством этого нового свойства вы можете публиковать телефонные номера в виде ссылок, чтобы набирать их можно было одним нажатием!

Чтобы позволить вашим посетителям связаться с вами прямо с той страницы, где они увидели ваш контактный email, то в параметре ссылки href нужно просто прописать Mailto:.

<a href="mailto:example@example.com">Example Email</a>

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

Для того чтобы кликать можно было и по телефонным номерам и тут же набирать их, вы можете использовать атрибут tel: .

<a href="tel:01234567890">01234 567 890</a>

В результате этого вы получите кликабельные телефонные номера вместо простого статичного текста.

Открываем телефонный номер в Skype

Для того чтобы ссылка открывалась в Skype, вам нужно будет изменить атрибут tel: на callto: .

<a href="callto:01234567890">01234 567 890</a>
Обнаружили ошибку или мёртвую ссылку?
Выделите проблемный фрагмент мышкой и нажмите CTRL+ENTER.
В появившемся окне опишите проблему и отправьте уведомление Администрации ресурса.
Нужна органическая вечная ссылка из данной статьи? Постовой?
Подробности здесь
Вам понравился материал? Поблагодарить легко!
Будем весьма признательны, если поделитесь этой статьей в социальных сетях:

Ключевые тэги: HTML 5, мобильные телефоны
Опубликовал Design FactoRy   Прочитано (раз): 45903   |   Оставлено комментариев: 4
Автор перевода — CoolWebmasters.Com ©   |   Источник материала / оригинал статьи   Распечатать
Другие статьи и новости по теме:
Комментарий #1: 6 декабря 2012 @ 05:42
Написал: GregMD — группа: Гости  
На сайте с: --   |   Публикаций: 0   |   Комментариев: 0
ICQ: --- не указано ---
неплохо, только в конце статьи необходимо сказать, что программы выдёргивающие инфу с сайтов для спам-ботов только обрадуются этой точно отмеченной информации, что сильно вредно, имхо.
Комментарий #2: 9 сентября 2014 @ 16:38
Написал: Serrgey — группа: Гости  
На сайте с: --   |   Публикаций: 0   |   Комментариев: 0
ICQ: --- не указано ---
Спасибо. То что искал. И не нужно никакого php Java.
Комментарий #3: 24 октября 2016 @ 17:01
Написал: Александр Александрович — группа: Гости  
На сайте с: --   |   Публикаций: 0   |   Комментариев: 0
ICQ: --- не указано ---
В хроме не работает (
С какой то версии отключили запуск сторонних программ, хотя в лисе - все отлично.
Комментарий #4: 25 марта 2017 @ 09:17
Написал: Евгений — группа: Гости  
На сайте с: --   |   Публикаций: 0   |   Комментариев: 0
ICQ: --- не указано ---
Все работает. Спасибо
Добавление комментария
Уважаемые пользователи!
При добавлении комментариев на сайт Вам следует учитывать следующее - все комментарии проверяются Администрацией на предмет отсутствия спама. При обнаружении признаков спама, в оставленном Вами комментарии, сам комментарий будет незамедлительно удалён, а Ваш IP-адрес будет забанен без предупреждения! Учётные записи пользователей, рассылающих спам, блокируются/удаляются без права последующего восстановления.

С уважением, Администрация сайта.
* = поля обязательны к заполнению
Полужирный Наклонный текст Подчеркнутый текст Зачеркнутый текст | Выравнивание по левому краю По центру Выравнивание по правому краю | Вставка смайликов Выбор цвета | Скрытый текст Вставка цитаты Преобразовать выбранный текст из транслитерации в кириллицу Вставка спойлера
Вопрос : Назовите месяц January по-русски
Подтверждение кода безопасности :

Включите эту картинку для отображения кода безопасности
обновить, если не виден код


Популярные публикации


















Свежие шаблоны сайтов каждый день
С миру по нитке
«    Июнь 2017    »
ПнВтСрЧтПтСбВс
 1234
567891011
12131415161718
19202122232425
2627282930