Web Design Critique # 13 Annual Design Awards

Jede Woche schauen wir uns eine neue Website an und analysieren das Design. Wir werden sowohl auf die Bereiche hinweisen, die gut erledigt werden, als auch auf die Bereiche, in denen etwas Arbeit benötigt wird. Zum Schluss bitten wir Sie, Ihr eigenes Feedback zu geben.

Die heutige Website ist Annual Design Awards.

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 jährliche Designpreise

Die Annual Design Awards (Spitznamen ANNDAS) sind eine weltweite Anerkennung der innovativen visuellen Kommunikation, mit der herausragende Beiträge der Designbranche honoriert werden sollen. Wir haben einige der erstaunlichsten Talente und angesehenen Persönlichkeiten aus der ganzen Welt zusammengebracht, um dieses globale Ereignis zu beurteilen, das die wichtigsten Designpreise werden soll und internationale Standards setzen soll.?

Hier ist ein Screenshot der Homepage:

Gesamtkonzept

Ich möchte damit sagen, dass dies bereits eine großartige Seite ist. Ich liebe das Schwarze in Verbindung mit Orangen. Diese einmalige Wiederholung einer hellen Farbe hilft, die Augen des Benutzers auf die wichtigen Teile der Seite zu lenken.

Das Layout ist solide und enthält viel weißen Raum. Das visuelle Volumen der Objekte ist außerdem gut verteilt, sodass die wichtigen Bereiche hervorgehoben werden.

Glücklicherweise scheinen die Leute, die das Design anderer beurteilen, selbst ein starkes Designgefühl zu haben! Nachdem wir das Ganze analysiert haben, lassen wir es Stück für Stück aufschlüsseln.

Logo-Bereich

Beginnen wir am naheliegendsten Ort: oben links. Hier sehen wir das Annual Design Awards-Logo als eine Art Kreiskreise-Grafik.

Das Logo ist einfach aber effektiv. Es deutet an, dass ein junges und nervöses Publikum nicht zu scharf auf klare Linien und langweiligen Minimalismus (die Seite ist eigentlich ziemlich sauber, aber auf eine hinterlistige Art und Weise).

Die Kreise sind eine mutige Idee, die auf subtile Weise ausgeführt wird (geschmackvoll ausgeführt). Es ist ein wirklich einfaches Designelement, das Sie auf das Logo und damit auf den Namen der Site aufmerksam macht. Dies funktioniert nicht auf einer überladenen Site, aber diese Seite ist so einfach, dass sie kein visuelles Durcheinander verursacht und ihren Zweck perfekt erfüllt.

Navigation

Der Navigationsbereich ist ziemlich einfach, nur Text über einer horizontalen Leiste mit Unterbrechungen für jeden Abschnitt.

Ich mag die Schriftwahl hier sehr. Es fühlt sich an, als hätte man etwas mit @ font-face gemacht, also war ich überrascht, als ich mir den Code anschaute und sah, dass es einfach nur Georgia Italic war.

Wenn Sie den Mauszeiger über einen Abschnitt bewegen, wird die Leiste orange markiert. Das ist schön, aber es fühlt sich ein bisschen komisch an, dass der Text nicht auch etwas tut (dies ist ziemlich pingelig, aber auf großartig aussehenden Seiten muss ich über etwas sprechen!).

Ich kann verstehen, warum der Designer den Text nicht so gut geändert hat, da es wahrscheinlich ein wenig schwierig werden würde, kleinen orangefarbenen Text auf schwarzem Hintergrund zu lesen. Vielleicht hilft eine sehr leichte CSS-Transformation, um den Text im Schwebeflug zu drehen. Es ist keine große Sache, wenn es bei älteren Browsern ignoriert wird und es wäre eine nette Nennung des Logo-Stils.

Diashow

Ich liebe JavaScript-Diashows, daher finde ich diesen Abschnitt großartig. Das Bild, das als neues hinterlassen wird, erscheint und der Text hat einen schönen Ausblendeffekt. Ich mag auch den transparenten Rand und die Schnittmarken.

Der Play- und Pause-Button hier schneidet es jedoch nicht für mich ab. Ich sah einen grafischen Vorbeiflug, den ich noch einmal anschauen wollte, konnte aber nicht zurück. Folglich musste ich warten, bis es wieder kam (was eine Weile dauerte).

Ich empfehle, eine Reihe von kleinen Kreissymbolen zu setzen, die auf jedes Bild verweisen. Es ist einfach und subtil und gibt dem Benutzer sowohl ein Gefühl dafür, wo er sich in der Diaschau befindet, als auch einige Kontrolle über das Anzeigen bestimmter Bilder.

Eintragsbereich

Der nächste Abschnitt ist der Bereich, in dem sich Benutzer normalerweise zur Anmeldung anmelden. Dies ist jedoch vorerst geschlossen, wie durch die Haftnotiz-Grafik angezeigt.

Das Sticky verstößt (absichtlich) vollständig gegen das Design und macht es so, dass Sie die Tatsache nicht übersehen können, dass die Einreichungen geschlossen sind. Dies funktioniert gut und informiert Benutzer sofort über die Informationen, die sie kennen müssen.

Die Grafiken unter dem Sticky sind etwas ablenkend. Die Preise scheinen seltsam platziert zu sein: Einer stößt links in den rechteckigen Kasten und der andere stößt nicht an. Ich weiß nicht genau, was hier passiert, aber es scheint ein bisschen abzulenken.

Fußzeile und Kontaktformular

Der letzte Bereich, den wir uns ansehen, ist der untere Teil der Seite, in dem Sie sich anmelden können, um Informationen zu erhalten. Es gibt auch die Standard-Fußzeilen-Links und soziale Informationen unter dem Kontaktformular.

Ich finde es gut, dass das Kontaktformular hier eingebettet ist und nicht auf einer eigenen Seite. Es gibt nur zwei Felder, die ausgefüllt werden müssen. Ich habe bemerkt, dass die Feldbeschriftungen verschwinden, wenn Sie in das Kästchen klicken, und nicht zurückkommen, wenn Sie mit der Maus klicken, ohne etwas einzugeben. Dies ist ein wenig ein Problem mit der Benutzerfreundlichkeit, da ich auf der Seite herumgeklickt habe, aber nicht wusste, welches Kästchen für den Namen und welches für die E-Mail war, als ich zurückkam.

Schließlich sieht der Fußzeilenbereich gut aus, aber ich möchte etwas Abstand zwischen den Wörtern sehen: "Folgen Sie uns". und das zugehörige Symbol. Im Moment sind sie ein bisschen zusammengedrückt.

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.

Möchten Sie Ihre eigene Website kritisieren? Hier erfahren Sie mehr.