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 Adminizio.
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 24 US-Dollar - deutlich weniger, als wenn Sie einen Berater für einen Blick auf Ihre Website bezahlen würden! Hier erfahren Sie mehr.
Über Adminizio
Adminizio ist ein Satz universeller XHTML / CSS-Vorlagen, die als Benutzeroberfläche für ein Content-Management-System, einen E-Shop, ein Intranet und andere Online-Anwendungen verwendet werden. Adminizio ist für alle intelligenten Programmierer und Webdesigner gedacht, die ihre Arbeit einfacher machen möchten.
Hier ist eine Ansicht der Homepage:
Erste Eindrücke
Auf einen Blick mag ich das Design dieser Seite sehr. Der Designer hielt sich strikt an klare Corporate-Design-Prinzipien mit einigen visuellen Akzenten.
Es ist definitiv ein ziemlich typisches Design, das keine Formen zerbricht, aber wie so oft bei Websites wie diesen, ist es nicht nötig, etwas drastisch Revolutionäres zu schaffen. Einfach und vertraut mag einige Designer anstößig sein, aber Unternehmen in der realen Welt wünschen sich oft genau das.
Das Layout
Ich mag es oft, ein visuelles Layout auf seine Grundformen zu vereinfachen, so dass ich wirklich ein Gefühl für die räumlichen und Größenbeziehungen bekommen kann, ohne von den visuellen Elementen abgelenkt zu werden. Hier ist ein grundlegender Versuch mit dieser Seite:
Hier sehen wir, dass das Layout zum größten Teil recht stark und gut ausgeführt ist. Ich sehe jedoch ein paar kleine potenzielle Probleme, die ich in Betracht ziehen würde.
Die erste davon ist unten dargestellt. Der eingefangene Leerraum zwischen der Kante des Hauptinhaltsfelds und dem vertikalen Container ist recht klein (etwa 13 Pixel), verglichen mit dem allgemeinen Abstand, der im restlichen Design zu sehen ist. Dadurch fühlt sich dieser Bereich etwas klaustrophobisch an. Interessanterweise wäre es meiner Meinung nach gut, das Design an den Rand zu bringen, aber wenn man es so nahe an den Rand bringt, ohne durchzukommen, fühlt es sich etwas unbeholfen an.
Das nächste ist ein viel kleineres Thema, aber immer noch sehr auffällig und war eines der ersten Dinge, die mir aufgefallen sind. Beachten Sie, dass der Abstand auf der rechten Seite des Absatzes zu groß erscheint. Die Kante stimmt nicht mit der klaren Linie überein, die durch die Objekte darüber und darunter erstellt wird.
Normalerweise würde ich mich nicht zu sehr darum kümmern, den Raum auf jeder Seite eines unregelmäßigen Abschnitts genau zu spiegeln, aber das Design der Seite ist so streng berechtigt, dass dies sich wie eine unnötige Verletzung anfühlt. Diesen Absatz etwas zu strecken, sollte nicht zu schwer sein. Als ich in Safari ein bisschen damit spielte, fiel mir auf, dass der Block viel schöner fließt, wenn Sie diesen Text um 10% reduzieren oder erhöhen.
Das letzte Layoutproblem, das ich sehe, ist die Zeile über die Kompatibilität zwischen Browsern. Hier hat der Designer zwei starke Inhaltsspalten aufgestellt, die sich an einen strengen visuellen Block halten. Aber dann kommt diese Linie und bricht das Layout durch Strecken in die andere Spalte.
Mein Vorschlag ist, diese Zeile einfach zu verkleinern oder in zwei Zeilen aufzuteilen, damit das aktuelle Layout der Spalten nicht unterbrochen werden muss.
Pingelig?
Diese Layoutprobleme mögen klein erscheinen, vermitteln mir aber eine schlechte Nachricht darüber, wie die Seite erstellt wurde. Sie haben das Gefühl, dass die Seite von einer Person gestaltet wurde und dann von einer anderen Person mit Inhalt gefüllt wurde, die das Layout nicht ganz verstanden hat. Dies vermittelt sofort den Eindruck einer modifizierten Pre-Fab-Vorlage (interessant, da genau dies die Site verkauft). Vorlagen sind großartig, aber das Brechen etablierter Layouts kann und sollte vermieden werden.
Download-Link
Eine Sache, die mir bei diesem Entwurf immer wieder auffiel, war der Pfeil in der rechten unteren Ecke der Seite. Einerseits ist dies eine gute Sache, aber ich denke, dass dies eine schlechte Ausführung einer guten Absicht ist.
Das Wort? Herunterladen? ist so weit vom Pfeil entfernt, dass sie fast nicht verbunden erscheinen. Außerdem ist das Bild des Pfeils kein Link, um etwas herunterzuladen. Ich bemerkte, dass ich, während ich das Design untersuchte, immer wieder unter diesen Pfeil schaute, um zu sehen, wohin es zeigte! Tatsächlich lenken die Grafiken meine Aufmerksamkeit, aber sie gehen ins Nichts, was den unerwünschten Effekt haben kann, dass Benutzer das Gefühl haben, mit der Seite fertig zu sein.
Ich schlage vor, den Pfeil neben das Wort "Herunterladen" zu setzen. so dass die Nachricht durch die Grafik verstärkt wird und umgekehrt. Sie könnten auch in Betracht ziehen, den Pfeil zu erstellen, das Wort "Herunterladen". oder beides ein Link. Ein Aufruf zum Handeln ist im Marketing eine heilige Sache, und im Internet ist das Aktionswort oft der logische Ort, an dem ein Benutzer klicken kann. Wenn ein Benutzer etwas herunterladen möchte, wird er wahrscheinlich auf das Wort "Herunterladen" klicken. (Auch wenn der Name des heruntergeladenen Objekts ein starker Aktionspunkt ist, insbesondere für Benutzer, die die Seite durchsuchen, die danach sucht). Vielleicht erweitern Sie einfach den Link so, dass er sich erstreckt? Download Free Admin Template.?
Oh, und definitiv die Rechtschreibung auf das Wort "Vorlage" korrigieren.
Dinge gut gemacht
Die oben genannten Punkte gehören zu den einzigen Problemen, die ich mit dem Design sehe. Insgesamt ist es eine nahezu perfekte Ausführung, die nur wenige Änderungen erfordert. Ich möchte die Kritik beenden, indem ich die starken Bereiche des Designs bespreche, aus denen wir lernen können.
An erster Stelle steht die visuelle Hierarchie. Die Homepage verwendet Grafiken und Farben sparsam, um Ihre Aufmerksamkeit auf einige wichtige Punkte zu lenken. Auf diese Weise liest der Benutzer diese Seite in Wirklichkeit ein sorgfältig konstruierter Pfad, der vom Designer erstellt wurde.Da diese Seite ein Produkt verkauft, ist das Produkt das Haupthighlight, und die wichtigsten Punkte sind die Screenshots der Vorlagen.
Als visuelle Stärke liebe ich die Nutzung des Spektrums in der Nähe der Spitze. Dies ergibt eine brillante Grafik, die Ihre Aufmerksamkeit wirklich erregt. Weitere Beispiele für diese Technik finden Sie in unserem Artikel über 25 brillante Anwendungen farbiger Spektren im Webdesign.
Ein weiterer großer Aspekt dieser Grafik ist, dass sie auf der gesamten Website geschmackvoll wiederholt wurde. Der Designer hat den oberen Teil der abgerundeten Box abgehackt und für die Kontinuität auf den anderen Seiten platziert. Wie ich bereits in unserer letzten Designkritik erwähnt habe, ist Wiederholung bei richtiger Anwendung ein mächtiges Werkzeug (insbesondere für das Branding). Dies ist ein perfektes Beispiel.
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.