SEO / Семантическая верстка
Код, облегчающий жизнь поисковикам и инвалидам
Виды семантической верстки
- Атрибут alt + нормальные названия у картинок
- Нормальные ссылки, а не "тут", "вот"
- Семантические теги - обеспечивают доступность
- Schema.org - стандарт для описания сущностей в виде html-атрибутов
- JSON-LD - описание стандарта Schema.org в виде json
- Микроформаты (hCard, hRecipe) - альтернатива Schema.org
- OpenGraph - метаданные, отображаемые при публикации в соц-сетях / почте
Schema.org
- Добавляя
itemscope
, мы тем самым обозначаем, что HTML-код, содержащийся в блоке<div>...</div>
, описывает некоторую сущность. - Пока мы только объявили, что речь идет о какой-то сущности, но не сообщили, что это за сущность. Чтобы указать тип
сущности, добавим атрибут
itemtype
сразу послеitemscope
. - Чтобы отметить свойства сущности, используется атрибут
itemprop
. Например, чтобы указать режиссера фильма, добавим атрибутitemprop="director"
к HTML-тегу, содержащему режиссера. - Иногда значение свойства может само являться сущностью, с собственным набором свойств. Чтобы указать, что значение
свойства представляет собой сущность, необходимо добавить атрибут
itemscope
сразу после соответствующегоitemprop
.