UX-FEED
Почему современные сайты состоят из блоков?
Современные сайты состоят из следующих блоков: хэддер (шапка сайта), футер (подвал сайта), левый и правый сайдбар, и основной блок - контент, который также может состоять из информационных блоков. Почему блочная структура стала основой для современных веб-ресурсов? Чем это обосновано? И нужно ли придерживаться блочной структуры при проектировании дизайна сайтов?
Информация в блоках легче воспринимается людьми
Переработка графической информации осуществляется не произвольно, а по заданным законам психических процессов человека. Эти законы основаны на принципах эмоционального, функционального и физиологического соответствия. Данные принципы подтверждают тот факт, что люди лучше всего воспринимают информацию на экране, если она имеет определенную структуру и поделена на смысловые блоки.
В сети люди не читают текст, а сканируют страницу в целом. При этом фиксация взглядов показала, что пользователей привлекает выделенный с помощью различных приемов контент. Отдельные смысловые блоки, абзацы, маркированные списки притягивали больше внимания, нежели сплошной текст.
Если страница разделена на отдельные блоки, которые снабжены привлекающими внимание элементами, то пользователь будет просматривать (сканировать) страницу, фиксируя взгляд именно на отдельных паттернах.
Блоки на сайте являются отдельными элементами дизайна. При настройке адаптивности автономность каждого блока позволит менять размер блока под размеры дисплея.
Разделение контента на блоки повышает удобство использования веб-страницы на 47% за счет улучшения читабельности и понятности представления текста.
Преимущества блочной структуры сайтов
Люди воспринимают графическую информацию порционно, блоками. Это происходит на интуитивном уровне. Пользователи в сети изучают контент тоже блоками. Так быстрее и легче можно просмотреть больше информации и найти нужную.
Блочная структура дизайна позволяет эффективно настроить адаптивные версии сайта. При этом логические связи макета не будут нарушены.
Резюме
Блочная структура стала основой для проектирования современных сайтов по двум основным причинам:

► пользователям удобнее изучать отдельные элементы на странице в виде блоков текста или блоков навигации;

► блочная структура значительно упрощает процесс настройки адаптивности сайта под различные размеры экранов.

Поэтому, при проектировании дизайна сайтов целесообразно придерживаться именно блочной структуры.
Создание дизайна на основе блоков позволяет эффективно настроить отображение сайта на экранах различных устройств без потери логических связей, которые есть на десктопной версии. Более того, отдельные блоки масштабируются при настройке адаптивности, что помогает пользователям мобильных устройств удобно изучить весь представленный контент.
ПОДЕЛИТЬСЯ МАТЕРИАЛОМ
ХОЧЕШЬ ПОЛУЧАТЬ ЛУЧШИЕ НОВОСТИ ПО ДИЗАЙНУ ЗА НЕДЕЛЮ?
UX-FEED
Нужны ли модульные сетки в дизайне сайтов?
UX-FEED
Нужны ли анимации на сайте?
UX-FEED
Что такое продающий заголовок?
© 2016 Your company
UX-FEED
Почему современные сайты состоят из блоков?
Современные сайты состоят из следующих блоков: хэддер (шапка сайта), футер (подвал сайта), левый и правый сайдбар, и основной блок - контент, который также может состоять из информационных блоков. Почему блочная структура стала основой для современных веб-ресурсов? Чем это обосновано? И нужно ли придерживаться блочной структуры при проектировании дизайна сайтов?
Информация в блоках легче воспринимается людьми
Переработка графической информации осуществляется не произвольно, а по заданным законам психических процессов человека. Эти законы основаны на принципах эмоционального, функционального и физиологического соответствия. Данные принципы подтверждают тот факт, что люди лучше всего воспринимают информацию на экране, если она имеет определенную структуру и поделена на смысловые блоки.
В сети люди не читают текст, а сканируют страницу в целом. При этом фиксация взглядов показала, что пользователей привлекает выделенный с помощью различных приемов контент. Отдельные смысловые блоки, абзацы, маркированные списки притягивали больше внимания, нежели сплошной текст.
Если страница разделена на отдельные блоки, которые снабжены привлекающими внимание элементами, то пользователь будет просматривать (сканировать) страницу, фиксируя взгляд именно на отдельных паттернах.
Блоки на сайте являются отдельными элементами дизайна. При настройке адаптивности автономность каждого блока позволит менять размер блока под размеры дисплея.
Разделение контента на блоки повышает удобство использования веб-страницы на 47% за счет улучшения читабельности и понятности представления текста.
Преимущества блочной структуры сайтов
Люди воспринимают графическую информацию порционно, блоками. Это происходит на интуитивном уровне. Пользователи в сети изучают контент тоже блоками. Так быстрее и легче можно просмотреть больше информации и найти нужную.
Блочная структура дизайна позволяет эффективно настроить адаптивные версии сайта. При этом логические связи макета не будут нарушены.
Резюме
Блочная структура стала основой для проектирования современных сайтов по двум основным причинам:

► пользователям удобнее изучать отдельные элементы на странице в виде блоков текста или блоков навигации;

► блочная структура значительно упрощает процесс настройки адаптивности сайта под различные размеры экранов.

Поэтому, при проектировании дизайна сайтов целесообразно придерживаться именно блочной структуры.
Создание дизайна на основе блоков позволяет эффективно настроить отображение сайта на экранах различных устройств без потери логических связей, которые есть на десктопной версии. Более того, отдельные блоки масштабируются при настройке адаптивности, что помогает пользователям мобильных устройств удобно изучить весь представленный контент.
ПОДЕЛИТЬСЯ МАТЕРИАЛОМ
ХОЧЕШЬ ПОЛУЧАТЬ ЛУЧШИЕ НОВОСТИ ЗА НЕДЕЛЮ?
UX-FEED
Нужны ли модульные сетки в дизайне сайтов?
UX-FEED
Нужны ли анимации на сайте?
UX-FEED
Что такое продающий заголовок?
ПРОФЕССИЯ
UX/UI ДИЗАЙНЕР
3-х месячный практический курс
от ведущей дизайн студии

скидка — 35% в этом месяце
ПРОФЕССИЯ
UX/UI ДИЗАЙНЕР
3-х месячный практический курс
от ведущей дизайн студии

скидка — 35% в этом месяце