Willkommen zu unserer 30. Designkritik! 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 Website ist Gray Ang, das persönliche Portfolio eines Webdesigners in Malaysia.
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 Grey Ang
Mein Name ist Gray und ich bin ein Webdesigner und Frontend-Entwickler aus Kuala Lumpur, Malaysia. Ich recherchiere, plane, gestalte und programmiere Websites. Ich bin ein guter Freund von Photoshop und HTML / CSS / jQuery und mache Kunden, Benutzer und Maschinen glücklich.
Hier ist ein Screenshot der Homepage:
Wie Sie sehen, ist die Site auf einem bunten Spektrum mit einer Tag-Cloud mit reduzierter Opazität aufgebaut, die beispielsweise "Webdesign" enthält. und? CSS3 ?. Was Sie nicht aus dem Screenshot erhalten, ist, dass der Hintergrund auch ein animiertes Element hat. Es gibt mehrere verschwommene Kreise, die hinter dem Inhalt treiben. Klicken Sie auf einen der Screenshots, um die Site zu besuchen und sie in Aktion zu sehen.
Diese Website ist ziemlich klein und einfach. Daher werden wir uns jede Seite ansehen und analysieren, wie die Ästhetik das Benutzererlebnis beeinflusst.
Zuhause
Ich schätze auf jeden Fall die Arbeit, die in die Ästhetik der Website eingeflossen ist. Die Umgebung ist sehr schön. Das Problem bei der Erstellung eines solch komplexen Hintergrunds besteht jedoch darin, dass Sie schließlich Inhalte darauf platzieren müssen. Dies kann eine sehr schwierige Aufgabe sein.
Die großen, verblassten Wörter im Hintergrund verringern die Lesbarkeit des Textes auf der Homepage. Der Hauptabschnitt ist auf keinen Fall unmöglich zu lesen, aber das Design ist im Bereich des Textes ziemlich beschäftigt und zwingt die Benutzer, etwas härter als sonst zu arbeiten.
Des Weiteren neigt das Rot als Schwebefarbe und als Schwerpunkt dazu, sich im Hintergrund zu verlieren. Dies ist verständlich, da es einfach nicht leicht ist, eine Farbe zu finden, die sich gut von einem mehrfarbigen Hintergrund abhebt. Sie möchten jedoch immer noch visuelle Dissonanz vermeiden.
Die einfachste Lösung für all diese Probleme, und in der Tat die meisten, die wir heute besprechen werden, könnte darin bestehen, einfach einen leicht transparenten schwarzen Hintergrund hinter den gesamten Inhalt zu setzen. Dies gibt dem Inhalt mehr einen soliden Grund zum Stehen und erlaubt dem Designer, den aktuellen Hintergrund beizubehalten.
Sie können auch eine Art Kopfgrafik zu dieser Seite hinzufügen. Ich fand es wirklich toll, wie das Foto auf der? Seite stand auf und ich denke, dass diese Idee hier dupliziert werden könnte.
Über
Hier sehen wir eine weitere Seite, die recht attraktiv ist, jedoch unter den gleichen Problemen leidet, die oben erwähnt wurden. Ich mag das interessante Layout hier jedoch. Die Navigation bleibt unverändert, während der andere Inhalt durchgeblättert wird und die Seite in klar getrennte und schön angeordnete Spalten unterteilt ist.
Die Info-Seite ist in drei separate Unterseiten unterteilt: Einführung, Wiederaufnahme und "Dinge, die ich mache." Dadurch kann der Designer ziemlich viel Inhalt einfügen, während die primäre Navigation äußerst einfach gehalten wird.
Arbeitet
Die Werke? page ist eine großartige Anordnung von Thumbnails und Texten, die wiederum zu dedizierten Projektseiten wie den unten gezeigten führen. Die Thumbnails haben eine schöne dicke Umrandung, die sie vom Hintergrund abhebt. Das Zitat oben links ist groß und mutig genug, um lesbar zu sein.
Ich finde die richtige Ausrichtung des großen Zitats jedoch etwas unbeholfen. Alles auf der Seite hat eine starke Ausrichtung nach links, und obwohl es oft effektiv ist, eine Regel wie diese absichtlich zu brechen, glaube ich nicht, dass sie hier funktioniert. Die allgemeine Form des Absatzes ist unregelmäßig, so dass es bei richtiger Ausrichtung nur schwer lesbar ist.
Kontakt
Die letzte Seite der Site ist der? Kontakt? Seite. Dieses enthält einige Textabschnitte und ein einfaches, aber stilvolles Kontaktformular. Das erste, was mir hier aufgefallen ist, war, dass das Zitat oben auf der Seite ein wenig abgenutzt ist. Sie können versuchen, es unabhängig von den Anführungszeichen links auszurichten, so dass das? T? in dem? und sie? in? Meilen? eine harte Linie bilden. Dies sollte dazu beitragen, dass sich die linke Ausrichtung etwas stärker anfühlt als derzeit.
Außerdem sind die Felder im Formular so transparent, dass sie nahezu unsichtbar sind. Auch dies mag zwar schön aussehen, leidet jedoch unter der Verwendbarkeit. Denken Sie daran, dass die Ästhetik einer Seite ein Hauptziel hat: den Inhalt auf attraktive Weise hervorzuheben. Ihr Design sollte dazu dienen, die Benutzerfreundlichkeit zu erhöhen und nicht im Namen des Stils zu opfern.
Wenn Sie auf ein Feld klicken, um mit der Eingabe zu beginnen, erhöht sich die Deckkraft und es wird viel deutlicher. Ich würde vorschlagen, diese Deckkraft auf den Standardzustand zu setzen und sie bei der Auswahl noch weiter zu erhöhen.
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.