Витрина дизайна Divi: новые материалы с сентября 2018 г.

Снова пришло время для нашей ежемесячной выставки Divi Showcase, где мы рассмотрим 10 удивительных веб-сайтов Divi, созданных членами нашего сообщества. Каждый месяц мы представляем лучшие веб-сайты Divi, представленные нашим сообществом, и сегодня я хочу поделиться с вами десятью лучшими веб-сайтами за сентябрь. В этом посте я буду указывать на некоторые из моих любимых дизайнерских функций, которые привлекают меня на каждый из веб-сайтов.

Я надеюсь, они тебе нравятся!

Витрина дизайна Divi: новые материалы с сентября 2018 г.

1. Пиксели и карандаши

Этот веб-сайт был представлен Тайлером Диазом. Красивый полноэкранный заголовок демонстрирует, о чем этот сайт, с использованием графики и цвета наряду с интересным дизайном. В следующем разделе показаны логотипы клиентов с кнопкой, чтобы узнать больше. В разделе избранных работ проекты отображаются в виде карточек с изображениями, текстом, кнопками и эффектами тени. Мне нравится последний раздел, в котором показан еще один набор графики с простым призывом к действию и социальными кнопками, размещенными в наклонной части. На рабочей странице отображаются увеличенные версии карточек проектов, каждая из которых переносит посетителя на простую и элегантную страницу с подробными сведениями о проекте. Мне также нравится упрощенное использование цвета и графики.

Просмотр веб-сайта

2. Андреа Масотти

Этот веб-сайт был представлен Андреа Масотти. Этот сайт интересно использует модули Divi. Три строки показывают три столбца, которые включают текст справа и слева и рисунок в центре. Для текста и графики используются черные контуры с белым цветом, который гармонирует с фоном. Каждая строка отделена черной линией. При наведении указателя мыши на строку все ее элементы становятся черными. При наведении курсора на определенный элемент в строке его цвет меняется на красный (для текста) или на красный и синий (для графики). Красная и синяя графика используются в качестве элементов заголовка для страниц портфолио. Этот веб-сайт - отличный пример того, как что-то простое может сделать большое заявление.

Просмотр веб-сайта

3. Адриано Альфаро

Этот веб-сайт был представлен Адриано Альфаро. Он отображает полноэкранный заголовок с заголовком и описанием, за которым следует краткий раздел о социальных сетях, чтобы вы могли мгновенно узнать, о чем сайт, и пообщаться с дизайнером. Всплывающие сообщения с большими значками, описаниями и ссылками показывают услуги. Следующие несколько разделов мои любимые. Они отображают изображение с одной стороны и текст во всю ширину с другой и включают ссылки на портфолио. Они меняют стороны при прокрутке. За наградой с цитатой и призывом к действию играет фоновое видео. Мне нравится страница портфолио, на которой отображаются изображения интерактивных проектов от стены до стены. Страницы отдельных проектов - вот что действительно привлекает внимание к этому сайту. Они являются прекрасным примером современной планировки. Обязательно загляните на страничку Fiat.

Просмотр веб-сайта

4. Эмили Мерчант

Этот веб-сайт был представлен Эмили Мерчант. Этот создает интересный заголовок с помощью CTA. CTA создается с изображением, рамкой, типом предоставленной работы, заголовком и кнопками. Под ним находятся три изображения. Они включают заголовок в оверлее. При наведении курсора изменяется их цвет и отображается рамка, создавая элегантный CTA на странице проекта. Раздел «О нас» создается с цитатой и текстом. Другой призыв к действию портфолио рисует графику по мере того, как вы прокручиваете его. На странице портфолио создается макет с несколькими столбцами, в котором каждое изображение имеет свои собственные цвета наложения и продолжает эффекты наведения.

Просмотр веб-сайта

5. ВВЕДЕНИЕ

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

Просмотр веб-сайта

6. Метеостанция

Этот веб-сайт был представлен Пьером Ланнуа. Это веб-сайт приложения. Он сохраняет простой дизайн и отлично использует цвета. Мне особенно нравится синий фон с тонким градиентом, который используется во всем дизайне. Волнистое разделение разделов выделяет заголовок, в то время как преимущества отображаются с изображениями и текстовыми модулями. На сайте также хорошо используются счетчики чисел, которые фактически отображают полезную статистику загрузок и общедоступных установок. Сразу под ним находится раздел, который показывает рейтинги приложения и включает графику с рейтингом в звездах. Отзывы чистые и включают теневые эффекты. Мне также нравится страница блога, на которой изображения отображаются в виде карточек в двух столбцах с тенью блока, заголовком и кнопкой. При наведении курсора отображается синяя накладка с отрывком из сообщения. Последний пост отображается в полном размере в одном столбце. Отдельные сообщения также используют эффекты тени блока и включают модули навигации и комментариев.

Просмотр веб-сайта

7. Гудималист

Этот веб-сайт был представлен Дарагом Уоллесом. Этот сайт ориентирован на макет блога. Он отображает очень большой заголовок, чтобы показать логотип спереди и по центру. Под ним находятся два навигационных меню: основные темы размещаются в основном меню, а подтемы размещаются во вторичном меню с немного меньшим шрифтом зеленого цвета. В избранном посте слева отображается изображение, а справа в меньшем поле - заголовок, категории, отрывок и кнопка «Читать дальше». Вместе они занимают всю ширину области содержимого. Далее следует раздел блога с 9 сообщениями в трех столбцах. В сообщениях отображается изображение, заголовок, категории, короткий отрывок и кнопка. Автор во мне любит раздел во всю ширину, показывающий определение названия веб-сайта. Сообщения блога также имеют чистый дизайн с представленным изображением, текстом, призывом к действию, слайдером изображений, видео (для некоторых сообщений) и разделом блога с тремя сообщениями. Этот сайт - отличный пример чистого дизайна блога.

Просмотр веб-сайта

8. Джеррикс

Этот веб-сайт был предоставлен Jeroen Rotty. В нем используются некоторые из моих любимых цветов (я из Теннесси, и мне нравится оранжевый). В заголовке используется параллакс с призывом к действию. Стилизованный разделитель разделов помогает создать пустое пространство для следующего раздела, который предоставляет информацию «о себе» со ссылкой и обведенной фотографией. Службы отображаются с большими двухцветными значками, в которых используются оранжевые выделения и эффекты наведения. Скриншоты недавних работ также используют эффекты наведения и включают эффект тени. Страница портфолио продолжает дизайн последних работ. Щелкнув по одному из них, вы попадете на сам веб-сайт, чтобы увидеть работу воочию. Страница WordPress отображает преимущества в двух столбцах и включает рисованную графику по всей странице. Мне нравятся цвета на этом сайте.

Просмотр веб-сайта

9. Матери в группе риска

Этот веб-сайт предоставлен Swag Design Factory. Он использует коробочный дизайн с макетом из нескольких столбцов. В заголовке вертикально с одной стороны отображаются логотип, меню и кнопки подписки, а с другой стороны - видео и слоган. В разделе изображения и информации используется та же структура строк, но изображение и текст чередуются. Несколько разделов из двух столбцов показывают изображение с перекрывающейся кнопкой и текст с призывом к действию. В характеристике во всю ширину используются логотип и цвета сайта, которые идеально сочетаются друг с другом. Отдельные сообщения блога отображают фоновый узор с заголовком и кнопками подписки в социальных сетях для заголовка, за которым следуют сообщение и боковая панель, стили которых соответствуют сайту. Мне нравятся темно-зеленые и розовые блики, используемые по всему сайту.

Просмотр веб-сайта

10. Wems Wireless

Этот веб-сайт был представлен Филипом Уантлингом. Он использует фирменные цвета (оранжевый и зеленый) с изображениями электроники (в тех же фирменных цветах) для описания этого бизнес-сайта. Это видно в полноэкранном заголовке и на всем сайте. Четыре изображения в двух столбцах ссылаются на различные продукты. Мне нравится CTA, в котором есть анимация с заголовком и кнопкой. Он перекрывает предыдущий раздел (логотипы клиентов) и сопровождается набором объявлений, описывающих преимущества. В призывах к действию для демонстраций используются яркие ленты в углах изображений. Продукты показаны с макетами из нескольких столбцов, которые ведут к ссылкам на продукты. Отдельные страницы продуктов также включают в себя некоторые милые стили Divi для описаний продуктов и фоновых рисунков страниц. Этот сайт отлично использует дизайн и цвет.

Просмотр веб-сайта

В заключение

Это 10 наших лучших материалов для веб-сайта Divi за сентябрь. Эти сайты выглядят потрясающе, и, как всегда, мы хотим поблагодарить всех за ваши предложения!

Если вы хотите, чтобы ваш собственный дизайн был рассмотрен, пожалуйста, напишите нашему редактору Натан по адресу Elegant themes dot com. Убедитесь, что в теме письма указано «ПОДАЧА САЙТА ДИВИ».

Мы также хотели бы услышать ваше мнение в комментариях! Расскажите нам, что вам нравится в этих веб-сайтах, и если есть что-то, что они сделали, вы хотите, чтобы мы учили в этом блоге.

Избранные изображения через Кокшаров Дмитрий / shutterstock.com