Мобильный Safari умеет различать на сайтах телефоны в окружении другого текста. Это удобно, потому что тапаешь по номеру на веб-странице – и сразу открывается окошко с предложением сделать исходящий вызов абоненту. Однако многие веб-мастера усложняют жизнь потенциальным клиентам. Давайте внесем ясность, как делать правильно.
Как надо
Запомните правило. Если вы верстаете контактную форму, то префикс +7/8, код (495) и сам номер 123-45-67 должны быть написаны единым стилем без сокращений. Вот так:
Вы можете выделять цифры цветом, увеличивать или уменьшать, но чтобы это относилось ко всему номеру одновременно.
Неправильно
Телефон дан без префикса +7/8
Когда на сайте пишут (499) 123-45-67 или (499) 1234567, то iOS предложит вам набрать номер 4991234567. По такому нельзя никуда дозвониться. Мода на убирание префиксов пришла из печатной продукции. Но там это вынужденный шаг, сам с этим сталкивался, когда верстаешь рекламный разворот крупной торговой сети с указанием всех телефонов магазинов, а контактный врез ограничен по площади. Первым делом мы резали +7 и 8, оставляя только код + номер.
Вебмастера это переняли. Однако, когда в 2009 году айфон стал различать телефонные номера на сайтах, то отсутствие префикса вело к неправильному набору.
Телефон дан картинкой
В стиле 2000-х. У некоторых веб-мастеров не хватает знаний в CSS, чтобы координаты контактной формы смотрелись во всех браузерах одинаково, поэтому контакты делают в виде картинки и заверстывают в общий макет. Вот только Safari не умеет распознавать подобные изыски. Клиент на входе в магазин получает подножку.
Код и телефон написаны разными стилями
Противоположный случай – когда верстальщик отлично владеет CSS и хочет сделать акцент на номере, оставив при этом префикс с кодом. Смотрится красиво, но айфон не поймет мотивов веб-мастера. Избегайте таких случаев.
Так же код часто пишут одним цветом, а номер другим. Тоже в топку, если хотите дружить с потенциальными клиентами, ищущих в интернете информацию о фирме прямо с телефона.
Повторюсь еще раз. ПРЕФИКС + КОД + ТЕЛЕФОН должны быть набраны вместе в едином стиле:
+7 812 987-6543 +7 (495) 1234567 8 8790 23-23-09
(5 голосов, общий рейтинг: 4.40 из 5)
🙈 Все комментарии
Форум →Поддерживаю!
+я поддерживаю!
+бесконечность! Вымораживает, когда без +7/8 указан номер:)
@Zork, Это точно. Что говорить нам, людям живущим под кодом +38 :)))))
@Наталия Чеснова, вот только +380
@AlexSmith, тогда и в России: +73, +74, +75, +78, +79. :)
@Power & Control, в РФ код страны только +7 без всяких дополнительных цифр, не путайте людей
@Brawer, нет. Первая цифра региона тоже берется в префикс (от всех этих 916, 905 и т.д. би этих 812, 495, 499 и т.д.). В Украине тогда просто +38.
В Украине цифра «0» и кодов города перекочевала в +38 и получилось +380. Веря Википедии у нас тоже, то есть как я и написал. А так да, +7.
из кода города перекочевала *
@Power & Control, Ммм.. если бы код Украины был +38, то телефонный номер +38 (124) 123-45-67 (на самом деле +381 (24) 123-45-67) должен относиться к Украине. Но он почему-то относится к Сербии и Черногории, у которой код +381. Так что ошибочка у вас.
@angorius, да нет никакой ошибки, у тебя в примере код 124, а не 024. Поэтому правильно, кмУкраине не относится. Был бы 024 было бы +38 (024) 123-45-67 , то есть +380 (24) 123-45-67. Говорю же, цифра ноль перекочевала. У Украины все коды начинались с нуля.
@Наталия Чеснова, у нас-то как раз с этим проблем нет.
Айфон спокойно наберет 044-123-45-67, к примеруб и вы позвоните куда хотели.
Люди которые далают серьёзные сайты всё это знают, а школьники эту статью не прочитают ))
@PAHAN, Школьники как-раз и прочитают. :))
+++++
+1
Авторы статьи не знают по ходу, что называется в среде разработчиков и программистов костылем)
@Jonny_Ive, расскажите нам всем.
@Jonny_Ive, фраза «первый костыль уже вставлен» в каждом примере — ещё хуже чем номер без 7-ки :)
и да, какое-то странное у них понимание «костыля»
@Jonny_Ive,
+1
это не “костыль”, а “антикостыль” получается ))
@Jonny_Ive, Вы же в курсе, что на программистах мир клином не сошёлся, правда? :)
Хотя тут, на мой взгляд, уместнее было бы выражение “палка в колёса”.
@Rezon, свет не сошёлся, свет) Сегодня день перепутанных идиом)
Если бы Apple добавила в iOS возможность редактировать номер (а не только вставлять из буфера), то было бы вдвойне хорошо.
@RayGreen, Вот это люто поддерживаю! Почему не могу допилить такой простой функционал, абсолютно непонятно!!
<a href=”tel:+74951234567″>Звоните нам</a>
Обязательно нужно указывать tel.
«Когда на сайте пишут (499) 123-45-67 или (499) 1234567, то iOS предложит вам набрать номер 4991234567.»
Когда на сайте пишут (499) 123-45-67 или (499) 1234567, хочется сначала засунуть программистам сайта руки в одно место, а потом написать в Apple с огромнейшей просьбой добавить возможность редактирования номера. Но первое больше. =D
@robert_msk, Когда люди приписывают подобные ошибки программистам, хочется засунуть мозг этих людей в одно место.
Я вам даже больше скажу, есть специальный html тег tel для того, что бы любое устройство понимало номер.
Позвони мне, позвони
Наконец-то хоть один большой ресурс прокричал об этом. Спасибо! Давно хочу оторвать руки верстальщикам, которые ставят телефоны на сайтах без префикса, обходясь только DEF.
@ChinChilla, а АВС вообще зачастую не указывают…
@ChinChilla, ресурс прокричал, да как-то криво. предложили лишь одно решение — писать полностью номер без разбиения, хотя можно обойтись верной подстановкой ссылки.
Более того, если бы подошли к вопросу грамотно, то описали бы пример, как сделать эту ссылку «устройство-зависимой», то есть, допустим, при тапе с айфона — предлагать позвонить; при клике с компа или тапе с айпада — открывать форму обратной связи и тд.
@i.band, нет уж. Может быть еще Артуру основы php тут преподавать? Статья абсолютно соответствует направлению всего сайта.
@i.band, не надо форму обратной связи, ибо мой jabber умеет набирать номер со стационарного телефона из браузера не хуже IOS :)
Истово плюсую!
Задрали уже кухонные дизайнеры.
Правила не вебмастера, но яблочника. Написание номера рассчитывают на удобное восприятие и запоминание пользователем, а не на корректную работу с одной моделью телефона, которая этот самый номер даже не может правильно воспринять.
Это как писать статью о необходимости верстки под ИЕ6.
@shmonstre, номер без префикса в международном формате – неполный. Эппл тут совсем ни при чем.
Представьте, что вы приходите в магазин и хотите купить… да тех же яблок! И на всех сортах написано: “Яблоки” – Цена 100р/кг, “Яблоки” – Цена 30р/кг, “Яблоки” – Цена 200р/кг.
Яблоки разные, но Вы не понимаете, почему эти стоят столько-то, а эти – столько-то. Сорт-то не обозначен!
@shmonstre, дело не в яблоке, сейчас почти любой телефон распознает номера, и м…ки, пишущие номера как придется, задрали…
Претензия на счёт недозваниваемых телефонных номеров должна прямиком отправиться в APPLE.
Сколько лет айфонв на рынке? Вот ровно столько лет яблочники тупят и не могут добавить в приложение ТЕЛЕФОН простейшую функцию – редактирование набранного телефонного номера с произвольной позиции, а не только последнего введенного символа.
Функция на 5 центов работы, есть в _любом_ андройде, есть в нокии и ещё мильёне телефонов.
В айфоне – нет!
Я уже писал в саппорт APPLE, присоединяйтесь, напишите и вы.
Дизайнеров всех не исправить но облегчить себе жизнь можно попробовать.
@max_im_50, Молодцом!
О да! Слава богу хоть кто-то заговорил об этом громко! :))))
Артур Малосиев, прекрасная заметка. Один большой минус – везде в тексте разные телефоны. А ведь мог быть один, но нужный рекламодателю ;)
@A1eksey, :D :) телефон саппорта APPLE !
@max_im_50, хотя бы :)
присоединюсь к комментаторам, рекомендующим ссылку tel:
это гораздо правильнее, чем уродовать дизайн сайта совершенно ненужными “плюс семь”
Chrome сам добавляет +7/8 по крайней мере на android
Это на хабре надо написать и закрепить наверху ;)
Артур, пропустили слово “отсутствие”:
“…когда в 2009 году айфон стал различать телефонные номера на сайтах, то ОТСУТСТВИЕ префикса…”
Вроде банально, но имеет место быть. Когда сталкиваешся, то весьма неудобно его копировать и дописывать
Мне идея писать восьмерку не нравится. Тогда нельзя позвонить, находясь в другой стране. А в остальном – полностью поддерживаю.
Хороший, годный совет.
Мне нравится, как вы относитесь к деталям.
Спасибо.
+1000 очень нужно! бесит когда не правильно написан номер! тупо не звоню, ищу других….
Хорошие ребята пишут джаваскрипт, который сам подставляет tel:+7 в код, только на Айфоне и только когда надо.
@vanyaklimenko, а ещё хорошие ребята подчёркивают ссылки.
Спасибо Артуру, исправили у себя!
А то как то такие мелочи пропустили, ибо думали про восприятие человека номера тлф, а не ипхона, но всетаки ипхон перевесил, сделали 8 (ХХХ) ХХХ-ХХ-ХХ, а было 8-ХХХ-ХХХ-ХХ-ХХ. Протестили через сафари, действительно, номер тогда подчеркивается и набирается без проблем.
@iPhone5XXXL, Вообще-то есть российский стандарт: +N (NNN) NNN-NN-NN. Если бы все следовали ему, никаких трудностей бы не было.
@SSDDRR, ага, проходили уже -звонят и спашивают-А где плюсик (+) на мобиле найти!? Отсюда и отказались от +7 в пользу 8ки.
@iPhone5XXXL, Это не шутка? Вот дураки же бывают…
@iPhone5XXXL, Префикс “8” это неверно, так как в разных странах выход на междугороднюю и международную связь осуществляется через разные префиксы. Поэтому надо просто давать абсолютный номер “+N (NNN) NNN-NN-NN”.
@SSDDRR, +7 как международная связь, но нам этого не надо, только РФ, а у нас 8мь.
@iPhone5XXXL, в том виде, в котором вы сделали (со скобками), восприятие номера еще лучше.
Извините, но яблоку пора бы вставить в софт функцию набора номера “изменить и вызвать” , эта функция есть во многих телефонах.
молодца +1
Ну наконец-то кто-то написал про эту тему! Давно пора. Владельцам сайтов, особенно коммерческих, пора понять, что телефоны на сайте должны быть указаны так, чтобы сразу можно было звонить по клику. Действительно, очень неудобно и злит, когда этого нет. И очень комфортно, когда есть.
Поддерживаю. Не раз материл таких верстальщиков, а писать им время тратить – тоже не хочется, проще новый сайт открыть)
А ещё можно почитать документацию:
https://developer.apple.com/library/ios/featuredarticles/iPhoneURLScheme_Reference/Introduction/Introduction.html
и использовать какие угодно стили.
@nopox, спасибо за полезную ссылку
Потому, что первый костыль уже вставлен.
Впервые встретился с этой проблемой в 2007 г на своем сайте ))
Удивительно, но на многих сайтах проблема до сих пор актуальна!
Несколько компаний вот так и потеряли меня как клиента.
Артур, спасибо! Поправили =)
Давно уже всем заказчикам говорю, что код +. обязателен даже в наружке
У кого руки с головой не из ЖО растут, те уже давно в теме.
Да это не только в России, у нас с +61 тоже все тяжко :(
+++автору) на днях жене говорил, бесит что с половино сайтов фиг позвонишь! Приходилось все в заметки копировать!
Артур, как вы думаете, силами айфонс-ру :) можно донести коллективную просьбу в Apple: “допилите пожалуйста телефонные функции, добавьте редактирование набранного номера”?
Благое дело ждёт своих героев :) .
Российский офис Apple нас может и читает, а вот там, в Купертино – вряд ли :) Максимум – Ирландия.
В Российский офис, в Ирландский, в Купертино, хоть в спортлото написать! Шестой айфон не за горами а крошечную функцию добавить не могут.
Замечу, у нас культура деловой переписки от вэб-дизайна ушла недалеко. В почте телефоны тоже пишут как попало.
Я часто на кривое написание номера натыкаюсь, а народ у нас сидит в основном на андройде, специально проверил – у всех есть редактирование номера! Доколе?! :)
Когда телефон указан на сайте без +7, приходится жать вызов, потом сброс, заходить в список вызовов, оттуда номер добавлять в контакты, а там уже с помощью редактирования добавлять +7 и звонить. Как вариант можно запомнить номер и набрать вручную, что тоже жутко неудобно :)
Отличная заметка!
Однако как бесит такое кривое написание номеров на сайтах, также бесит и отсутствие возможности редактирования телефона при наборе!
Я тут с удивлением обнаружил, что если телефон указан без + но с префиксом всё равботает нормально. Айфон сам подставляет плюс.
То есть номер 74951234567 кликабелен и набираем.
iOS 6.0.1
При звонке в какую-нибудь организацию иногда возникает необходимость сразу набрать основной и добавочный номер. Эта функция реализована на iPhone, правда, хорошо спрятана от посторонних глаз. После набора основного номера нажмите звёздочку (*) на несколько секунд, пока в поле набора номера не появится запятая. После неё вводите добавочный номер.
Кстати, запятых в номере может быть несколько подряд – каждая из них добавляет двухсекундную паузу при наборе номера.
Если на сайте стоит скрипт против копирования текста, то номера не кликабельны вовсе.
А как оформить последовательность цифр на сайте так, чтобы айфон не распознавал их как номер телефона?
@Sergey Gernichenko, наверное надо копать в сторону атрибута rel
вообще если сделать телефон в виде ссылки (a href=””…), то можно хоть картинкой вставлять, главное в href атрибуте прописать tel:8495999999, а саму ссылку можно стилизовать как душа пожелает
Нашли орфографическую ошибку в новости?
Выделите ее мышью и нажмите Ctrl+Enter.Как установить аватар в комментариях?
Ответ вот здесьСтираем пароль разблокировки iPhone
Как установить ограничение времени работы iPhone и iPad
Как изменить свой аватар из Gmail на iPhone
Как активировать FaceTime, находясь за границей?
Как на iPhone включить режим съемки Action Mode. Зачем нужен этот режим
Не получается оплатить покупку через Apple Pay
Как настроить дублирование уведомлений на iPhone и Apple Watch
Почему на iPhone не отправляются СМС и сообщения iMessage