+38 (044) 495-31-30
Украина, г. Киев, ул. Ванды Василевской 7, офис 526

Metro – Карточный стиль в оформлении сайта

Автор:

Метро стиль в веб-дизайне – это дизайн сайта на основе интерактивных карточек, которые содержат изображения, контент, гиперссылки. Впервые стиль Metro использовала Microsoft в 2010 году в дизайне интерфейса своих продуктов. Преимуществами данного стиля, по мнению разработчиков компании, были стильный и современный вид, а также функциональность. Пользователь не отвлекался на посторонние элементы, все его внимание было сконцентрировано на карточках-указателях, которые предоставляют ему искомый контент. Такой дизайн считался интуитивно понятным и упрощал работу пользователя.

Сегодня карточный дизайн можно встретить на таких известных ресурсах, как Twitter, Pinterest, Google и других.

Особенности карточного стиля

Метро стиль в дизайне очень популярен, его широко используют для улучшения юзабилити и облегчения восприятия большого количества контента. Карточный стиль имеет характерные особенности:

  • Адаптивность. Дизайн корректно отображается на любых устройствах.
  • Минималистичность, отсутствие отвлекающих элементов. Все внимание – функциональным карточкам.
  • Современный и эстетичный внешний вид, широкая палитра используемых цветов.
  • Применение легкочитаемых шрифтов (Segoe), четких тематических изображений.
  • Доступность, интуитивное понимание функционала для пользователя.
  • Динамичность. Использование анимационных эффектов.
  • Присутствие рисованных элементов: иконок, объемных кнопок, инфографики, которые облегчают восприятие и стимулируют к целевым действиям.

Metro style web Metro – Карточный стиль в оформлении сайта

Для каких сайтов подходит Metro стиль в дизайне

Лаконичный и современный карточный дизайн используется на сайтах различной тематики: портфолио, блоги, корпоративные сайты, сайты-визитки, интернет-магазины, и даже лендинг пейдж. Например, сайт Microsoft до сих выглядит именно в стиле метро (https://www.microsoft.com/uk-ua): на главной странице расположены крупные табы с продуктами компании и ссылкой на страницы с детальной информацией о них. Между ними расположены карточки стандартного вида с кратким описанием и гиперссылками на контент. Присутствуют эффекты анимации – при наведении курсора подсвечиваются изображения, кнопки, подчеркиваются ссылки. Отсутствуют посторонние элементы.

Веб-студия
Автор Веб-студия "Бизнес Сайт"
Звёзд: 1Звёзд: 2Звёзд: 3Звёзд: 4Звёзд: 5 (1 оценок, среднее: 5,00 из 5)
Загрузка...
Получите скидку -15%