Требования к HTML
HTML разметка всех страниц сайта (без каких либо исключений) должна соответствовать следующим требованиям:
Соответствие стандартам
HTML разметка должна соответсвовать требованиям W3 и проходить валидацию
Корректное применение тэгов
- Для заголовков используются только тэги h# с их иерархической вложенностью. Тэг H1 может использоваться только один раз на странице для главных заголовков
- Все длинные тексты (абзац и более) оформляются с использоанием p
- Все списки, перечни и элементы, имеющзие признаки списков оформляются тэгами ul, ol и т.д.
- Все изображения должны иметь тэги alt и title
- Ссылки на все сторонние ресурсы с применением тэга a href должны открываться в отдельном окне и иметь атрибут rel nofollow
- Для блоков в любой стилизации используются div
- Для стилизации отдельный частей текста используется span
- Вся html разметка строится исключительно через bootstrap: контейнеры, строки, колонки и т.д.
- Если какой-то элемент имеется в библиотеке Bootstrap, он должен быть сделан через Bootstrap
- Если требуется изменить внешнее оформление элементов, которые предусмотрены в Bootstrap, это нужно делать наследованием классов css с добавлением новых свойств и переопределением старых
- Допускатеся структурирование и стилизация элементов “с нуля”, только если для них нет аналогов в Bootstrap
Адаптивная верстка
Адаптивная верстка и разумное масштабирование и стилизация всех элементов на разных устройствах (PC, планшеты, телефоны).
Частные примеры данного требования:
- На PC в ряд выстроены 4 изображения. Если на мобилных устройствах изображения, выстроенные по одному в ряд, смотрятся слишком крупно, то необходимо изменить отображение на 2 в ряд.
- Если блоки А Б С, расположенные в одну линию на PC, на мобильных устройствах не умещаются или смотрятся слишком мелко, то в этом случае необходимо разместить их друг по другом, либо разработать иную форму представления блока на мобильных устройствах.
- Если шрифты и заголовки на мобильных устройствах смотрятся слишком крупно, то необходимо определить особые размеры шрифтов для мобильных устройств
Микроразметка
Следующие сущности в обязательном порядке должны содержать разметку schema и og:
- организация (название, адрес, время работы, контактная информация)
- новости и публикации
- категории товаров
- товары
Микроразметка должна успешно проходить валидацию и представить структурированные данные с сохранением логики и иерархии.
JS код в HTML
Вставки js скриптов в разметку html запрещены в любом виде.
Структура
Обязательное наличие метатэгов:
- title
- description
- keywords
- микроразметки, для страниц, в которых есть микроразметка
CSS стили определяются вначале страниц объединяются и минифицируются
JS определяются в конце страницы, объединяются и минифицируются. Внешние js библиотеки загружаются асинхронно
Верхняя постоянная навигационная часть оформляется в тэг <header></header>
Нижняя постоянна часть оформляется в тэг <footer></footer>