Приемлемое отображение и доступность всех функциональных элементов при отключении пользователем JavaScript и/или картинок, а также при увеличении/уменьшении шрифта (в том числе не блокировать изменение шрифта).

а) Код должен быть семантически корректным.

б) Документ должен успешно проходить валидацию, корректно отображаться в большинстве современных браузеров. Использование хаков крайне нежелательно, но допустимо. После проверок поместить иконку валидности.

в) Верстка должна быть идентична дизайну на браузерах: Internet Explorer (от 6-го и выше), Opera (от 7-го и выше), Mozilla Firefox (от 1.5 и выше) , Chrome, Safari.

г) Все стили должны быть прописаны во внешних файлах.

д) Верстка должна быть «резиновая», то есть тянется по всей ширине экрана..

е) Полностью блочная вёрстка структуры предпочтительна, гибридная допустима.

ж) Использование «распорок» недопустимо.

з) Иерархию кода нужно выделять табуляцией и пустыми строками.

и) Все элементы должны быть закрытыми. Теги, не имеющие закрывающего тега, завершаются «/». Например:

, . Тег закрывается .

к) Недопустим «перехлёст» тегов. Например:

л) Недопустимо «разрывать» теги:

src="..." alt="..." />

Большие участки контента в коде можно не переносить.

м) Из повторяющихся однообразных участков кода в блокe достаточно сверстать только первый и размножить его для проверки корректного заполнения контейнера. В примере достаточно сверстать и размножить строку «Daimler»:

Если присутствует текст, нужно проверить на корректное поведение большого его объёма.

н) Значения атрибутов нужно заключать в кавычки.

о) Формат кавычек, в тегах: "..." (двойные), в русском тексте: «...» (ёлочка), в скриптах: '...' (одиночные). Допустимо экранирование.

п) Ссылкам нужно прописывать атрибуты href="/" и title="/".

р) Всем изображениям нужно прописывать атрибут alt. Если изображение не является ключевым, например, элементом навигации, значение атрибута нужно делать пустым.

с) Формат имён: причастиеПрилагательныеСуществительное, англ. язык (используйте словарь), без транслита. Слова выделяются заглавными буквами, первый символ всегда строчная буква. Пример: shortNews, mainMenu.

т) Областям с фоновым изображением нужно устанавливать соответствующий цвет фона, чтобы информация на переднем плане была различима без подгруженного изображения.

и) Изображения размещаются в директории img/. Порядок формирования имён указан выше.

к) При необходимости разместить скрипты или описания стилей, делать это нужно или подключаемыми файлами, или используя CDATA:

... unescaped script content ...

]]>


CSS Стили

o Всё оформление нужно выносить в описания стилей. Использоввание атрибута style нежелательно. Использование атрибутов vspace, align, cellpadding, cellspacing, border, width, height и им подобных недопустимо.

o Таблицы стилей размещаются в директории css/. Основные таблицы стилей именуются css/init.css, css/web.css, css/print.css.

o Обязательно использование обнуляющих CSS.

o Селекторы сортируются по алфавиту без участия точек и решеток, группы селекторов разделяются пустыми строками. Описание селектора { ... } отделяется табуляцией и размещается в одной строке. Свойства, по возможности, нужно также располагать по алфавиту.

o Имена селекторов должны быть зависимыми от содержимого блока, а не от оформления, формы или относительного расположения. Например, неправильно: redParrot, greenSearchBox, bottomPart; правильно: bullet, quickSearch, footer.

o Иерархия блоков и элементов блока должна поддерживаться иерархией селекторов. Пример ниже:

.news { ... }

.news .body { ... }

.news .date { ... }

.news h1 { ... }

o Нежелательно «клонирование имён», например для news: newsDate, newsHead, newsBody.

o Назначение тегу нескольких классов предпочтительнее «обёрток» и клонирования имён. Пример:

.person { ... }

.gone { color:#aaa; }

.present { color:#222; }

o Предпочтительно группировать значения свойств, например: margin:10px 5px 0px 5px; вместо margin-bottom:5px; margin-left:5px; margin-top:10px;.

o У любого размерного значения, в том числе равного нулю, указание единиц измерения обязательно.

o Предпочтительны относительные единицы измерения.

o Последнее свойство в описании класса должно завершаться точкой с запятой.

o Порядок модификаторов для ссылок: link, visited, hover, active (love-hate)