Требования к дизайну сайта 2023, макеты сайтов
Все исследования показывают (вот, например, такое ), что 94% пользователей первоначально обращают внимание на дизайн сайта. Речь идет не только об эстетике и правильном цветом решение, но и о читаемости сайта. Кривая верстка делает сайт не только неудобным, но и нечитаемым. Пользователь уйдет с сайта, на котором съехали текстовые блоки или обрезались условия акции. В этой статье разбираем, какие есть виды верстки и требования к ней, чтобы сайт «не уплыл».
Блочная верстка. Современный вид верстки, в котором информация поделена на блоки, заключенные в прямоугольник или квадрат. Визуально пользователю удобнее воспринимать такую верстку. Смысл любого блочного сайта в том, что в редакторе создается разметка главных блоков сайта — шапка, подвал, боковая часть, основной контент. Где каждая часть страницы помещается в свой блок с определенным тегом, например, меню во второй, контент в третий и так далее. Удобно, что можно быстро изменить расположение объектов, цвет, высоту, изменить отступы. Из минусов: каждой части страницы нужен определенный тег.
Резиновая верстка . Благодаря этой верстке сайт может растягиваться и сжиматься в зависимости от размеров экрана. Применяют для сайтов, которые должны хорошо просматриваться с любых устройств, без использования адаптивной верстки. Суть в том, что размеры всех элементов сайта задаются в процентах, то есть верстка будет хорошо смотреться на разных экранах. Из минусов: если сайт сильно сжался, какие-то элементы могут быть нечитаемыми.
Доступность . Речь идет про хорошо читаемый сайт для людей с ограниченными возможностями: физическими (нарушение зрения, слуха и т.д) или техническими (слабый интернет). Прежде чем запускать сайт убедитесь, что шапка, подвал, меню находятся в нужном месте, все блоки последовательные и удобные в использовании, страницы сайта не переполнены текстом, чтобы попасть на сайт не нужно выполнять сложные действия, например, регистрацию. Подробнее ознакомиться с правилами можно в документе W3C рекомендации по доступности веб-контента .