От автора: знающие разработчики очень часто окружают контактную информацию на своих бизнес или личных сайтах в тег address. До недавнего времени это было некорректно с технической точки зрения: тег address был создан для разметки контактной информации о человеке, ответственном за сайт.
Вчера Стив Фолкнер рассказал мне, что W3C изменили спецификацию HTML 5.2, чтобы она отражала общее понимание элемента. Тем не менее, чтобы правильно использовать элемент, нужно знать о нем пару вещей:
Основные адреса
Базовое применение тега address:
|
1 2 3 4 5 |
<address> 15 Central Park West,<br> New York, NY 10023,<br> USA </address> |
Тег address — один из случаев, за исключением стихов, когда я советую использовать тег br для форматирования текста. В остальных случаях его лучше избегать.
Тег address делает текст читаемым для человека и браузера, однако Google не совсем ясно, какой именно адрес вы используете: адрес организации или чего-то еще? Где в адресе улица, а где страна или область?
В некоторых случаях поисковики могут угадать правильную информацию на веб-странице, но я также дополнительно делаю две вещи, чтобы поисковику стало ясно:
Если вы имеете в виду физический адрес организации, зарегистрируйте ее на Google My Business.
Если речь идет о других адресах, комбинируйте микроданные и tel ссылки в разметке:
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<div vocab="//schema.org/" typeof="LocalBusiness"> <img property="image" src="//www.mokuhawaii.com/shack.jpg"/> <span property="name">Moku Hawaii Surf Shop and Surf Board Rentals</span> <address property="address" typeof="PostalAddress"> <span property="streetAddress">2446 Koa Ave,</span> <span property="addressLocality">Honolulu</span>, <span property="addressRegion">HI</span> <span property="postalCode">96815</span>, <span property="addressCountry">USA</span> </address> <a href="tel:+18089266658" property="telephone">+1 808-926-6658</a> </div> |
Также можно для еще большей совместимости добавить микроформаты.
Обратите внимание на то, что данные, введенные на Google My Business, каноничны. Они не поменяются, если на вашем сайте изменится разметка или данные. Это значит, что если вы используете оба варианта, вам нужно не забывать обновлять данные в обоих местах, если изменился адрес или контактная информация.
CSS также помогает упростить отображение контента: больше никаких тегов br!
Заключение
Новое определение тега address в спецификации выравнивает его с повседневным использованием. Однако чтобы извлечь максимальную пользу, необходимо добавить вокруг адресных данных дополнительную разметку.
Источник: //thenewcode.com/
Редакция: Команда webformyself.
