14 Divi-Sites mit interessanten Service-Seiten

Veröffentlicht: 2018-07-13

Eine interessante Serviceseite ist entscheidend für Online-Geschäfte. Es zeigt dem Besucher, was Sie tun, wie Sie es tun, wie es ist, mit Ihnen Geschäfte zu machen, und hilft ihm, realistische Erwartungen zu haben. Serviceseiten gibt es in allen möglichen Ausführungen. In diesem Artikel sehen wir uns 14 Divi-Websites mit interessanten Serviceseiten an, um Sie für Ihr nächstes Divi-Design zu inspirieren.

Serviceseiten enthalten in der Regel Elemente wie Preistabellen, Klappentexte, Umschalter, Bilder, Videos und Handlungsaufforderungen. Ich zeige ein Bild des Abschnitts, der mir gefällt, und bespreche, was mir daran gefallen hat. Die Websites sind in keiner bestimmten Reihenfolge. Warten Sie bis zum Ende, um ein paar Links zu finden, die Ihnen helfen, Ihre eigene einzigartige Kontaktseite zu verbessern.

1. Bristol Dachdecker

Diese Site zeigt Dienste in Karten an, die Box-Schatteneffekte verwenden. Sie zeigen ein Bild, einen Titel, eine Trennlinie und einen Text. Der zweifarbige Hintergrund teilt sich schräg hinter dem Titel, was ihm ein interessantes Design verleiht, das auch nicht vom Vordergrund abweicht. Bilder in voller Breite werden entsprechend angewinkelt. Der Abschnitt Warum wir verwendet rote Titel, während Teiler verwendet werden, um Quadranten zu erstellen. Der Abschnitt "Prozess" wird mit einem abwechselnden Layout gegen ein großes Bild nummeriert, das so gestaltet ist, dass es der Site entspricht.

Siehe Webseite

2. Landcore-Beratung

Diese Seite verwendet ein großes Bild in Parallaxe hinter dem Titel. Dienste werden in Kästchen mit grünen Rändern und Symbolen angezeigt, die dem Branding der Website entsprechen. Jeder der Dienste erhält auch seine eigenen individuellen Abschnitte, wobei jeder Abschnitt durch ein Bild in Parallaxen- und Wellenabschnittsteilern unterteilt ist.

Siehe Webseite

3. Doshii

Diese Site verwendet abwechselnde Abschnitte mit blauem Farbverlauf oder weißem Hintergrund – jeweils mit einem wellenförmigen Teiler. Jeder Abschnitt zeigt einen Dienst mit Text und Grafiken an, und ihre Layouts wechseln von einer Seite zur anderen. Ein abschließender CTA verwendet Boxschatten und Schaltflächenschatten. Die Site macht großen Gebrauch von Farb- und Schatteneffekten.

Siehe Webseite

4. Die ersten fünf acht

Dieser zeigt einen zweispaltigen diagonal geteilten Bildschirm mit CTA auf der einen Seite und Symbolen von Diensten auf der anderen an. Der nächste Abschnitt enthält eine Vier-Block-Grafik, die den Prozess schrittweise durchläuft und die Beziehung der einzelnen Schritte zeigt. Ein Abschnitt in voller Breite zeigt Ziele mit grünen Symbolen und weißem Text auf schwarzem Hintergrund und Schaltflächen mit Hover-Effekten. Statistiken und Kontaktabschnitte entsprechen diesem Design. Jeder der Schritte erhält einen eigenen Abschnitt mit Grafiken und Klappentexten.

Siehe Webseite

5. Enden + Stiele

Diese Seite beginnt mit Abschnitten in voller Breite über die Führungskräfte des Unternehmens, um Glaubwürdigkeit herzustellen. Dienste werden in grünen Kästchen mit weißen Symbolen und Text angezeigt. Darauf folgen ein gestyltes Kontaktformular, ein Call-to-Action für soziale Medien, ein Instagram-Feed mit Social-Follow-Buttons, ein Opt-in und ein Info-Bereich. Diese Seite verwendet einige interessante Farbmarken. Ich liebe den Schaltflächen-Hover-Effekt, der den Hintergrund der Schaltfläche beim Schweben in den Rahmen der Schaltflächen bringt.

Siehe Webseite

6. Stuart Johnson

Diese Site verwendet ein Vollbild-Hintergrundbild in Parallaxe mit großem Titeltext, um die Seite vorzustellen. Einleitender Informationstext wird in zwei Spalten bereitgestellt. Eine 6-kreisige Grafik beschreibt ihren 6-P-Ansatz mit einer kurzen Beschreibung jedes einzelnen. Übungsbereiche werden mit einem Titel in einem kurzen Parallaxenabschnitt eingeleitet. Die Übungsbereiche selbst werden in Umschaltern angezeigt, die so gestaltet sind, dass sie dem Branding der Site entsprechen.

Siehe Webseite

7. Web-Nexus

Diese Site stellt die Seite mit einem Titel und einem Slogan vor einem Hintergrund mit Overlay vor. Der nächste Abschnitt zeigt den Dienst für diese Seite, wobei ein wellenförmiges Trennzeichen für den oberen und unteren Rand des Abschnitts verwendet wird. Die Funktionen für den Dienst werden in einer Tabelle bereitgestellt, gefolgt von einem Abschnitt, der ihre Methode in drei Klappentexten beschreibt. Eine kurze Fallstudie enthält einen Link zu einer detaillierten Seite für weitere Informationen. Social Proof wird mit Kundenlogos bereitgestellt.

Siehe Webseite

8. Blue Cat Medien und Design

Diese Site stellt die Seite mit einem eleganten Titel und Text auf einem gemusterten Hintergrund vor. Ein Abschnitt, der zeigt, was enthalten ist, bietet Informationen zu den verschiedenen Diensten mit Text in der Mitte und Bildern in den äußeren Spalten, gefolgt von einer Beschreibung der Addons mit einem CTA. Ein Abschnitt über die Reiseschritte durch jeden Abschnitt des Prozesses, Nummerierung und detaillierte Informationen zu jedem.

Siehe Webseite

9. Flair-Designs

Dieser verwendet kräftige Farben und stellt die Dienste mit einzelnen Klappentexten vor, die sich zu einem einzigen großen Klappentext mit Symbolen, Titeln und Text für jeden zu kombinieren scheinen. Darauf folgt ein Abschnitt, der die Dienste mit einer gestylten Schaltfläche auflistet, um das Portfolio anzuzeigen. Ein weiterer Abschnitt durchläuft den Prozess mit nummerierten Titeln und kurzen Beschreibungen. Ein fetter roter CTA enthält einen gestylten Abschnittsteiler, eleganten Text und eine gestylte Schaltfläche. Ich mag die Hintergrundmuster und -farben auf dieser Seite.

Siehe Webseite

10. Zomlex

Dieser verwendet ein klares Design mit viel Leerraum. Die Seite wird mit einem großen Titel und einer kurzen Beschreibung eingeleitet. Dienste werden in großen Klappentexten mit Kastenschatten, handgezeichneten Grafiken, Titeln, Text und gestalteten Schaltflächen zu den einzelnen Dienstseiten angezeigt. Darauf folgt ein CTA in voller Breite, der das Blau der weißen Farben umkehrt, um sich abzuheben und gleichzeitig sein elegantes Aussehen beizubehalten. Besonders gefallen mir die Grafiken und Farben.

Siehe Webseite

11. Adverup

Die einzelnen Serviceseiten dieser Site werden mit Titel, Beschreibung und Grafik eingeleitet, gefolgt von einer Beschreibung in zwei Spalten. Vorteile sind Shows in einem kurzen Abschnitt in voller Breite mit Klappentexten und handgezeichneten Grafiken. Beispiele werden in einem Vollbild angezeigt, gefolgt von Klappentexten, die den Prozess beschreiben. CTAs für Anführungszeichen enthalten Tabellen, um zu zeigen, was enthalten ist. Ein weiterer Abschnitt hebt die Vorteile neben einem gestylten Kontaktformular hervor.

Siehe Webseite

12. RevolutionParts

Jede der Serviceseiten dieser Site enthält einen Abschnitt mit Symbolen und einem Titel, der beim Anklicken die unterschiedlichen Funktionen hervorhebt. Die Funktionen selbst werden mit Bildern, Beschreibungen und einer Schaltfläche zum Anzeigen einer Demo angezeigt. Die Seite endet mit einem Blog-Abschnitt für Artikel, die sich auf diesen Dienst beziehen, und einem abschließenden CTA, der eine schöne Fußzeile erstellt. Diese Seite macht großen Gebrauch von Farbe und Weißraum.

Siehe Webseite

13. Panorama-Design

Diese Seite beginnt mit einem Titel und einer anklickbaren Telefonnummer, gefolgt von einem Abschnitt, der die Vorteile der Zusammenarbeit mit dem Unternehmen beschreibt. Blurbs bieten eine Beschreibung jedes Dienstes und enthalten große Symbole, einen Titel, eine kurze Beschreibung und einen schönen Schatteneffekt, der beim Schweben angezeigt wird. Ein Abschnitt für Projekte enthält einen Hover-Effekt, der den Namen und den Link für weitere Informationen für jedes Projekt anzeigt. Ein Abschnitt über die Erstellung von Websites zeigt jeden Schritt des Prozesses mit eleganten Grafiken, gefolgt von Informationen zu Zahlungen und einem Abschnitt mit einer Telefonnummer und einem Kontaktformular, das so gestaltet ist, dass es sich vermischt.

Siehe Webseite

14. Anwaltskanzlei für Altenpflege

Die einzelnen Serviceseiten dieser Site sind größtenteils Text, aber sie werden auf interessante Weise präsentiert. Seiten werden mit einem kurzen Titel in voller Breite über einem Hintergrundbild eingeleitet. Darauf folgt ein Textabschnitt in zwei Spalten: Die erste Spalte enthält den Titel und die Beschreibung und die zweite Spalte ist ein für das Thema relevantes Zitat. Die vertikale Linie des Zitats dient als Teiler zwischen den beiden Spalten. Ein anderer Abschnitt zeigt ein Bild in Parallaxe mit einem Block rechts mit Informationen an. Diese Blöcke verwenden interessante Farben, die auffallen. Weitere Informationen werden im Text bereitgestellt, gefolgt von einem CTA in voller Breite.

Siehe Webseite

Gedanken beenden

Das ist unser Blick auf 14 Divi-Websites mit interessanten Service-Seiten, um Sie für Ihr nächstes Divi-Design zu inspirieren. Es gibt viele Artikel hier im ET-Blog, die sich speziell auf Serviceseiten oder Elemente wie Preistabellen, Klappentexte, Umschalter usw. konzentrieren.

Hier sind nur einige, die mit Divi über Design diskutieren:

  • So erstellen Sie mit Divi . einen hochvisuellen Serviceabschnitt für Ihr nächstes Projekt
  • So gestalten Sie eine schöne Preistabelle in Divi
  • Kostenlose Divi-Downloads: Kreatives Preistabellen-Layout-Kit
  • 5 Best Practices für die Preisgestaltung, die Sie mit dem Preistabellenmodul von Divi verwenden sollten
  • Verwenden der Faltanimation von Divi, um Blurbs zum Blühen zu bringen
  • 5 lustige Möglichkeiten, das Blurb-Modul von Divi zu stylen

Wir wollen von dir hören. Welche dieser Websites mit interessanten Serviceseiten sind Ihre Favoriten? Lass es uns in den Kommentaren wissen.

Ausgewähltes Bild über blocberry / shutterstock.com