„Wenn es etwas gibt, von dem Sie nicht wollen, dass es irgendjemand erfährt, sollten Sie es vielleicht ohnehin nicht tun.“
Eric Schmidt (bis April 2011 Chief Executive Officer von Google)
Webdesign-Prinzipien: Horizontales Scrollen
Ein „No-Go“ auf Webseiten ist eigentlich seit Anbeginn des Webdesigns eine horizontale Scrollleiste. Verachtende Blicke seitens des Kundens, der Vorgesetzten, Kollegen waren sicher, wenn bei der HTML-Umsetzung eine Scrolleiste an der falschen Stelle auftauchte. Geschweige denn, wenn bei der Konzeption oder beim Design ein bewusstes hoizontales Scrollen eingeplant wurde.
Dieses Prinzip rührt historisch zum einen auf der Tatsache, dass Mäuse (lange) keine Möglichkeit anboten horizontal zu scrollen. Zum anderen geht es gegen die im Laufe der (Internet-)Jahre vom Anwender gelernten Leserichtung, die auf fast 100% der Webseiten nach unten führt und auch ein akzeptiertes und schnell verinnerlichtes vertikales Scrollen mit sich brachte.
Dagegen stehen die klassichen Printpublikationen, bei denen das horizontale Scrollen, sprich „Blättern“, auch intuitiv ist und keiner auf die Idee käme Magazine vertikal blätternd zu produzieren (obwohl es es mal eine pfiffige Idee wäre..).
So aber sind horizontale Scrolleisten bis heute verpönt. Fast überall, denn die ungeschriebene Regel hat natürlich ihre Ausnahmen. Die genau da liegen, wo das horizontale Scrollen nicht nervig oder mühselig ist, weil vielleicht nur wenige Wörter nicht zu lesen sind oder es einfach auf schlechter HTML-/CSS-Umsetzung beruht. Die Ausnahmen sind da, wo es als Stilmittel eingesetzt wird, wo bewusst eine andere Art der Benutzerführung gesucht wurde, wo sich die Seite bewusst auch durch die Benutzerführung unterscheiden soll und eben nicht nur durch das Design und die Inhalte.
Case Studies:
Un.titled
Portfolio-Präsentationen sind eine Paradebeispiel für den Einsatz von horizontalen Scrollleisten. Bei Un.tittled werden die Projekte ansprechend nebeneinander angeordnet. Optisch ist die Seite sowieso ein Leckerbissen. Leider aber in Flash umgesetzt, so dass mein Trackpad schon nicht mehr will… Also tolle Idee, Umsetzung mit Spielraum nach oben.
http://un.titled.co.uk/
Weiterlesen »
GOOD: Teamvorstellung
Schön gemachte Präsentation des über 40köpfigen Teams. Farbliche Balken präsentieren die Täigkeitsbereiche. Bei Auswahl werden die in diesem Bereiche nicht aktiven Teammitglieder ausgegraut. Optisch sehr ansprechend mit frischer Farbkombination und angenehm spielerischer Umsetzung. Daumen hoch!
Zehn Thesen für gutes Design
Dieter Rams hat in den frühen 1980er Jahren zehn Thesen aufgestellt, was gutes Design für ihn auszeichnet. Noch immer zeitlos und auch auf Webdesign uneingeschränkt übertragbar:
1. Gutes Design ist innovativ.
2. Gutes Design macht ein Produkt verständlich.
3. Gutes Design ist ästhetisch.
4. Gutes Design macht ein Produkt brauchbar.
5. Gutes Design ist unaufdringlich.
6. Gutes Design ist ehrlich.
7. Gutes Design ist langlebig.
8. Gutes Design ist konsequent bis ins letzte Detail.
9. Gutes Design ist umweltfreundlich.
10. Gutes Design ist sowenig Design wie möglich.
FAIL: Voraussetzungen erwarten
Ich dachte so etwas wäre schon lange aus dem Netz verschwunden, aber ich musste mich eines Besseren belehren lassen: Die „Voraussetzungen“: Bildschirm 1024x768px, Internet Explorer 5.x, Macromedia Flash Player! Gut, die Webseite scheint älter zu sein. Ein dermaßen langsames Flash-Menü würde heute keiner mehr bauen. Aber vom IE5 zu reden, nein, das ist nur noch peinlich. Da ist es dann auch schon fast egal, dass man einen Link namens „zum Internetauftritt“ klicken darf, damit die eigentlich Seite sich in einem neuen! Fenster öffnet. Eindeutiger geht der Daumen nicht runter!
Die Typen, Mannheim
Verläufe in Webdesigns — Beispiele & Erläuterungen
Es gab Zeiten, da waren Verläufe in Designs verpönt: „Hat der Grafiker nix drauf, macht er schnell einen Verlauf“. Spätestens seit dem typischen web2.0-Stil, bei dem Logos und die Screendesigns mit Spiegelungen, Schatteneffekten und Verläufen versehen wurden, gehören Verläufe zu fast jedem Screendesign dazu. Aber: Verlauf ist nicht gleich Verlauf!
Die Hauptwirkung eines Verlaufes liegt vor allem in der dadurch entstehenden räumlichen Tiefe. Neben Texturen und Bildern bieten Verläufe damit eine großartige und vor allem recht einfach einzusetzende grafische Möglichkeit Webdesigns eine Haptik zu geben. Und diese Haptik sorgt entscheidend für die Wirkung des Webdesigns auf den Betrachter.
Gelungene Beispiele für Verläufe in Screendesigns:
Allen Beispielen gemein ist der fast unmerkliche Einsatz von Verläufen, die sich zwischen zwei sehr sehr ähnlichen Farbwerten vollziehen. Damit wird eine dezente räumliche Tiefe erreicht, welche die Webdesigns aber (dezent) lebhaft machen.
Von dieser Art Verläufe wimmelt es nur so im Netz. Man könnte fast sagen sie gehören zum modernen Webdesign-Standard.
Webdesign-Prinzipien: Der erste Eindruck
Was für die Begegnung zwischen Menschen gilt, gilt auch für die Interaktion Mensch-Maschine und speziell für den ersten Eindruck, den eine Webseite beim Anwender hinterläßt (ob das andersrum auch getestet werden kann?).
50 Millisekunden — das ist nicht wirklich lange, also ungefähr ein Augenaufschlag oder 1/20 einer Sekunde. Diese Zeitspanne hat eine Webseite laut Studie, um einen ersten Eindruck zu schinden. Innerhalb dieser Spanne bildet sich der Anwender sein erstes Urteil über die Seite. Ein allein ästhetisches Urteil, denn — logischerweise — Inhalt wird er da noch nicht aufgenommen haben. Ein ästhetischer Eindruck, der aber die weiteren Eindrücke, wie Struktur / Aufbau der Seite, Inhalte etc. entscheidend mit beeinflusst. Je positiver der erste Eindruck ist, umso aufgeschlossener ist der Anwender den weiteren Eindrücken gegenüber.
Die Begegnung mit einer Webseite ähnelt der ersten Begegnung mit einem Menschen. In Sekundenbruchteilen haben wir einen ersten Eindruck gewonnen.
Ein Phänomen, dass jeder von der ersten Begegnung mit anderen Menschen kennt. Lernen wir einen für uns neuen Menschen kennen, haben wir in Sekundenbruchteilen einen ersten Eindruck gewonnen, der eben auch nur optischer Natur ist. Wir ordnen wir ihn aber sofort in von uns gelernte Kategorien ein („Schubladen“ fände ich eine schöne Metapher). Der erste Eindruck sitzt sofort, sympathisch oder unsymapthisch. Und so sind wir von diesem ersten Sympathie-Eindruck stark beeinflusst beim weiteren Kennenlernen der Person. Je nachdem wie fest die Schublade ist, also wie aufgeschlossen oder verschlossen wir insgesamt sind, wird es der Person mehr oder weniger leicht fallen aus dieser Kategorisierung wieder rauszukommen.
Laut einer Studie ändert sich dieser erste Webseiten-Eindruck während des weiteren Surfens nur geringfügig. Sitzt der Eindruck erstmal, ist es anscheinend schwer diesen noch zu beeinflussen, zu verändern. Dies zeigt, wie wichtig eine optisch ansprechende, harmonische Webseitengestaltung ist. Das Design oder besser ausgedrückt die Tonality oder das Look & Feel muss auch unabhängig von der Benutzbarkeit der Webseite wirken, alles bevor der Nutzer überhaupt erst Details gesehen, geschweige denn gelesen hat.
Der erste Eindruck entscheidet allerdings nicht darüber, wie lange der User auf der Webseite bleibt und ob und wieviel Inhalt er aufnimmt. Innerhalb der ersten Millisekunden kann der Anwender zum Glück noch kein Browserfenster wieder schließen. Für die weiteren Eindrücke und daraus folgende Entscheidungen nimmt er sich zum Glück etwas mehr Zeit.
Dazu aber mehr in späteren Webdesign-Prinzipien…
Bericht über die Ergebnisse der Studie:
http://news.bbc.co.uk/2/hi/technology/4616700.stm