Web Design Critique # 57 Okay Geek

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 Okay Geek, ein großartiger Gadget- und Tech-Blog.

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 Okay Geek

Okay Geek, früher unter dem Namen? T3ch H3lp? Bekannt, ist ein nachdenklicher Technologie-Blog, der sich bemüht, geeky ursprünglichen Inhalt für Leute mit einer Leidenschaft für Technik zu bringen. Wir haben Okay Geek von Grund auf mit Squarespace und unseren eigenen benutzerdefinierten Tools gebaut. Wir möchten, dass Okay Geek eine schnelle, gut gestaltete und benutzerfreundliche Website ist, und wir glauben, dass wir das sehr gut gemacht haben.

Hier ist ein Screenshot der Homepage:

Erster Eindruck

Wissen Sie, ich habe fast sechzig dieser Kritiken geschrieben. Anfangs war es ziemlich einfach, ich erhielt viele Einreichungen, die großartig waren, aber einige solide Bereiche, die verbessert werden mussten. In letzter Zeit haben es mir die Einreicher nicht so leicht gemacht. Okay Geek ist eine dieser Seiten.

Es ist ziemlich einfach, eine hässliche Seite zu kritisieren, aber diese ist großartig. Obwohl ich ein bisschen auf der Template-Seite bin, was Tech-Blogs angeht, ist dies definitiv einer der attraktiveren, die ich in letzter Zeit gesehen habe. Ich meine, hast du Gizmodo in letzter Zeit gesehen? Aber ich schweife ab?

Okay Geek ist eine großartig aussehende Website mit Inhalten, die ich wirklich interessant finde. Nachdem Sie diesen Bericht gelesen haben, sollten Sie unbedingt auf der Website vorbeischauen.

Schauen wir uns ein paar Dinge an, die ich an Okay Geek mag.

Viel Whitespace

Whitespace ist ein schwer zu bestimmendes Tier. Viele Designer scheinen Angst davor zu haben und stauen alles auf der Seite extrem eng zusammen. Andere Benutzer kommen in die Falle, dass sie immer eine voreingestellte Rinnenbreite in einem CSS-Framework verwenden und nie wirklich analysieren, ob die Elemente wirklich mehr Platz zum Atmen brauchen oder nicht.

Whitespace ist etwas, das Sie pro Entwurf analysieren sollten. Es gibt keine Zauberformel, die für jede Website am besten funktioniert. Okay Geek hat das traditionelle Envato-artige Blog-Layout wirklich geöffnet und jeder Spalte viel Raum gegeben. Das Ergebnis ist ein schönes, luftiges Gefühl, das jedem einzelnen Stück die Betonung gibt, die es braucht, um sich vom Rest des Inhalts abzugrenzen.

Eine kleine Anmerkung, das Kästchen rechts im Bild oben ist nur eine bisschen zu hoch. Bump ein paar Pixel nach unten, um es an der linken Spalte auszurichten.

Adaptiver Whitespace

Vielleicht noch wichtiger ist die Tatsache, dass der Leerraum auf Browserfenster unterschiedlicher Größe wirklich gut anspricht. Wenn das Fenster kleiner oder größer wird, nimmt das Layout kleinere Anpassungen vor, wodurch das Layout auf engstem Raum zusammengepresst wird, während alles gut lesbar bleibt.

Vorschlag: Medienabfragen

Ein Vorschlag, bei dem Sie wahrscheinlich viel anfangen werden, ist die Einbindung von Medienabfragen, damit die Website bei einigen voreingestellten generischen Größen besser aussieht. Okay Geek verfügt bereits über eine hervorragende mobile Website für Smartphones, aber Medienabfragen und benutzerdefinierte Stile könnten dazu beitragen, das Design für dazwischenliegende Layouts in Tablettgröße zu optimieren.

Ein Slick-Header

Ich bin ein Trottel für einen gut aussehenden Header. Für Websites wie diese dienen sie wirklich als Cover, an dem Sie das Buch beurteilen. Hier ist die Kopfzeile schön groß und enthält die erforderlichen Such- und Navigationselemente genau dort, wo Sie sie erwarten würden, und verfügt über drei große Artikelbilder mit schönen animierten Hover-Effekten.

Wenn Sie diese Artikel direkt in der Kopfzeile platzieren, können Sie die Benutzer sofort anziehen. Ich weiß, dass ich einem Klick kaum widerstehen kann, wenn ich eine Geschichte über The Legend of Zelda sehe!

Nice Post Previews

Eine andere Sache, die ich wirklich mag, ist das allgemeine Design der Post-Vorschauen. Sie sind nett und groß mit viel Teaser-Inhalt. Ich liebe besonders diese riesigen Bilder, die Sie wirklich in ihren Bann ziehen (obwohl ich denke, dass die Site einen Performance-Hit für sie erleidet).

Ich kann sagen, dass viele Gedanken und Anstrengungen unternommen wurden, um diese Seite so gut aussehen zu lassen, wie sie aussieht. Es gibt viele kleine Berührungen, die einen langen Weg gehen, wie zum Beispiel die Tatsache, dass beim Schweben über einer Beitragsvorschau der kleinste Schatteneffekt erscheint. Eine wirklich nette Geste!

Vorschlag: Textausrichtung und Schaltfläche Speichern

Ich habe zwei kleine Bedenken in diesem Bereich. Erstens ist der Absatztext unten zu weit links. Es sollte die gleichen Ränder wie der andere Inhalt in der Box haben, aber es scheint aus diesen herauszubrechen und kommt unbeholfen nahe an den Rand heran.

Ich liebe auch die Instapaper-Integration direkt von der Startseite. Mein einziges Problem ist, dass es keine Möglichkeit gibt zu erkennen, dass die Schaltfläche "Speichern" eine Verknüpfung zu Instapaper ist. ?Speichere das? ist ein wenig vage und nicht unbedingt ein Begriff, den wir in einem Blog-Kontext kennen. Vielleicht ein? Auf Instapaper speichern? Button wäre passender.

Eine nützliche Seitenleiste

Das allgemeine zweispaltige Layout von Okay Geek ist ziemlich beliebt, aber die rechte Spalte wird normalerweise mit Unordnung und nutzlosem Müll überlaufen, den niemand sehen möchte. Ich fand die Okay Geek-Seitenleiste jedoch sehr interessant. Wenn Sie sich die Mühe machen, relevantes Material für diesen Abschnitt zu erstellen, können Sie den Bereich wirklich für Ihre Nutzer rechtfertigen, anstatt ihn lediglich als Werbefläche zu nutzen. Dies hilft auch tatsächlich, Ihre Inserenten einige Ansichten zu bekommen!

Ernsthaft sozial

Okay Geek scheut keine Mühe, um Sie dazu zu bringen, dass Sie Ihre Inhalte mit Ihren Freunden teilen.Dieses Unterfangen kann leicht übertrieben sein, insbesondere wenn die verschiedenen sozialen Links und Schaltflächen über die gesamte Site verteilt sind.

Jeder kleine soziale Bereich ist jedoch so gestaltet, dass er genau in das Blog-Thema passt, sodass das Ergebnis keineswegs überladen ist. Blogs leben und sterben durch soziale Medien, solide Integrationen sind daher ein Muss!

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.