Divi Design Showcase : nouvelles soumissions de septembre 2018

C'est à nouveau l'heure de notre Divi Showcase mensuel où nous jetons un coup d'œil à 10 sites Web Divi incroyables créés par les membres de notre communauté. Chaque mois, nous présentons les meilleurs sites Web Divi qui ont été soumis par notre communauté et aujourd'hui, je souhaite partager avec vous les dix meilleurs sites Web du mois de septembre. Tout au long de cet article, je soulignerai certaines de mes caractéristiques de conception préférées qui m'attirent vers chacun des sites Web.

J'espère que tu les aimes!

Divi Design Showcase : nouvelles soumissions de septembre 2018

1. Pixels et crayons

Ce site Web a été soumis par Tyler Diaz. Un bel en-tête plein écran présente ce qu'est ce site en utilisant des graphiques et des couleurs avec des designs intéressants. La section suivante montre les logos des clients avec un bouton pour en savoir plus. Une section de travail en vedette affiche les projets sous forme de cartes avec des images, du texte, des boutons et des effets d'ombre. J'adore la dernière section, qui montre un autre ensemble de graphiques avec un simple appel à l'action et des boutons sociaux placés dans une section inclinée. La page de travail affiche des versions plus grandes des cartes de projets, chacune amenant le visiteur vers une page de détail de projet simple et élégante. J'aime aussi l'utilisation simplifiée de la couleur et des graphiques.

Voir le site Web

2. Andrea Masotti

Ce site a été créé par Andrea Masotti. Ce site fait un usage intéressant des modules de Divi. Trois lignes montrent trois colonnes qui incluent du texte à l'extrême droite et à gauche et un graphique au centre. Le texte et les graphiques utilisent des contours noirs avec du blanc pour une couleur qui se fond avec l'arrière-plan. Chaque ligne est séparée par une ligne noire. En survolant uniquement la ligne, tous ses éléments deviennent noirs. Le survol d'un élément spécifique dans la ligne change sa couleur en rouge (pour le texte) ou en rouge et bleu (pour les graphiques). Les graphiques rouges et bleus sont utilisés comme éléments d'en-tête pour les pages du portfolio. Ce site Web est un excellent exemple de la façon dont quelque chose de simple peut faire une grande déclaration.

Voir le site Web

3. Adriano Alfaro

Ce site Web a été créé par Adriano Alfaro. Il affiche un en-tête plein écran avec un titre et une description suivi d'une courte section sur le suivi social afin que vous puissiez savoir instantanément de quoi parle le site et dialoguer avec le concepteur. Des présentations avec de grandes icônes, des descriptions et des liens affichent les services. Les prochaines sections sont mes préférées. Ils affichent une image d'un côté et du texte de l'autre en pleine largeur et incluent des liens vers le portfolio. Ils alternent les côtés pendant que vous faites défiler. Un arrière-plan vidéo joue derrière un prix avec citation et CTA. J'adore la page portfolio, qui affiche des images mur à mur de projets cliquables. Les pages de projet individuelles sont l'endroit où ce site brille vraiment. Ils sont un bel exemple de conception de mise en page moderne. Assurez-vous de regarder la page Fiat.

Voir le site Web

4. Emilie Marchande

Ce site Web a été soumis par Emily Merchant. Celui-ci crée un en-tête intéressant à l'aide d'un CTA. Le CTA est créé avec une image, une bordure, le type de travail fourni, un titre et des boutons. Trois images se trouvent en dessous. Ils incluent un titre dans une superposition. Le survol change leur couleur et affiche une bordure, créant ainsi une élégante page de projet CTA. Une section à propos est créée avec une citation et un texte. Un autre portefeuille CTA dessine des graphiques lorsque vous faites défiler jusqu'à celui-ci. La page du portfolio crée une mise en page multi-colonnes avec chaque image ayant ses propres couleurs de superposition et continuant les effets de survol.

Voir le site Web

5. INTRO-AMÉRIQUE

Ce site a été créé par Vincent Valentino. Celui-ci fait un grand usage des couleurs vives et des effets de parallaxe. L'en-tête en plein écran démarre le site avec un joli arrière-plan qui met en valeur le texte et les boutons. Une section qui montre ce qu'ils font affiche une carte topographique avec des bords irréguliers pour la séparer d'une section de textes de présentation, qui affichent des blocs avec des effets d'ombre. J'adore les sections avec des études de cas. Une image de la conception complète est affichée en arrière-plan tout en chevauchant le texte et une image défile en parallaxe. Les projets récents sont affichés dans une mise en page à plusieurs colonnes. Ce site fait un excellent usage d'une conception d'une page.

Voir le site Web

6. Station météo

Ce site a été créé par Pierre Lannoy. Ceci est le site Web d'une application. Il garde le design simple et fait un grand usage de la couleur. J'aime particulièrement les arrière-plans bleus avec un dégradé subtil qui sont utilisés tout au long du design. Une séparation de section ondulée distingue l'en-tête tandis que les avantages sont affichés avec des images et des modules de texte. Le site fait également bon usage des compteurs de nombres, qui affichent en fait des statistiques utiles sur les téléchargements et les installations publiques. Juste en dessous se trouve une section qui affiche les notes de l'application et comprend des graphiques de la note par étoiles. Les témoignages sont clairs et incluent des effets d'ombre. J'aime aussi la page du blog, qui affiche des images sous forme de cartes sur deux colonnes avec une ombre de boîte, un titre et un bouton. Le survol montre une superposition bleue avec un extrait du message. Le dernier message est affiché en taille réelle dans une seule colonne. Les publications individuelles utilisent également des effets d'ombre de boîte et incluent des modules de navigation et de commentaires.

Voir le site Web

7. Goodimaliste

Ce site Web a été soumis par Daragh Wallace. Ce site se concentre sur une mise en page de blog. Il affiche un en-tête extra-large pour montrer le logo à l'avant et au centre. Sous celui-ci se trouvent deux menus de navigation : les sujets principaux sont placés dans le menu principal et les sous-sujets sont placés dans un menu secondaire avec une police légèrement plus petite en vert. Un article en vedette montre une image sur le côté gauche, et le titre, les catégories, l'extrait et le bouton En savoir plus sur le côté droit dans une boîte plus petite. Ensemble, ils prennent toute la largeur de la zone de contenu. Après ceci est une section de blog avec 9 articles dans trois colonnes. Les articles affichent l'image en vedette, le titre, les catégories, un court extrait et un bouton. L'écrivain en moi aime la section pleine largeur montrant la définition du titre du site Web. Les articles de blog conservent également un design épuré avec l'image en vedette, le texte, un CTA, un curseur d'image, une vidéo (pour certains articles) et une section de blog avec trois articles. Ce site est un excellent exemple de design de blog épuré.

Voir le site Web

8. Jerrix

Ce site Web a été soumis par Jeroen Rotty. Il utilise certaines de mes couleurs préférées (je viens du Tennessee et j'ai un faible pour l'orange). L'en-tête utilise la parallaxe avec un CTA. Un séparateur de section stylisé permet de créer l'espace blanc pour la section suivante, qui fournit des informations « à propos » avec un lien et une photo encerclée. Les services sont affichés avec de grandes icônes bicolores qui utilisent les reflets orange et les effets de survol. Les captures d'écran de travaux récents utilisent également des effets de survol et incluent un effet de zone d'ombre. La page du portfolio continue la conception des travaux récents. En cliquant sur l'un d'eux, vous accédez au site Web lui-même afin que vous puissiez voir le travail de première main. La page WordPress affiche les avantages sur deux colonnes et comprend des graphiques dessinés à la main sur toute la page. J'adore les couleurs de ce site.

Voir le site Web

9. Mères à risque

Ce site Web a été soumis par Swag Design Factory. Il utilise une conception en boîte avec une disposition à plusieurs colonnes. L'en-tête affiche le logo, le menu et les boutons de suivi social verticalement d'un côté avec une vidéo et un slogan de l'autre côté. Une section d'image et d'information utilise la même disposition de lignes mais alterne l'image et le texte. Plusieurs sections à deux colonnes affichent une image avec un bouton superposé et du texte avec CTA. Un témoignage pleine largeur utilise le logo et les couleurs du site pour se fondre parfaitement. Les articles de blog individuels affichent un motif d'arrière-plan avec le titre et les boutons de suivi social pour l'en-tête suivis de l'article et de la barre latérale, qui sont conçus pour correspondre au site. J'aime les reflets vert foncé et roses utilisés sur tout le site.

Voir le site Web

10. Wems sans fil

Ce site Web a été soumis par Philip Wantling. Il utilise des couleurs de marque (orange et vert) avec des images d'électronique (avec les mêmes couleurs de marque) pour décrire ce site Web d'entreprise. Cela se voit dans l'en-tête plein écran et dans tout le site. Quatre images sur deux colonnes renvoient aux différents produits. J'adore le CTA qui propose une animation avec titre et bouton. Il chevauche la section précédente (des logos des clients) et est accompagné d'un ensemble de textes de présentation pour décrire les avantages. Les CTA pour les démos utilisent des rubans remarquables dans les coins des images. Les produits sont affichés avec des mises en page multi-colonnes qui mènent à des liens de produits. Les pages de produits individuelles incluent également un style Divi doux pour les descriptions de produits et les motifs de fond de page. Ce site fait un grand usage de la conception de la mise en page et de la couleur.

Voir le site Web

En conclusion

Ce sont nos 10 meilleures soumissions de sites Web Divi communautaires pour le mois de septembre. Ces sites sont magnifiques et comme toujours, nous tenons à remercier tout le monde pour vos contributions !

Si vous souhaitez que votre propre design soit pris en compte, n'hésitez pas à envoyer un e-mail à notre éditeur à nathan à thèmes élégants point com. Assurez-vous de faire l'objet de l'email « SOUMISSION DU SITE DIVI ».

Nous aimerions également vous entendre dans les commentaires! Dites-nous ce que vous aimez sur ces sites Web et s'il y a quelque chose qu'ils ont fait, vous voulez que nous l'enseignions sur le blog.

Image en vedette via Koksharov Dmitry / shutterstock.com