Webdesign-Kritik # 56 Ray Cheung

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 die Homepage von Ray Cheung, die einfach als Online-Unternehmer beschrieben wird.

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 Ray Cheung

Anstatt Websites für Kunden zu erstellen, arbeite ich gerne an meinen eigenen Projekten. Von einer Idee zu beginnen, von Anfang an mit etwas Inspiration zu entwerfen, zu codieren und dann auf der ganzen Welt zu verbreiten, gibt mir ein großartiges Gefühl der Errungenschaft. Zur Zeit verwalte ich selbst gestartete Websites mit rund zwei Millionen Besuchern pro Monat - alle mit dem Ziel, nützliche Ressourcen für die Nutzer bereitzustellen.?

Hier ist ein Screenshot der Homepage:

Erste Eindrücke

Ray Cheung ist ein Mann, der sehr wenig Designunterricht benötigt. Er hat nicht nur eine, sondern mehrere sehr erfolgreiche Web-Projekte, von denen alle großartig aussehen und seine Homepage ist keine Ausnahme.

Das übergreifende Thema ist ziemlich interessant: ein hölzerner Hintergrund mit einem Stapel Papiere, um den Inhalt aufzunehmen. Statt jedoch eine Papiertextur zu verwenden, hatte Ray einen Hintergrund mit einem Sternfeld. Es hört sich verrückt an, aber der Gesamteffekt ist ganz nett! Ich liebe es, wenn Designer etwas Unerwartetes tun, als nur mit einem Trend zu laufen.

Der gestapelte Seiteneffekt erinnert an ein beliebtes Tumblr-Thema, aber die Ähnlichkeiten hören dort wirklich auf, da Layout und Design insgesamt recht unterschiedlich sind.

Auf einen Blick mag ich wirklich, was Ray hier gemacht hat. Lass uns eintauchen und einige Abschnitte genauer betrachten.

Textur und Farbe

Wie bereits erwähnt, sind die Raum- und Holzstrukturen eine unwahrscheinliche Kombination, aber beide sind sehr gut gestaltet und scheinen perfekt zu funktionieren. Ich mag die dunkle Farbpalette, die sich aus den beiden ergibt:

Schriftarten

Wenn Sie ein ziemlich kühnes visuelles Thema haben, kann es überwältigend sein, es mit einer verrückten Typografie zu kombinieren. Die allgemeine Idee ist, dass Sie nicht zu viele Objekte um Aufmerksamkeit bemühen möchten.

Angesichts dessen entschied sich Ray für eine konservative Haltung seiner Schriftarten. Die gesamte Typografie besteht aus leicht lesbaren Sans-Serif-Schriftarten. Die Kopfzeile der Hauptsite ist fett, gefolgt von einer ultraleichten Variante (möglicherweise zu hell). Diese und die fetten, verdichteten Abschnittsheader sind Bilder mit der Live-Body-Kopie in Arial. Es wäre großartig, wenn Sie einige @ font-face-Integration sehen würden, um einige dieser Typen live zu machen, aber die Bilder sind ziemlich winzig. .

Navigation

Zwischen diesen Kritiken und unserer Designgalerie habe ich a genau unter die Lupe genommen Tonne der Website-Designs im Laufe der Jahre. Es ist nicht oft, dass ich einen Trick sehe, dem ich noch nie zuvor begegnet bin. Rays Navigation überraschte mich wirklich. Ich glaube nicht, dass ich diesen besonderen Effekt jemals gesehen habe.

Das Design dieses Abschnitts ist einfach und funktioniert gut mit der Gesamtseite. Ich liebe den Kontrast der leicht extrudierten Knöpfe und der Einfügung unter ihnen.

Wenn Sie auf eine der letzten beiden Schaltflächen klicken, wird die Seite automatisch gescrollt, um Sie zu diesem Abschnitt zu führen. Dies ist eine ziemlich typische Idee. Die beiden anderen Schaltflächen sind jedoch mit zwei Abschnitten verknüpft, die sich bereits oben auf der Seite befinden. Wenn Sie auf diese klicken, rütteln die entsprechenden Abschnitte in einer sanften Animation. Dies ist ein ziemlich einfacher Effekt, der die Site dynamischer und beinahe lebendig und freundlich erscheinen lässt.

Abschnitte

Die Seite ist in zwei vertikale Spalten aufgeteilt. Auf dem sind die verschiedenen Projekte, an denen Ray gearbeitet hat, und auf der linken Seite befinden sich verschiedene kleine Inhaltsbereiche: Über mich, Meine Fähigkeiten, Lesen und Anerkennungen.

Jeder Abschnitt wird mit einer Kopfzeile und einem kleinen Symbol gekrönt. Ein weiteres kleines Feature, das mich sofort an Tumblr denken lässt.

Diese Abschnitte sind klar zu unterscheiden und können leicht individuell angepasst werden. Jedes hat ein einzigartiges Design, aber sie sind gut miteinander verbunden. Eine kleine Sache, die ich bei den "Meine Fähigkeiten" berücksichtigen würde. Der Abschnitt färbt die horizontalen Balken so, dass sie mit ihren jeweiligen Abschnitten des Kreisdiagramms übereinstimmen. Dies würde die Konsistenz der beiden Grafiken verbessern und sofort kommunizieren, wie sie miteinander verbunden sind.

Intelligentes Scrollen

Eine andere Sache, die ich an dieser Site wirklich mag, ist, wie Ray die Scroll-Funktionalität durchdacht hat. Die linke Spalte endet beim Kontaktformular und die rechte Spalte ist deutlich länger. Wenn Sie auf der Seite nach unten scrollen, wird die gesamte Seite wie erwartet bis zum Kontaktformular durchlaufen. An diesem Punkt hört die linke Spalte auf zu scrollen und die rechte Spalte wird fortgesetzt.

Solche Berührungen zeigen nur, wie viel Zeit damit verbracht wurde, darüber nachzudenken, wie die Website benutzerfreundlicher gestaltet werden kann.

Lichten aus!

Eines der wenigen Dinge, bei denen ich auf der Baustelle nicht ganz sicher war, war der Schalter oben, um das Licht auszuschalten. Ich hatte erwartet, dass sich das Thema ändern würde, sobald ich diesen Schalter betätigte. Vielleicht würde der hölzerne Hintergrund in Schwarz übergehen und mehr Sterne oder etwas anderes zeigen, das ebenso interessant ist.

Wenn Sie jedoch auf den Schalter klicken, erhalten Sie Folgendes:

Ich verstehe die Botschaft hier: Sparen Sie Energie, indem Sie das Licht ausschalten. Die Implementierung ist jedoch etwas umständlich. Auf dieser Seite können Sie nicht zur Website zurückkehren, wenn Sie die Schaltfläche gedrückt haben, um zu sehen, was sie getan hat, und Sie werden auch nicht an ein anderes Projekt weitergeleitet, z.Ein weiteres verwirrendes Element ist die? Batterie ist schwach? Nachricht in der Site-Fußzeile. Dies kann mit der Nachricht in der Kopfzeile verbunden sein, ist aber ziemlich unklar.

Ich denke, dass die Absichten hier gut sind, aber das Ergebnis verringert meine wahrgenommene Qualität der Website und ich denke, wenn diese beibehalten werden, müssen sie neu überdacht werden.

Fazit

Zum Schluss denke ich, dass Ray hier eine großartige Webseite erstellt hat, um Sie mit sich selbst vertraut zu machen. Die Seite zeigt eindeutig, wer er ist und was er macht und sieht dabei toll aus. Das Layout ist logisch und leicht zu folgen, das Design ist einzigartig und interessant und der Inhalt ist zum größten Teil relevant.

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.