Требования к верстке
Верстка должна соответствовать стандарту HTML5 и быть семантической и кроссбраузерной.
Кроссбраузерность заключается в адекватном и максимально одинаковом отображении верстки во всех современных браузерах на 3 версии ниже текущего релиза.
Основная статья страницы должна быть обрамлена в тег <article>. Тег <article> должен присутствовать на странице в единственном экземпляре.
Внутри тега <article> могут использоваться только теги h1-h6, p, a, ul+, ol+, I, b, strong, em, table+, section, u, s, img, figure, figcaption. Данные теги должны быть по умолчанию стилизованы по селектору тега. Если есть несколько видов оформления одного вида тега, то более сложное оформление задается в стилях с помощью селектора класса.
Не допускается использовать теги семантической разметки текста в “не контентных” областях шаблона. Например – обрамлять логотип в <h1>, номера телефонов в <p> и т.п.
Каждый блок меню должен быть обрамлен в тег <nav>.
Блоки меню размечаются, по традиции, с помощью тегов ul>li. При этом тег ul должен быть отмечен уникальным классом, на который будут применены правила CSS.
Выбранный (по текущей странице) пункт меню, должен стилизоваться с помощью класса “selected”
В верстке должны быть логически выделены шапка и подвал и обрамлены в теги <header> и <footer> с уникальными классами.
Оформительские изображения – по максимуму должны быть в спрайтах.
Если какой-либо элемент оформления (кнопка, тень, стрелочка и п.р.) можно сверстать без использования изображений – нужно сверстать его без изображений. Если при этом оформление получается “чуть-чуть” другим – это обговаривается с дизайнером и по возможности подгоняется под “верстку без изображения”.
В начале файла стилей обязательно должен идти сброс стилей www.cssreset.com, necolas.github.io/normalize.css/ или другой (пусть даже избыточный), для приведения всех стандартных тегов к одному виду.
Не допускается использование в верстке селекторов ID (#), по возможности надо использовать только селекторы классов.
Не допускается написания стилей на пустые селекторы span и div, ul. (для ul это допускается только для стилей типографики и в блоке normalize).
Неправильно
.some_class_ex1 span{…} .some_class_ex2 div{…}
Правильно
.some_class_ex1 span.some_more_class_one{…} .some_class_ex2 div.some_more_class_two{…}
В связи с этим приветствуется верстка в соответствии с БЭМ.
Также приветствуется верстка на основе какого-либо фреймворка или его частей (Модульная сетка, cssnormalize).
Для слайдеров, галерей и прочего интерактива следует использовать готовые плагины на основе jquery, при необходимости доработанные в плане оформления.
При добавлении скриптов в верстку следует руководствоваться принципами “ненавязчивого” javascript.
Оставить комментарий