Как это часто бывает, некоторым тенденциям необходимо время, чтобы разогнаться и сделать свое присутствие ощутимым. Компоновка “разделенный экран” — как раз такой случай. Появившись в обзорах, посвященных тенденциям веб-дизайна 2015 года, она только теперь набрала свою силу.
Метод довольно прост для воспроизведения, так как это просто структура с двумя колонками. Тем не менее, несмотря на кажущуюся примитивность, он обладает рядом существенных преимуществ. Например, он позволяет придать двум разным вещам одинаковую важность или поощрять несколько вещей одновременно.
Есть множество способов получения выгоды от подобного дизайна, и сегодня мы рассмотрим некоторые из них.
The Square
Приветственная страница сайта The Square разбита на две равные части. Левая часть имеет слайдер с изображениями, а правая показывает вступительную речь. Такое решение хорошо играет с логотипом квадратной формы и квадратной атмосферой, которая превалирует на веб-сайте.
Begona Monasterio
Этот веб-сайт электронной коммерции выглядит современно и стильно. Домашняя страница создана в верхней части разделенного макета, который позволяет демонстрировать два продукта одновременно, придавая им одинаковую степень приоритетности. Более того, внутренняя страница каждого продукта имеет одинаковую организацию.
Jan Dlugosz
Этот дизайн обязан своим выдающимся видом несбалансированной структуре и несимметричному расположению. Страница разбита на две части, но они неравномерны, что добавляет дизайну некоторую пикантность.
HireLevel
HireLevel встречает онлайн аудиторию визуально разделенной секцией “hero”. Таким способом команда пытается определить два основных направления компании: один — для кандидата, а другой — для работодателя. Каждый сегмент имеет фоновое изображение и основной цвет, которые не конкурируют между собой.
Tanweer
Tanweer имеет полноэкранный мультимедийный слайдер, состоящий из двух блоков. Автор принимает освежающий взгляд на компонент, придав ему современный вид. Таким образом, одна из частей показывает фрагмент и ссылку для дальнейшего чтения, а во второй находится сопровождающее изображение.
Bump
В веб-версии для настольных ПК этого сайта есть ползунок, который так же, как и в предыдущем примере перестраивает содержание на две неравные тщательно очерченные области. Как обычно, левая часть зарезервирована для изображения, а правая для текста. Решение выглядит визуально интересным и привлекательным.
Ana Vicente
Персональное портфолио Ana Vicente — просторно и хорошо сбалансированное. Художник использует минимализм и прививает чувство индивидуальности и харизмы на главной странице. Split-макет создает гармоничный симбиоз личного контакта и информативной части.
Brux
Команда разработчиков выбирает две асимметричные колонки на домашней странице, которые вмещают изображение и заголовок с логотипом. Сплошная область справа выглядит относительно большой боковой панелью, что намекает на дополнительную информацию. Остальная часть макета достаточно типична: она основана на традиционной одинокой колонке, профессионально работающей со всем контентом.
Family Park
Сайт должен охватывать множество графических и мультимедийных устройств, и в этом случае, модульный подход в паре со split-макетом является выигрышным решением. Такой дизайн позволяет избежать загромождения интерфейса и предоставляет читателям комфортное пространство, полное ярких и энергичных визуальных элементов.
Nicolas Errera
Версия сайта для больших экранов аккуратно разделена на две колонки. В каждый из них находится индивидуальный тип информации. Та, что расположена на левой стороне, занимает большую часть и демонстрирует изображения и сообщения, посвященные наградам и достижениям художника, в то время как правая боковая панель включает в себя твиты.
FullBundle
Для того чтобы придать несколько художественных приемов и харизму интерфейсу, команда FullBundle придумала оригинальную идею. Они разделили первую страницу на две части, которые образуют единую игровую площадку. Таким образом, изначально «творчество» устанавливается отдельно от «логики», но у посетителей есть возможность смешивать их вместе с помощью курсора.
Deezer Love Roulette
Забавность этого портала строится на основе игрового автомата, который и создает весь кайф его использования. Есть две рулетки. Каждая из них содержит половину портрета известного музыкального исполнителя. Продолжайте вращение, чтобы найти идеальный “матч”.
Guest List
Guest List — микросайт, который все время поддерживает фокусировку пользователя на домашней странице. Он состоит из двух блоков. Один содержит навигационные функции, является статическим и используется в качестве якоря. Второй содержит изображения, является динамическим и прокручивающимся, и используется для выявления содержания опций меню. Благодаря такой реализации, пользователи могут получить доступ к необходимой информации, не покидая главной страницы.
McKinney York Architects
Команда разработчиков делает акцент на том, что многие потенциальные клиенты находят ценным при поиске работы, а именно работу и персонал. В результате, целевая страница построена из двух визуализаций, которые демонстрируют эти два фактора.
Media Monks
Это еще один пример в нашей коллекции, который получает вау-фактор, от искусного использования “слот-автомата”. Здесь также две катушки, которые можно прокручивать. Попробуйте различные комбинации, прежде чем продолжить.
TropFest Watch
Tropfest Watch — контент-интенсивный веб-сайт, который требует надежной системы для успешной работы. Данные организованы в структуру с двумя колонками, в которых с помощью слайдера можно посмотреть большую часть видео и изображений, не нарушая гармонии. Все выглядит чистым, аккуратным и систематизированным.
HKG
Этот сайт явно выделяется из толпы. Его каркасный дизайн лопается с изрядной оригинальностью. Каждая страница состоит из двух частей с прокруткой, которые можно использовать по отдельности.
D’Addario Nickel Bronze
Здесь разработчики используют два сложенных вместе видео для того, чтобы подчеркнуть различия между двумя основными продуктами. Решение является интерактивным — вы можете быстро переключаться между строк, просто перетаскивая кнопку.
Eskor
Eskor использует слайдер со split-макетом, который представляет данные весьма привлекательным способом. Сопроводительный текст, который, как правило, теряется на фоне щедрых фонов, получает визуальный вес и становится более заметным для аудитории.
Camper SS 16
Camper SS 16 имеет опыт захватывающей интерактивной кампании. Split-макет используется во внутренних страницах, как инструмент, сочетающий в себе демонстрацию товара и соответствующую историю.
ВЫВОД
Разделенные пополам макеты — частный случай модульного подхода. Этот тренд выглядит свежим, интересным и оригинальным. Он способен улучшить различные проекты. Обогащает домашние страницы, дает равный приоритет важным событиям или товарам, а также служит средством привнесения развлечения в жизнь.
Какой из наших примеров вы находите наиболее впечатляющим? Предпочитаете ли вы такой тип дизайна? Ждем ваших комментариев!
