Модульно-сеточный веб дизайн BAUWEB (5,0,0) (grid-based design)

Модульная сеточная система обычно состоит из 3-х основных элементов:

– колонки (columns): вертикальные секции в которых располагается контент. 12 колоночная система – это наиболее используемая система в веб дизайне, обеспечивающая гибкое разделение пространства на комбинации из 2, 3, 4, 6, или 12 единиц.
– пространство между колонками (gutters): постоянное пространство между колонками и строками, обеспечивающие визуальное разделение сток и колонок, предупреждая коллизию элементов.
– отступы (margins): пространство вокруг границ разметки, обрамляющих дизайн.

Преимущества дизайна на основе модульной сетки

– согласованность: модульная сетка создаёт однородность пользовательского опыта взаимодействия пользователя (UX) от страницы к странице сайта, представляя контент собранным и единородным.
– визуальная иерархия: используя структурированный фреймворк дизайнеры могут создать понятный визуальный порядок направляя взор пользователя к наиболее важной информации.
– эффективность: сеточная модель даёт фреймворк для работы дизайнеров и разработчиков для увеличения скорости их работы и обеспечивая более быстрые обновления технологии фреймворка.
отзывчивость: современные модульные сеточные системы CSS Grid и Bootstrap являются основой для отзывчивого дизайна, позволяя разметки изящно адаптироваться к различным размерам экранов с поддержкой своей структуры.