Webdesign-Kritik # 95 WPMU DEV

Jede Woche schauen wir uns eine neue Website an und analysieren das Design. Wir werden auf beide Bereiche hinweisen, die gut erledigt werden, zusätzlich zu den Bereichen, in denen etwas Arbeit anfallen könnte. Zum Schluss bitten wir Sie, Ihr eigenes Feedback zu geben.

Die heutige Seite ist WPMU DEV, ein Marktplatz für WordPress-Themes und Plugins. Lass uns rein springen und sehen, was wir denken!

Senden Sie Ihre Site!

Wenn Sie Ihre Website für eine zukünftige Design-Kritik einreichen möchten, dauert dies nur wenige Minuten. Für die Bewertung Ihres Designs berechnen wir 49 US-Dollar - deutlich weniger, als wenn Sie einen Berater für einen Blick auf Ihre Website bezahlen würden! Hier erfahren Sie mehr.

Über WPMU DEV

WPMU bietet die besten WordPress-, Multisite- und BuddyPress-Plugins und Designs im Web. Preisgekrönt, von 145.436 Mitgliedern geliebt und seit 2004 getreten. Es ist der einzige Ort, an dem Sie großartige Multisite-Themen, das berühmte 133-Themen-Paket, fantastische Netzwerk-Startseiten und 100% BuddyPress-Kompatibilität finden werden.

Hier ist ein Screenshot eines Abschnitts der Homepage:


Erster Eindruck

WPMU DEV ist eine wunderschöne Website mit einem ansprechenden Layout und einer Unmenge an kleinen Details, die ausreichen, um diesen Designer zum Lächeln zu bringen.

Letztes Jahr haben wir uns eine andere Website in demselben Netzwerk / derselben Familie angesehen: WPMU.org. Diese Seite fühlte sich ein bisschen schlicht an. Es sah anständig aus, ähnelte aber sehr stark einer generischen Vorlage. Darüber hinaus waren die für das Layout erforderlichen Arbeiten und bestimmte Aspekte der Ästhetik, z. B. das Logo, etwas abwegig.

Nach der Kritik haben die fleißigen Leute an der WPMU diese Site komplett neu gestaltet und viele der Vorschläge, die ich in der Kritik gemacht habe, übernommen. Das Ergebnis ist ein wunderschöner neuer Blog, der alle Probleme anspricht, die ich mit dem alten hatte. Das Layout ist fantastisch (perfekt auf das Booten abgestimmt), die Ästhetik ist schön und benutzerdefiniert, sogar das Logo wurde neu gestaltet, um sich moderner zu fühlen. Sie haben ihr Spiel wirklich verbessert und Version zwei aus dem Park geschlagen.

Als sie mich um einen Blick auf WPMU DEV fragten, wusste ich gleich zu dem Zeitpunkt, dass diese Jungs allesamt darauf abzielten, großartiges Design zu einem Top-Thema zu machen. Wie das neue WPMU.org ist WPMU DEV eine wunderschöne Website mit einem ansprechenden Layout und einer Unmenge an kleinen Details, die ausreichen, um diesen Designer zum Lächeln zu bringen. Mal sehen, was es so toll macht.

Header

Wir fangen oben an und gehen die Seite nach unten. Wenn Sie die Seite laden, ist dies die Grafik, die Ihren Bildschirm ausfüllt:

Ich liebe es, dass das erste, was ich sehe, ein großes Foto einer attraktiven und freundlichen Person ist. Es hat nicht das übermäßig gestellte und formale Foto-Feeling, sondern wirkt eher authentisch und glaubhaft lässig. Gleich neben dem Bild der Frau steht ein positives Zitat der Kunden, das dem Foto der Frau einen Kontext verleiht.

Auf Anhieb haben sie einige meiner Lieblingstaktiken getroffen: lächelnde Gesichter und echtes Kundenlob. Diese Seite und somit auch WPMU DEV erscheint mir als Besucher freundlich, ansprechbar und zuverlässig, und ich bin erst seit ein paar Sekunden hier!

All dies wird durch einen soliden Aufruf zum Handeln unterstützt: Erfahren Sie mehr. An diesem Punkt ist es wahrscheinlich genau das, was ich tun möchte. Dieser Link führt Sie zu einer anderen, gleichermaßen beeindruckenden Seite. Im Moment bleiben wir jedoch bei dieser Seite und scrollen ein wenig.

Navigation

Bevor wir zum nächsten Abschnitt übergehen, wollen wir ein wenig über die Seitenstruktur sprechen. Meist handelt es sich dabei um eine einzelne Seiten-Site. Die Links in der Navigationsleiste führen Sie nicht zu separaten Seiten, sondern führen Sie zu verschiedenen Abschnitten derselben Seite. Apropos Navigationsleiste: Es ist wirklich ein sehr schlankes Stück Entwicklungs- und Designarbeit:

Zunächst erscheint die Navigation direkt unter dem Foto der Frau aus dem letzten Abschnitt. Wenn Sie jedoch die Seite nach unten scrollen, hängt es tatsächlich am oberen Rand Ihres Ansichtsfensters. Dabei taucht ein Logo auf und der Text reduziert seine Größe in einem fließenden Übergang. Dies ist die Art von Dingen, bei denen ich mich wirklich aus dem Staub mache, also bekommt die Navigation zwei Daumen hoch.

Dies ist nicht einfach nur eine Augenweide, die Navigationsleiste passt sich an den Verwendungszweck an. Oben auf der Seite gibt es bereits viel Branding, sodass das Logo nicht benötigt wird. Wenn Sie jedoch nach unten scrollen, wird das Logo eingeblendet, um Sie daran zu erinnern, wo Sie sich befinden, und dient als schneller Link, um zum Anfang der Seite zu springen. Extrem funktionell Extrem attraktiv. Es ist ein Sieg, ein Sieg.

Plugins-Abschnitt

Von hier aus springen Sie einfach von einem Abschnitt zum nächsten, während Sie die Seite nach unten scrollen. Jeder Abschnitt ist einzigartig und sieht gut aus, während er in die größere Designästhetik der gesamten Seite eingebunden wird. Hier ist der erste Abschnitt:

Wie Sie sehen, kehren diese anderen Abschnitte das Farbschema um, das wir in der Kopfzeile gesehen haben (dunkler Hintergrund, helle Hervorhebungen), wodurch sowohl Kontrast als auch Wiederholungen richtig gut zur Geltung kommen. Wenn Sie den Mauszeiger über eines der Symbole in diesem Bereich bewegen, werden die Überschrift und sogar Teile der Grafik hellgelb, wodurch der Kontrast wieder gut genutzt wird.

Ich liebe es, wie diese Icons aussehen. Es sind nicht die gleichen minimalen Symbole, die Sie in tausend verschiedenen Iterationen auf der Hälfte der Websites im Web sehen. Sie fühlen sich viel mehr Sitte und haben etwas Persönlichkeit.

Slider für die Mitgliedschaft

Als nächstes werden wir uns ein paar Abschnitte ansehen und ein wirklich ordentliches Teil der Benutzeroberfläche betrachten, das Ihnen hilft, sich für einen Mitgliedschaftsplan zu entscheiden.

Hier haben wir einen schönen großen Schieberegler, der sich über den gesamten Bildschirm erstreckt. Wenn Sie den Schieberegler von einem Monat auf drei Monate und dann auf zwölf verschieben, wird der Preis am unteren Rand zusammen mit Ihren Ersparnissen aktualisiert. Es ist ein großartiger Punkt der Interaktion, der die Fähigkeit hat, das Engagement zu steigern. Es funktioniert auch Ja wirklich Sie können den Schieberegler problemlos ziehen oder einfach irgendwo klicken, um den Preis zu aktualisieren. Egal wo Sie den Schieberegler loslassen, er springt zum nächstgelegenen Haltepunkt.

Entwickler

Der letzte Abschnitt dieser Seite, den ich betrachten möchte, zeigt Aufnahmen der Mitarbeiter und der unterstützenden Entwickler / Entwickler für WPMU. Auf einen Blick sieht es ziemlich unauffällig aus. Nur ein Raster von Thumbnails, richtig?

Es stellte sich heraus, dass diese Leute selbst diesen Abschnitt fantastisch gemacht haben. Wenn Sie den Mauszeiger über ein Bild bewegen, wird eine kleine Überlagerung angezeigt, die den Namen und die Position der Person anzeigt. Bewegen Sie den Cursor weg und die Überlagerung wird herausgeschoben. Der coole Teil ist jedoch, dass er in die Richtung, in die sich der Cursor bewegt, ein- und ausschiebt. Wenn Sie also den Cursor von einem Foto in ein anderes verschieben, sieht es so aus, als würde die Überlagerung Ihnen folgen. Es ist eine große Illusion, dass ich dreißig Sekunden lang mitspielen musste, bevor ich weitermachen konnte.

Responsives Layout

Bevor wir fertig sind, ist es definitiv erwähnenswert, dass die Website vollständig reagiert. Nachfolgend können Sie die Desktop-, Tablet- und Mobile-Versionen betrachten:

Beachten Sie, wie gut sich das Design an das Gerät anpasst, das es betrachtet. Wenn Sie sich nach unten bewegen, wird die Kernbotschaft beibehalten, jedoch werden nicht wesentliche Extras zugunsten der Effizienz des Layouts verworfen.

Gute Arbeit!

• Denken Sie immer an die Barrieren, die Sie zwischen Ihren Benutzern und einer Conversion aufstellen.


Für mich ist diese Seite erstklassig. Das Design ist perfekt, das Layout reagiert und der Messaging-Spot ist an. Ich kann schnell erkennen, worum es bei WMPU DEV geht, und ich habe Informationsquellen für alle meine Fragen.

Ich habe mich lange umgesehen und versucht, etwas zu finden, über das ich mich beschweren könnte, und ehrlich gesagt, es gibt fast nichts. Das einzige, was mich beschäftigt, ist die Anstrengung, die nötig ist, um sich tatsächlich anzumelden. Es gibt keine? Jetzt anmelden? Schaltfläche an beliebiger Stelle auf der Startseite. Sobald ich auf "Weitere Informationen" klicke? Taste, ich werde auf die Seite mit den Plänen und Preisen gebracht. Diese Seite ist attraktiv, aber ich muss kilometerweit scrollen, bevor ich zum Ende komme, wo ich endlich einen Plan auswählen und fortfahren kann.

Beachten Sie immer die Barrieren, die Sie zwischen Ihren Benutzern und einer Conversion setzen. Wenn ich mit der Absicht, mich anzumelden, auf diese Website komme, bin ich Ihr bester Besucher und Sie möchten sichergehen, dass ich einen einfachen, klaren Weg habe, um Ihnen mein Geld zu geben.

Du bist dran!

Nun, da Sie meine Kommentare gelesen haben, helfen Sie dem Designer mit ein paar weiteren Ratschlägen. Teilen Sie uns mit, was Sie an dem Design toll finden und was Sie für stärker halten könnten. Wie immer bitten wir Sie, auch den Designer der Site zu respektieren und eine klare, konstruktive Beratung ohne harte Beleidigungen anzubieten.