Webdesign-Kritik Nr. 30: Gray Ang
Willkommen zu unserer 30. Designkritik! Jede Woche schauen wir uns eine neue Website an und analysieren das Design. Wir werden sowohl auf die Bereiche hinweisen, die gut gemacht sind, als auch auf diejenigen, die etwas Arbeit gebrauchen könnten. Abschließend 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 Designkritik einreichen möchten, dauert es nur wenige Minuten. Für die Kritik an Ihrem Design berechnen wir 24 US-Dollar - deutlich weniger, als Sie für einen Berater bezahlen würden, der sich Ihre Website ansieht! Mehr erfahren Sie hier.
Über Gray Ang
„Mein Name ist Gray und ich bin Webdesigner und Front-End-Entwickler in Kuala Lumpur, Malaysia. Ich recherchiere, plane, entwerfe und codiere Websites. Ich bin mit Photoshop und HTML / CSS / jQuery gut befreundet und mache Kunden, Benutzer und Maschinen glücklich. “
Hier ist ein Screenshot der Homepage:
Wie Sie sehen können, basiert die Site auf einem farbenfrohen Spektrumhintergrund mit einer Tag-Cloud mit reduzierter Opazität, die Dinge wie „Webdesign“ und „CSS3“ enthält. Was Sie aus dem Screenshot nicht erhalten, ist, dass der Hintergrund auch ein animiertes Element enthält. Es gibt mehrere verschwommene Kreise, die hinter dem Inhalt schweben und herumschießen. Klicken Sie auf einen der folgenden Screenshots, um die Site zu besuchen und sie in Aktion zu sehen.
Diese Seite ist eigentlich ziemlich klein und einfach, daher werden wir uns jede Seite ansehen und analysieren, wie sich die Ästhetik auf die Benutzererfahrung auswirkt.
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 beim Erstellen eines so komplexen Hintergrunds besteht jedoch darin, dass Sie eventuell Inhalte darauf platzieren müssen, was eine sehr schwierige Aufgabe sein kann.
Die großen, verblassten Wörter im Hintergrund beeinträchtigen die Lesbarkeit des Textes auf der Homepage. Der Hauptabsatz ist keineswegs unmöglich zu lesen, aber das Design ist im Bereich des Textes ziemlich beschäftigt, was die Benutzer dazu zwingt, etwas härter zu arbeiten, als sie es normalerweise tun würden.
Außerdem geht das Rot, das als Schwebefarbe und Hervorhebungspunkt verwendet wird, im Hintergrund verloren. Dies ist verständlich, da es einfach nicht einfach ist, eine Farbe zu finden, die sich gut von einem mehrfarbigen Hintergrund abhebt. Sie möchten jedoch weiterhin visuelle Dissonanzen vermeiden.
Die einfachste Lösung für all diese Probleme, und in der Tat die meisten, die wir heute diskutieren werden, könnte darin bestehen, einfach einen leicht transparenten schwarzen Hintergrund hinter den gesamten Inhalten zu platzieren. Dies gibt dem Inhalt mehr solide Grundlage und ermöglicht es dem Designer, den aktuellen Hintergrund beizubehalten.
Sie können dieser Seite auch eine Art Header-Grafik hinzufügen. Mir hat sehr gut gefallen, wie das Foto auf der Seite "Über" auffiel, und ich denke, diese Idee könnte hier dupliziert werden.
Über
Hier sehen wir eine andere Seite, die sehr attraktiv ist, aber unter den oben genannten Problemen leidet. Ich mag das interessante Layout bei der Arbeit hier. Die Navigation bleibt fest, während der andere Inhalt einen Bildlauf durchführt und die Seite in klar getrennte und übersichtliche Spalten unterteilt ist.
Die Seite "Info" gliedert sich in drei separate Unterseiten: Einführung, Lebenslauf und "Dinge, die ich tue". Auf diese Weise kann der Designer eine ganze Reihe von Inhalten einfügen und gleichzeitig die primäre Navigation ganz einfach halten.
Funktioniert
Die Seite „Werke“ ist eine großartig aussehende Anordnung von Miniaturansichten und Texten, die wiederum zu dedizierten Projektseiten wie den unten gezeigten führen. Die Thumbnails haben eine schöne dicke Randbehandlung, die ihnen hilft, sich vom Hintergrund abzuheben, und das Zitat oben links ist groß und fett genug, um lesbar zu sein.
Ich finde die richtige Ausrichtung des großen Zitats allerdings etwas umständlich. Alles auf der Seite ist stark links ausgerichtet, und obwohl es oft effektiv ist, absichtlich gegen eine solche Regel zu verstoßen, glaube ich nicht, dass sie hier funktioniert. Die allgemeine Form des Absatzes ist unregelmäßig, was das Lesen mit der richtigen Ausrichtung ziemlich schwierig macht.
Kontakt
Die letzte Seite der Site ist die Seite "Kontakt". Dieser enthält einige Textabschnitte und ein einfaches, aber stilvolles Kontaktformular. Das erste, was mir hier aufgefallen ist, war, dass sich das Zitat oben auf der Seite etwas falsch anfühlt. Sie können versuchen, es unabhängig von den Anführungszeichen nach links auszurichten, sodass das „T“ in „The“ und das „m“ in „Miles“ 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 schön aussehen, aber die Benutzerfreundlichkeit leidet. Denken Sie daran, dass die Ästhetik einer Seite ein vorrangiges Ziel hat: den Inhalt auf attraktive Weise hervorzuheben. Ihr Design sollte dazu dienen, die Benutzerfreundlichkeit zu erhöhen, und es nicht im Namen des Stils 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 Auswahl noch weiter zu erhöhen.
Du bist dran!
Nachdem Sie meine Kommentare gelesen haben, können Sie dem Designer weitere Ratschläge geben. Lassen Sie uns wissen, was Ihrer Meinung nach am Design großartig ist und was Ihrer Meinung nach stärker sein könnte. Wie immer bitten wir Sie, auch den Designer der Website zu respektieren und klare konstruktive Ratschläge zu geben, ohne harte Beleidigungen.