В этой статье приведен список критериев, которые дают оценку качества вёрстки сайта. Применение этих правил является гарантией для наших клиентов, что после завершения web разработки сайта, не возникнет проблем с его продвижением по причине качества верстки. Наше детальное Тех. Задание описывает все характерные требования к макету сайта, которые мы реализуем в процессе верстки сайта.
Профессиональная верстка, как правило, ограничивает буйство фантазии и экспериментаторский дух, она предполагает строгий свод правил, соблюдение которых и дает качество: сайт css html, который не исключает восхищение и радость от красивого html-макета.
Недопустимые ошибки в верстке сайта
- Ошибки, допущенные при верстке могут вызывать проблемы у пользователей сайта;
- Некачественная верстка может негативно влиять на SEO;
- Затруднять масштабирование и дальнейшую поддержку сайта
Вас также могут заинтересовать эти публикации:
- Правила верстки: адаптивная, блочная, css верстка
- Разработка сайтов – особенности дизайна и принципы верстки
- Создание современных сайтов: CSS верстка
Базовые критерии верстки макета
- Выполнение HTML-разметки на всех страницах и элементах на страницах. Страницы свёрстаны полностью с использованием HTML-разметки.
- Один файл стилей CSS на все страницы (если с учётом normalize.css, то можно два).
- Кроссбраузерность: вёрстка имеет одинаковое отображение в последних версиях основных браузеров: Firefox, Chrome, Safari, Opera, и в Internet Explorer 10+.
- Сайт должен корректно выглядеть на минимальном разрешении для данного макета:
- При большем разрешении экрана он должен быть по центру, без горизонтального скролла.
- На маленьких экранах, которые менее ширины макета, качественная вёрстка меняет свою структуру, но при этом вся информация корректно отображается в видимой части экрана.
- В корне документа обязательно должны быть папки img, css, js или идентичные.
- Главная стр. имеет имя вида: index.html. В именах и расширениях файлов отсутствуют заглавные буквы и пробелы.
- Одинаковое форматирование и написание кода в CSS, HTML и JavaScript.
- Исключение грубых ошибок в разметке:
- Ссылки оформлены не с тегом <a>, а с другими тегами.
- Абзацы оформляются тегами <р><р>, а не <br><br>.
- Применение строчных элементов при создании крупных (сеточных) блоков.
- Категорически нельзя строить сетку при помощи таблиц и позиционирования (не с использованием display: table, а именно при помощи таблиц)
- Нельзя применять в CSS !important .
- При заполнении контентом, элементы всех страниц быть как в макете:
- Допустимо различие в 5 пикс. по высоте и 2 пикс по ширине.
- Допустимо различие в отображении шрифтов, связанное с различными платформами.
- При верстке должны быть подключены такие шрифты, которые соответствуют макету и ТЗ.
- Используется правильный формат для изображений: (JPEG - для фото, всё остальное - в формате PNG)
- Отсутствие грубых ошибок валидности.
В этой статье изложены только основные критерии качественной web разработки и верстки сайта, которые мы соблюдаем в обязательном порядке и проверяем их исполнение перед передачей сайта клиенту. В следующей статье Правила верстки: адаптивная, блочная, css верстка, мы расскажем о дополнительных критериях, которые весьма желательно выполнить для обеспечения 100% гарантии качества.
04.01.2018