Кликабельный номер телефона

Кликабельный номер телефона на сайтеПривет. Сегодня будет статья из раздела "Must have". Все очень просто. Доля мобильных интернет пользователей растет, а большинство сайтов до сих пор под них не оптимизированы.

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

Как сделать кликабельным номер телефона на сайте

На самом деле все очень просто. Когда-то давно, я рассказывал о том, как реализовать skype кнопку, при нажатии на которую, можно позвонить или перейти в чат.

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

Опять все сводится к оформлению ссылки особым образом. Например:

<a href="tel:+380950000000">+3 8095 000 00 00</a>

или:

<a href="tel:+380950000000">Позвонить нам</a>

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

Конечно же ссылка вообще не обязана быть текстовой. Можно использовать любую картинку или иконку. Попробуйте сами, это очень удобно. Но если все так просто, так почему же вы до сих пор не используете это?

А ну бегом всем менять оформление номера телефона из обычного текста на кликабельную ссылку :)

И не забудьте посмотреть статью о том, как оформлять адрес электронной почты на лендинге. А на сегодня - все. Пока.

4 комментария

  1. Дмитрий Давыдов

    Полезная тема, но. Хотелось бы поподробнее узнать про корректную запись самого номера в параметре «tel:». В примерах пишут то 12-значные номера с +3 или +1, то 11-значные с +7. А как правильно то? Например для московского номера и для 8-800..

    1. Дмитрий Давыдов

      Полный номер в международном формате, и точно будет правильно :)

  2. Дмитрий Давыдов

    Здравствуйте у меня есть картинка написанная фотошопом и надо в самом фотошопе сделать кликабельной

    1. Дмитрий Давыдов

      Привет. Ну в чем проблема? ставь картинку на фон ссылки... Но такие вещи нужно делать текстом.

Добавить комментарий

 

© 2014 — 2020, Smartlanding.biz. Все права защищены. Любое использование материалов допускается только с указанием активной ссылки на источник. Политика конфиденциальности