Divi Design Showcase: Neue Einreichungen ab Juni 2020

Es ist wieder soweit für unseren monatlichen Divi Showcase, in dem wir uns zehn fantastische Divi-Websites unserer Community-Mitglieder ansehen. Jeden Monat präsentieren wir die besten Divi-Websites, die von unserer Community eingereicht wurden, und heute möchten wir Ihnen die zehn besten Websites für den Monat Juni vorstellen. Während des gesamten Beitrags werde ich auf einige meiner Lieblingsdesignfunktionen hinweisen, die mich zu jeder der Websites führen.

Ich hoffe sie gefallen dir!

Divi Design Showcase: Neue Einreichungen ab Juni 2020

1. Preston lächelt

Diese Seite wurde von Christian Mauerer eingereicht. Der Heldenbereich zeigt animierten Text mit Tippeffekt an, der auf einer Seite eine ausgefallene Schriftart und einen CTA verwendet und auf der anderen das Thema des Hintergrundbildes. Beim Scrollen wird ein Logo-Slider angezeigt, der Medien anzeigt, in denen das Unternehmen gesehen wurde. Ein CTA für Bücher zeigt Logos von Online-Shops in der Mitte mit Pfeilen, die auf die Außenkanten zeigen, mit Fotos der Bücher. Die Bücher bewegen sich beim Scrollen zur Mitte hin. Ein Abschnitt über den Websitebesitzer zeigt links ein großes Foto und rechts Informationen an. Das Foto scrollt schneller, wenn Sie die Seite nach unten scrollen, um eine Galerie von Bildern anzuzeigen, die sich überlappen. Mehrere Abschnitte enthalten gestylte Videos. Besonders gut gefällt mir der Testimonials-Bereich, der ein großes Bild des Besitzers, Testimonials von Facebook und Fotos von Veranstaltungen zeigt.

Besuche die Website

2. WebDevXd

Diese Seite wurde von Steph von Web Dev Xd eingereicht. Links wird ein CTA mit roten Schaltflächen über einem Hintergrundbild einer Weltkarte und einem weißen Overlay angezeigt. Ein Menü in voller Breite befindet sich unter diesem Abschnitt und bleibt beim Scrollen oben. Der nächste Abschnitt zeigt auf der einen Seite ein Arbeitsbeispiel auf einem Computerbildschirm und auf der anderen eine Beschreibung, jeweils in den Markenfarben Rot und Weiß. Dienste werden in Klappentexten mit roten Symbolen angezeigt. Der Abschnitt Projekte zeigt Bilder, die gestapelt sind. Die Bilder zoomen heraus und die Bilder im Hintergrund bewegen sich beim Schweben zu den Seiten. Ein Abschnitt für zu erbringende Leistungen verwendet einen roten Hintergrund mit Klappentexten und weißen Symbolen. Der Titel steht senkrecht zur Seite. In der Fußzeile werden ein Post-Slider und mehrere Widgets auf rotem Hintergrund angezeigt.

Besuche die Website

3. Muni

Diese Seite wurde von Lethicia Diniz eingereicht. Es verwendet blaue und grüne Farben und Schriftstile, die perfekt zum Genre passen. In der Kopfzeile werden gestapelte Schaltflächen für CTAs angezeigt. Der Heldenbereich enthält ein Hintergrundbild mit dem Motiv auf der einen Seite und großen Aufzählungspunkten auf der anderen. Pläne werden als Textblöcke mit unterschiedlichen farbigen Hintergründen angezeigt, die beim Hover zoomen. Ich mag den CTA im Vollbildmodus, der aus Ebenen besteht. Es zeigt ein Foto auf der einen Seite, einen Titel, der die zweiten zwei Drittel abdeckt, eine Liste der Vorteile auf der anderen Seite und eine große Box, die die anderen beiden mit blauem Hintergrund und Mustern mit dem CTA selbst überlappt. Ein Testimonial-Schieberegler wird mit einem Hintergrundmuster ganz rechts angezeigt. In der Fußzeile werden zwei Zeilen angezeigt. Der erste hat CTAs zum Lesen in verschiedenen Farben und Größen, Kontaktinformationen, und dann zeigt die untere Reihe Widgets an. Die beiden Reihen werden über einem Parallaxen-Hintergrundmuster angezeigt.

Besuche die Website

4. SAMCARA

Diese Seite wurde von Xavier Ferre eingereicht. Das Navigationsmenü wird links vertikal angezeigt und bleibt beim Scrollen auf dem Bildschirm. Der Hero-Bereich zeigt den Site-Titel in großen Schriften an, gefolgt von einer Liste von Diensten und einem anklickbaren Kontakt-CTA auf der einen Seite und einem kleinen Bild auf der anderen. Die Informationen werden in zwei großen Karten mit unterschiedlichen Hintergrundfarben und Bildpositionen bereitgestellt. Beide überlappen den nächsten Abschnitt, der von oben einen größeren stilisierten Basketballplatz mit einem ähnlichen Design wie die ersten beiden Karten zeigt. Es folgen weitere Karten, die mit einer großen Textspalte eingeleitet werden. Dieser Abschnitt enthält ein Kontaktformular und eine Liste der Mitarbeiter. Blog-Posts werden mit einem gestylten Pfeil eingeleitet, der beim Scrollen heranzoomt. Der Blog-Bereich führt den Leser auch in das Login-Formular.

Besuche die Website

5. Pufferversicherung

Diese Seite wurde von Sean Turner eingereicht. Die Website verwendet hervorragend Farben und Bilder. Im Heldenbereich werden zwei Hintergrundbilder angezeigt. Die größere Seite hat eine blaue Überlagerung und die kleinere Seite hat eine grüne Überlagerung. Ein Vordergrundbild wird dort platziert, wo die beiden aufeinandertreffen und über einem Hintergrund in Form eines Schildes platziert. Auf der anderen Seite wird ein CTA platziert. Der Vordergrund enthält auch Formen in Mustern, die überall auf der Site erscheinen. Der nächste Abschnitt zeigt Dienste in großen Boxen mit dem gleichen Design. Die nächsten beiden Abschnitte zeigen auf der einen Seite hohe Klappen und auf der anderen ein Bild in abwechselndem Layout über einem Hintergrundbild mit weißen oder blauen Überlagerungen. Die Klappentexte zeigen Aufzählungszeichen. Die Bilder verwenden den gleichen Schild wie der Heldenabschnitt. Ein Post-Slider in voller Breite zeigt den Titel und den Text der neuesten Posts an. Es enthält auch ein Mega-Menü mit Textlinks.

Besuche die Website

6. Curlee

Diese Seite wurde von Anthea A. Ancalade eingereicht. Der Heldenbereich zeigt ein Vollbild-Hintergrundbild mit einem Suchfeld in der Mitte an, mit dem Sie einen Standort auswählen oder Ihren aktuellen Standort verwenden können. Dienste werden mit Bildern angezeigt, die Titel und Überlagerungen neben einem CTA enthalten. Ausgewählte Stile werden in einem 6-spaltigen Schieberegler angezeigt und enthalten ein Bild, einen Titel, eine Sternebewertung und einen Standort. Der Schieberegler enthält sowohl Pfeil- als auch Punktnavigation. Wenn Sie auf einen der Stile klicken, gelangen Sie zu dessen Produktseite. Neue Stile werden in 6 Spalten angezeigt, jedoch ohne Schieberegler. Der Blog-Bereich zeigt die beiden neuesten Beiträge an und platziert eine Linie unter den Beiträgen mit einem Link, um mehr unter der Linie zu sehen. Tutorials aus dem Blog sind in drei Spalten platziert und folgen dem gleichen Design. Es enthält auch einen Instagram-Feed mit 6 Spalten und 2 Zeilen und eine Fußzeile mit einem gestylten E-Mail-Formular.

Besuche die Website

7. Typogenie

Diese Seite wurde von Eugenia Janakow eingereicht. Es verwendet viel kräftiges Gelb innerhalb der Grafiken. Titel werden wie mit einem Etikettendrucker erstellt, wodurch die Hintergründe schwarz und der Text in 3D-Optik weiß wird. In der Mitte des Menüs wird ein CTA platziert. Im Heldenbereich wird ein geteilter Bildschirm mit einem CTA links und einem Bild rechts angezeigt. Ein CTA verwendet eine handgezeichnete Grafik, die beim Scrollen und Schweben animiert wird. Informationen zum Websitebesitzer zeigen ein eingekreistes Bild mit einem CTA an, um mehr zu erfahren. Besonders gut gefällt mir der Erfahrungsbericht. Es zeigt Bewertungen von Google komplett mit Sternebewertungen und einer anklickbaren Grafik an, die Sie zur Seite "Info" führt. Dienste werden in Klappentexten angezeigt und enthalten große handgezeichnete Grafiken. Der Blog verwendet das Markengelb für Meta und das Kontaktformular verwendet es für den Hintergrund des gesamten Abschnitts.

Besuche die Website

8. Bushcrafter

Diese Seite wurde von Simone Talamo eingereicht. Der Heldenbereich zeigt ein Vollbild mit dem Motiv in der Mitte an. Im Vordergrund wird ein Slogan mit einem CTA und Social-Buttons angezeigt. Mehrere Abschnitte in voller Breite folgen einem ähnlichen Design. Jeder Abschnitt hat ein gezacktes Trennzeichen, das perfekt für das Genre funktioniert. Der nächste Abschnitt zeigt große Bilder zur Information mit Text und Symbolen im Overlay an. Die meisten haben dunkle Hintergründe oder verschmelzen mit dunklen Hintergründen. Eine für ein Handbuch zeigt das Buchcover zusammen mit dem Text an. In den neuesten Blog-Posts werden die Posts als Karten mit Kastenschatten angezeigt. In der Fußzeile werden Produkte mit Namen, Bildern, Sternebewertungen und Preisen angezeigt. Die Kursseiten folgen dem gleichen Design und fügen einen Countdown-Timer und gestylte Umschalter hinzu.

Besuche die Website

9. KWALT Digital

Diese Seite wurde von Nicolas Peigner eingereicht. Dieser hat viele interessante Animationen, gestalteten Text, Grafiken und Pfeile auf der gesamten Website. Gelb wird als Markenfarbe verwendet und auf kreative Weise verwendet. Der Heldenbereich zeigt Text auf einer Seite mit einem Tippeffekt an. Darunter sitzt eine Bar und listet die Dienste auf. Auf der rechten Seite befinden sich mehrere unabhängige grafische Elemente, die schweben und auf den Cursor reagieren. Der nächste Abschnitt zeigt einen Titel mit einer animierten Grafik auf der einen Seite und einfachen CTAs auf der anderen. Die neueste Arbeit folgt darauf und präsentiert Screenshots von Arbeiten über Hintergründen in verschiedenen Farben und Mustern. Ein Abschnitt, in dem die Vorteile erläutert werden, stellt Klappen mit zweifarbigen Symbolen beiseite. Auf der anderen Seite sitzt ein Bild und führt den Leser zu den Klappentexten. Ein einfacher Testimonial-Schieberegler wird über einem dunkelgrauen Hintergrund platziert, um sich abzuheben.

Besuche die Website

10. Erkundungen

Diese Seite wurde von Ava Charpentier eingereicht. Es verwendet viele Bräune für Markenfarben. Die obere Leiste verschwindet beim Scrollen, das Logo überlappt den Header- und Hero-Bereich und der Header enthält Hover-Animationen. Das Hauptbild zeigt den Titel, die Beschreibung und die Schaltfläche zum Aufgeben einer Bestellung an. Ein weiteres Bild wird als Fenster auf dem Heldenbild in echter Parallaxe platziert. Informationen werden mit Klappentexten mit benutzerdefinierten Grafiken angezeigt. Produkte werden mit einer Hintergrundfarbe hinter dem oberen Rand des Produktbilds angezeigt. Ein ähnliches Hintergrunddesign wird für den Blog-Bereich verwendet. Ein CTA zum Lesen über das Unternehmen zeigt auf der einen Seite Text und auf der anderen ein Bild an. Testimonials werden als Karten mit dem Zitat oben mit weißem Hintergrund und dem Namen unten mit hellbraunem Hintergrund präsentiert. Die Website enthält auch einen Instagram-Feed und eine benutzerdefinierte Fußzeile mit Hover-Animation.

Besuche die Website

Abschließend

Das sind unsere 10 besten Einreichungen für die Divi-Website der Community für den Monat Juni. Diese Seiten sehen fantastisch aus und wie immer möchten wir uns bei allen für Ihre Einsendungen bedanken!

Wenn Sie möchten, dass Ihr eigenes Design berücksichtigt wird, senden Sie bitte eine E-Mail an unseren Redakteur bei nathan at Elegant Themes dot com. Stellen Sie sicher, dass der Betreff der E-Mail „DIVI SITE SUBMISSION“ lautet.

Wir würden auch gerne von Ihnen in den Kommentaren hören! Sagen Sie uns, was Ihnen an diesen Websites gefällt, und wenn sie etwas getan haben, möchten Sie, dass wir es auf dem Blog unterrichten.

Ausgewähltes Bild über domonku / shutterstock.com