Diese erstaunlichen WordPress-Websites präsentieren das Beste aus diesem beliebten CMS. Als es 2003 zum ersten Mal auf den Markt kam, galt WordPress als grundlegendes Blogging-Tool für Amateure. Sehr schnell ging es los und wurde zu einem vollwertigen CMS, das jetzt Millionen von Websites auf der ganzen Welt mit Strom versorgt. Und Kreativprofis haben seitdem die Grenzen des CMS überschritten, um komplexe und schöne WordPress-Websites zu erstellen.
Um Ihnen genau zu zeigen, was dieses unglaubliche CMS kann, haben wir einige der besten WordPress-Websites ausgewählt., Wenn dieser Artikel Sie dazu inspiriert, Ihre eigene WordPress-Website zu erstellen, helfen Ihnen diese WordPress-Tutorials beim Einstieg, oder wenn Sie ein fantastisch aussehendes Portfolio erstellen möchten, lesen Sie unseren Leitfaden zu den besten WordPress-Portfolio-Themen.
- Die besten Webhosting-Dienste im Jahr 2019
Rafal Bojar
Designer Zhenya Rynzhuk verwendete WordPress als halbkopfloses CMS mit Vue.,js für das Frontend, um diese ansprechende Fotoportfolio-Site für Rafal Bojar zu erstellen. Es verfügt über eine Homepage, auf der Vorschauen ausgewählter Geschichten angezeigt werden, ein glattes Raster, auf dem alle Arbeiten von Bojar gezeigt werden, und eine „Essenz“ – Seite, auf der die Philosophie und der Ansatz des Fotografen erläutert werden.
„Ziel war es, den Besuchern das einzigartige Erlebnis zu bieten und Rafals erstaunliche Werke zu präsentieren“, sagt Rynzhuk. Das Paar diskutierte einige verschiedene Backend-Optionen, entschied sich jedoch für WordPress, damit die Site einfach zu verwalten und regelmäßig mit neuen Projekten aktualisiert werden kann.
Neben WordPress und Vue.,darüber hinaus verwendet die Site einen S3-Bucket zum Speichern von Daten, die über Cloudfront bereitgestellt werden, um schnelle Ladezeiten zu gewährleisten. Rynzhuk nutzte auch Bedrock und Hendrik-Jan de Harders Vue Skeleton, sowie GSAP für die Animationen.,
Adel Vakula
Adel Vakula ist ein international bekanntes Modell aus der Ukraine, und diese Werbeseite für sie kommt von Landsleuten Yabloko ideas Studio, die es nicht nur entworfen und codiert haben, sondern alle Illustrationsarbeiten erstellt haben. Das Ergebnis ist ein herrlich unverwechselbares visuelles Fest, das eine Reihe von malerischen Vignetten mit unserer glamourösen Heldin umfasst.,
Von der eröffnenden Zuckerwatte-Wolkenlandschaft, die buchstäblich mit subtilen Animationen sprudelt, spielt Vakula in verträumten Porträts, die eine charismatische Persönlichkeit demonstrieren sollen. Sie übersieht skurril die Pariser Nacht auf einem Wasserspeier, der sich als YouTube-Wiedergabetaste verdoppelt, nachdem sie einen New Yorker U-Bahn-Zug von einer Plattform mit Busking Cat erwischt hat. Besuche in Venedig und Ibiza bieten ebenso exzentrische Kulissen für Instagram-und E-Mail-Links, wo sogar Cocktailsiegel zum Folgen ermutigen., Es ist Zunge in Wange Zeug, aber mit einem solchen Charme und Technik getan, dass Sie nicht helfen können, aber verlieben. Auch der Mauszeiger geht alle herzförmigen.
Ein herausragendes UI-Element, das auf WordPress CMS basiert, ist ein unterhaltsamer Abschnitt, in dem Sie Outfits per Drag & Drop auf eine virtuelle Vakula ziehen können, um echte Modellierungs-Snaps anzuzeigen. Als Visitenkarten für mögliche Castings gehen, schlägt dieser eine denkwürdigere Pose als die meisten.,
Autor: Mark Billen
Mittleres Kind
Preisgekrönter Sandwich-Shop in Philadelphia Mittleres Kind brauchte eine Website, die seiner Website skurrile, unprätentiöse Atmosphäre., Full-Service-Design und Technologie Studio Self Aware stieg auf die Herausforderung, eine Website zu schaffen, basierend auf einem völlig maßgeschneiderten WordPress – Theme mit Holz und ACF-eine Kombination, die Studio-Partner Mike Wagz nennt „ein Game-Changer für ernsthafte WordPress-Theme-Entwickler“.
Self Aware nutzte auch die neuesten Webtechnologien, um ein optimales Erlebnis zu bieten: Das Layout wurde mit CSS Grid erstellt, und ein Service Worker speichert statische Assets einschließlich CSS-und JavaScript-Dateien zwischen, um die anfänglichen Ladezeiten zu beschleunigen.,
„Mittleres Kind strahlt Atmosphäre aus jedem Winkel“, fügt Wagz hinzu. „Es heißt Kunden aus allen Lebensbereichen mit genau der richtigen Menge an Spaß, Kitsch und Eigenart herzlich willkommen. Ich denke, dieses Design ist erfolgreich, weil wir diesen Geist einfangen und ins Web übersetzen konnten.,“
Sea Harvest
Als der in Canberra ansässige Meeresfrüchtemarkt Sea Harvest eine neue Markenidentität und intelligente digitale Präsenz benötigte, wandte er sich an die australische Web-und Branding-Agentur ED. Die WordPress-Website verfügt über ein auffälliges Layout im Zeitungsstil mit vielen skurrilen Details, die Sie erkunden können.,
„Wenn wir an Meeresfrüchte denken, werden viele von uns in die Erinnerung zurückversetzt, mit Freunden und Familie Fish and Chips am Strand zu essen“, sagt Designer Cam Tidy. „Oft wickelten diese Gelenke zum Mitnehmen Ihr Essen in Zeitung ein, so dass es sich natürlich anfühlte, dies als visuelle Idee zu erkunden.“
Das Replizieren eines statischen Drucklayouts im Web war jedoch nicht ohne Herausforderungen. Das Team verwendete CSS Flexbox, um Inhalte neu zu positionieren und gleichzeitig einen konsistenten Abstand beizubehalten, unabhängig von der Bildschirmgröße., Fast jede Messung basiert auf einer reaktionsschnellen Skala mit REM-Einheiten, wodurch die Kontrolle über Typ-und Bildproportionen beim Skalieren des Browsers erleichtert wird.
Entwickler Bryn Shanahan Lieblings-Feature ist die Tatsache, dass Benutzer auf der Website „zeichnen“ können, auch über eine interaktive Wortsuche. „Wir haben dies erreicht, indem wir die Site mit einem HTML5-Canvas-Element bedeckt haben, auf das dann die Zeichnungen des Benutzers gezeichnet wurden“, erklärt er.
ED verwendet WordPress für viele seiner Website-Projekte und findet es benutzerfreundlich und intuitiv für Kunden., „einfache Backend-Entwicklung, die mehr Zeit ermöglicht, sich auf das Frontend zu konzentrieren, um das Design zum Leben zu erwecken“, fügt Entwickler Adam Forcucci hinzu. „Die Fähigkeit, es mit der WP Rest API kopflos zu machen, ermöglicht es uns, Frameworks wie React zu verwenden, die zum Kern unserer zukünftigen Entwicklung auf der Plattform werden.“
Maxim Shkret
Maxim Shkret ist ein freiberuflicher digitaler Künstler mit Sitz in Sankt Petersburg, Russland., Seine beeindruckende WordPress-Website verbindet Portfolio mit Ecommerce Marketplace und startet eine neuartige Fundraising-Initiative.
Die Website öffnet sich auf einer Reihe von vier 3D-Modellen oder digitalen Skulpturen, die 360-Grad gezogen und gedreht werden können. Schwein, Wüstenfuchs, doppelmütiges Einhorn und schmelzender Panda können nach links und rechts gedreht werden, um einen bevorzugten Winkel zu erreichen. Durch Klicken auf die Schaltfläche „Diese Aufnahme kaufen“ können Besucher ein digitales Bild in verschiedenen Abmessungen zu verschiedenen Preisen erwerben., Der Erlös wird wieder in die Umwandlung jedes digitalen Modells in reale physische Skulpturen mit einem 3D-Druck Fünf-Achsen-CNC-Bearbeitung gebündelt werden. Es ist eine nette Idee, Mitwirkende einzuladen und zeigt, wie ein Crowdfunding-Ansatz an eine typisch passive Erfahrung gebunden werden kann.
Zu den Produktionsnachweisen auf der Website gehört das New Yorker Sochnik Design Studio, aber die glatten UI-Bemühungen überschatten Shkrets Talent nie. Dazu gehört ein einfacher Galeriebereich mit noch vorhandenen Skulpturenaufnahmen, die sich durch einen wässrigen Filter kräuseln und winken., Es ist eine subtile Wirkung, aber erhöht den Sinn für Textur Shkret beabsichtigt, jedes Stück zu geben.
KOBU
Portfolio websites, nicht überraschend, weiterhin einige der fruchtbarsten boden für kreative ausdruck und inspiration. Diese Online-Visitenkarte für die portugiesische Agentur KOBU folgt diesem Ethos mit einer geschmackvollen, zurückhaltenden WordPress-Website, die immer noch Charakter hat., Die technische Arbeit, die sich als „Markenlabor“ bezeichnet, das keine Angst vor Experimenten hat, zeigt hier Vorstellungskraft gegenüber Komplexität.
Über eine Reihe von Elementen erhalten wir eine Erinnerung daran, wie CSS und SVG für ein maximales Frontend-Zeichen kombiniert werden können. Absolute Positionierung wird verwendet, um charmante Drahtbildmotive zu überlagern, die Linien zwischen fetten Hintergrundfarbblöcken aufzubrechen und Abschnitte miteinander zu verbinden. Ein gelooptes HTML5-Videopanel erhält eine einzigartige Wiggly-Kante mit einer SVG-Form als Maske, die oben positioniert ist, bevor Fallstudienbilder ihren Rahmenradius halbieren, um kreisförmig zu werden., Die Seite macht ordentlich Gebrauch von der Slick.js-Karussellbibliothek, um das KOBU-Team mit Office Horse durch die Mitte der Hauptseite zu „traben“.
Der Zenit ist jedoch wahrscheinlich das Bit, das wir zuerst sehen, indem wir uns auf einem wellenförmigen Lava-Lamp-Header öffnen, der durch Manipulieren von SVG-Pfaden erzeugt wird. Verwendung des Anime.js-Plugin, eine polyvalente JavaScript-Animations-Engine, es ist ein auffälliger Trick für die Erstellung von Farbpalette, wenn nichts anderes.,
Autor: Mark Billen
noformat
noformat ist ein strategisches Designstudio mit Sitz in New York. Die Homepage verfügt über ein animiertes Augapfeldesign, das dem Cursor des Besuchers auf dem Bildschirm folgt, während überlagerter Text alle Dinge durchläuft, die noformat erstellen kann. Um den Augapfel zu erstellen, untersuchte das Team zuerst das Design in After Effects CC, bevor es drei verwendete.,js eine interaktive Version zu bauen, erklärt Ian Brewer, Gründer und Creative Director von noformat.
„Wir haben Vertex – und Fragment-Shader verwendet, um das GPU-Rendering zu optimieren, und es pulsieren und das Noformat-Logo darin blinken lassen“, fährt Brewer fort. „Wir haben dann Nachbearbeitungseffekte angewendet, um ihm ein organischeres und weniger 3D-Aussehen zu verleihen, indem wir die Kanten verwischen und den Highlights Blüte verleihen.“
Der Rest der Website wird den Auswirkungen dieser ersten Seite gerecht, mit glatten Bildlaufübergängen und subtilen Parallaxeneffekten, die technische Fähigkeiten zeigen, ohne die Benutzerfreundlichkeit zu beeinträchtigen.,
„Wir haben WordPress für unsere Website aus Gründen der Startgeschwindigkeit und Flexibilität ausgewählt“, erklärt Brewer. „Im Laufe der Jahre haben wir eigene Bibliotheken und modulbasierte Bearbeitungssysteme entwickelt, mit denen wir eine Site schneller erstellen oder bearbeiten können als jede andere CMS-Lösung.“
Femme and Fierce
Das niederländische Experience Design Studio Wonderland hat E-Commerce mit sass für Femme and Fierce geliefert. Die WordPress-Website in-your-face, Clash-tastic Farbschema liefert die Online-Modehändler Markenbotschaft aus dem off., Animierte „Aufkleber“ – wirbelnde Lutscher, stichende Pfeile, Lippenlecken-sorgen für ein freches Gefühl und sollten mit der Snapchat/Instagram-Generation in Resonanz treten, auf die sich dieser Bereich richtet.
Püree Maison
Purée Maison ist ein kreatives und strategisches Studio mit Sitz in Paris. Seine WordPress-Website zeichnet sich vor allem durch die sonnigen gelben animierten Kritzeleien aus, die auf Hover erscheinen, Persönlichkeit in langweilige Markenaussagen einbringen und Übergänge beleben., Sie helfen dem Besucher auch, sich zurechtzufinden, und ermutigen ihn, die Website zu erkunden und mit ihr zu interagieren.
We Virtually Are
Wenn es in Ihrem Unternehmen darum geht, Menschen mit virtueller Realität zu begeistern, um emotionale Geschichten zu erzählen, benötigen Sie eine Website, die Menschen in Ihre Arbeit einbezieht. Und das VR-Studio, das wir praktisch sind, hat das geschafft und dann einige., Seine Website, die von Herdl auf WordPress erstellt wurde, verwendet viele hochmoderne Techniken, einschließlich WebGL und 360-Grad-Videos, um Ihnen einen unwiderstehlichen Eindruck von seinen immersiven Diensten zu vermitteln. Schauen Sie sich seine VR-Testfahrten für Audi an, komplett mit unerwarteten prominenten Gästen.
Asaro
Asaro ist ein Anbieter einzigartiger Abenteuererlebnisse und unterhaltsamer Reisen für Superyacht-Gäste auf der ganzen Welt., Im Rahmen einer breiteren Unternehmensumwandlung wurde diese glatte Website von der in Bristol ansässigen Agentur Green Chameleon entworfen und entwickelt.
Aufbauend auf einem benutzerdefinierten WordPress-Framework, um die laufende Bearbeitung von Inhalten für den Kunden einfach zu halten, werden die Besucher auf eine Entdeckungsreise voller Charme entführt. Subtile Scroll-Effekte sind ordentlich mit einer interaktiven gepunkteten Linie verbunden, die den Navigationsfortschritt so zeichnet, wie ein Yachtkapitän Diagramme markieren könnte., Benutzerdefinierte CGI-Renderings wurden als grafisches Gerät zur Darstellung der exklusiven Serviceangebote von Asaro verwendet, da aufgrund des privaten Charakters der Ereignisse fotografische Ressourcen knapp sind.
„Die Art Direction wurde von einer Mischung aus Wassertropfenfotografie und Theaterplakatdesign inspiriert“, erklärt Creative Director Tom Anderson. „Wir liebten die Ästhetik des Fotografie-Stils und hatten das Gefühl, dass er gut mit dem zugrunde liegenden nautischen Thema des Projekts zusammenhängt.,“
Reaktionsschnell genug, um nicht nur auf kleineren Bildschirmen schön konsistent auszusehen, sondern auch die Zugriffsgeschwindigkeit war eine Motivation, die Leistung zu optimieren. Mit Bootsbewohnern auf der Gnade der Marine Web-Konnektivität, Ladezeiten sind mehr Hacker als abgehackt über Desktop, Tablet und Handy.,
Autor: Mark Billen
Design Museum Denmark
Gebaut von der Kopenhagener Design-und Brandingagentur Stupid Studios, der Website für Dänemark das Design Museum zeigt nicht nur die Archive, Sammlungen und Forschungen des Museums, sondern präsentiert es auch in einem sehr aktuellen Stil., Von der eröffnenden SVG-Animation des Logos des Museums bis hin zum auffälligen Scrollen von Parallaxen und stimmungsaufhellenden Palettenwechseln beim Scrollen durch den Inhalt ist es die perfekte Online-Präsenz für ein wesentliches Designziel.
Katy Perry
Pop-Prinzessin Katy Perry nutzt nichts anderes als WordPress, um ihre offizielle Website zu hosten., Die Website konzentriert sich – verständlicherweise-auf Visuals und Social-Media-Hinweise und verwendet High-Spec-Portfolio-Aufnahmen des Künstlers, um eine mutige Aussage zu machen. Scrollen Sie nach unten, um Tourdaten, Merch und mehr anzuzeigen, oder verwenden Sie die Symbole, um mehr zu erfahren.
Es ist eine sauber geschnittene und dennoch kantige Website, die es schafft, das unverwechselbare Bubblegum Pop persönliche Bild des Künstlers mit einer benutzerfreundlichen, glänzenden Mag-Stil-Funktionalität zu mischen. Vorbei sind die Tage der geschäftigen Band-Sites mit zu viel Animation und Musik, die Sie nicht stoppen können., Perrys Website beweist, dass Sie mit nur einem einfachen weißen Hintergrund und leicht navigierbaren Links viel Persönlichkeit einpacken können, Fans die Möglichkeit geben, einfach und bequem zuzuhören, zu sehen und zu lernen.
Der Tintenbehälter
Ab 1989 als Collins Inkjet, ein Ein-Mann-Betrieb, der Tinte für den kontinuierlichen Tintenstrahldrucker von Kodak liefert, ist Kao Collins heute einer der weltweit führenden lieferanten., Und wenn Sie noch nie wirklich über Tinte nachgedacht haben (außer zu fluchen, wenn Ihr Drucker leer ist), wird Kao Collins‘ Website, der Tintenbehälter, das ändern.
Der von DBS Interactive erstellte Tintenbehälter ist eine auffällige WordPress-Site, die alle Register zieht, um Ihnen aktuelle Nachrichten aus der Tintenindustrie zu bringen und einige der kreativen Möglichkeiten zu präsentieren, wie Unternehmen und Künstler derzeit Tinte verwenden., Das Highlight, soweit es uns betrifft, ist die Geschichte der Druckabteilung: Ein wunderschöner Parallax-Single-Pager voller Animationen und Effekte, der Sie von Tontafeln bis zum heutigen Hochgeschwindigkeits-Single-Pass-Druck führt und einige der zukünftigen Möglichkeiten des Druckens in die Zukunft blickt.,
- 14 einfache Möglichkeiten, um Ihre Website zugänglicher zu machen
- Atemberaubende Parallaxe scrollen Websites zu erkunden
- Die besten 404 Seiten