Strukturen designen

webstandard.kulando.de spricht ein Webdesign-Thema an, welches gerade im täglichen Arbeitsleben von "professionellen Agenturen" wenig Berücksichtigung findet: Das Design der Struktur einer Website. Dort läuft es häufig so, dass ein Screen-Design vorgegeben wird, dann patscht man die Inhalte rein (unter der Vorgabe, das Design nicht zu brechen) und die "User Experience" bleibt häufig auf der Strecke.

Mit "User-Experience" meine ich konkret das, was der User bei der Taskerfüllung erlebt und sieht, wenn er eine Klick- oder View-Strecke zurücklegt. Zum Beispiel, wenn man etwas online bestellen, oder ein Fachthema innerhalb einer Site ausgiebig erkundtschaften möchte. Dies kann im einfachsten Fall das Verfolgen von Blogeinträgen zu einem Thema, oder auch nur der Aufruf von Werbung sein.

Meiner Meinung nach ist die ideale Reihenfolge bei der Konzeption von Websites:

  • Erst die Tasks
    Wo fängt man an, wie kommt man weiter und wie (sicher) beendet man eine Task erfolgreich? Mit Hilfe von Interaktions- und Input/Output-Diagrammen gestaltet man zuerst das, was sich im Kopf des Users abspielt. Entspricht der Ablauf, der natürlich so simpel wie möglich gehalten werden sollte, dem zu erwartenden psychologischen Modell des Users, hat die Site eine gute Basis, eine befriedigende "User Experience" zu bieten.
  • Dann die Inhalte
    Die Inhalte sollten die Tasks unterstützen. Damit sind, neben den inhaltlichen Informationen,die ein Autor rüberbringen möchte, auch Link- und Button-Beschriftungen gemeint. Hyperlinks und Buttons sind immernoch die wichtigsten Navigationselemente. Deshalb sollte man deren Benennung eine wichtige Rolle zuordnen.
  • Am Ende kommt das optische Design
    ... also die grafische Gestaltung aller Elemente. Hier muss der Designer optisch unterstützten, was das Interaktionsdesign zu erreichen versucht. Wie groß sollten Links, Buttons, Überschriften oder der Schriftgrößen zum Artikeltext sein? Welche Farben/Effekte benutzt man, um den User visuell an eine Task zu führen? Welche Abstände sind nötig (white space)?

Wenn der Screen-Designer eng an die Konzepte des Interaktions-Designs und der Inhalte gebunden wird, hat er den maximalen Spielraum, Kreativität zu entwickeln.

Das Argument, sich durch solche Konventionen in seiner Kreativität eingegrenzt zu fühlen, kann man hierbei meiner Meinung nach nicht wirklich geltend machen. Denn ein Design auf Grund von strukturellen Vorgaben unter den bestimmten Vorgaben wie bspw. CI zu entwerfen, verlangt noch mehr Kreativität als ohne diese "Vorgaben".

Screen-Design oder Content?

Kreativität entwickelt sich nur in einem bestimmten Rahmen, nicht unter völliger Freiheit, wie sie so mancher Screen-Designer beansprucht. Ich fand schon immer, dass es keine Kunst ist, willkürlich ein paar Farben in Eimer zu gießen und diese dann gegen eine Leinwand zu pfeffern, so dass die Betrachter, am Sektglas nippend, den zufällig entstanden Farbklecksen ein staunendes "Aaah" und "Ohhh" entgegenbringen können. Diese "Kunst" beherrscht auch ein Kleinkind. Echte Kreativität entsteht immer unter Einschränkungen und engen Vorgaben.

Saturday, July 21. 2007
361 hits

Comments

Display comments as (Linear | Threaded)

No comments (Add Comment)

Trackbacks


No Trackbacks

Add Comment

BBCode format allowed
Enclosing asterisks marks text as bold (*word*), underscore are made via _word_.
Standard emoticons like :-) and ;-) are converted to images.
E-Mail addresses will not be displayed and will only be used for E-Mail notifications.

To prevent automated Bots from commentspamming, please enter the string you see in the image below in the appropriate input box. Your comment will only be submitted if the strings match. Please ensure that your browser supports and accepts cookies, or your comment cannot be verified correctly.
CAPTCHA


Über

Das hier ist das private Weblog von Alp Uçkan. Ich entwickle Websites seit 1997 und arbeite derzeit als freiberuflicher Frontend-Entwickler.

Specialp Features

fapulous Framework (neu!)
Das erste XHTML/CSS-Framework auf Basis der Faux Absolute Positioning-Technik. Beinhaltet viele performante Konstrukte. Der Stoff, aus dem professionelle Websites gemacht sind ... ;-)

monitorThis 1.0
With MonitorThis you can subscribe to 26 different search engine feeds at the same time.

Business Blogging Weeks
Blog-Serie über die Kommerzialisierung der Blog-Szene in 2005

neueste Leser-Kommentare:

06.02.2011 17:28
Lucky Number Slevin hat sowieso die besten Filmzitate! Hier noch ein paar sehr Gu [...]
21.01.2011 13:26
Ok, I will do this in the next few days, probably two weeks. I have to do some three [...]
21.01.2011 12:52
Dear Mr Binder, a free german translation of this tutorial would be highly apprec [...]