Deutendes Design der Inhalte

Beim Planen eines Internetauftritts wird sehr häufig immer wieder ein und der selbe Fehler gemacht. Man versucht ein Konzept für die Präsentation zu erstellen. Um aber wirklich erfolgreiche Websites zu kreieren sollte man eher den Schwerpunkt auf den inhaltsbezogenen Designprozess legen und nicht auf die optische Wiedergabe von Informationen. Klar Optik ist wichtig aber „Content ist King„. Die Besucher kommen schließlich wegen den Informationen auf die Website und nicht weil sie schön aussieht.

In den letzten Jahren hat ein Umdenken stattgefunden, in dem man immer mehr das optische Design von der inhaltlichen Struktur trennt. Nicht nur das man jetzt fast ausschließlich mit externen CSS-Dateien arbeitet. Sondern man versucht auch den Inhalt in seiner Bedeutung zu strukturieren. Das ist die Semantic.

Das Branding

Fast jede Website besitzt einen Titel. Bei Firmen ist dies fast immer gleichgesetzt mit dem Firmennamen. Zusätzlich besitzen solche Titel auch immer ein Motto oder Slogan, die sogenannt Tagline. Der Site-Titel sollte, weil es sich ja um eines der wichtigsten Elemente auf der ganzen Website handelt, auf jeden Fall in einen <h1>-Tag gelegt werden. Bei der Tag-Line handelt es sich dann meist um eine Art Zitat, auch wenn es nicht immer eine Quelle dazu gibt. Also sollte man dafür den <blockquote>-Tag benutzen. Beide Elemente können dann wunderbar mit einen <div>-Kontainer gruppiert werden.

Die Navigation

Es gibt verschiedene Arten von Navigationen. Für mich gibt es 3 wichtige Navigationen.

Inhaltsnavigation
In ihr werden alle Inhalte die auf der Website präsentiert werden abgebildet und gruppiert. Ähnlich wie in einer Dokumentation oder einem Buch sollte die verschiedenen Inhalte einem roten Faden folgen. Weswegen ich für eine geordnete Liste plediere.
Servicenavigation
Neben den reinen Inhaltsseiten gibt es weitere Seiten auf der Website die sich um die Kommunikation, Bedienung der Website und dem Rechtlichen kümmern. Hier meine ich z.B.:

  • Startseite,
  • Kontakt,
  • Imperssum,
  • Inhaltsverzeichniss,
  • Hilfe,
  • Glossar und
  • Stichwortverzeichniss.

Hier benutze ich meistens eine ungeordnete Liste.

Pfadnavigation
Gerade bei komplexeren Websites bzw. Website mit einer Verschachtelungstiefe von mehr als 2 Ebenen sollte der Betrachter über eine Brotkrümelspur, wie bei Hänsel und Gretel, zur Startseite also nach hause gebracht werden. Dabei eignet sich eine ungeordnete, ineinander verschachtelte Liste am besten.

Der Inhalt

Der Inhalt sollte auf jeden Fall mit dem Seitentitel beginnen und über der <h2>-Tag als zweit wichtigstes Element definiert werden. Alle weiteren Strukturierungen sind dann je nach Inahlt abhängig. Die häufigsten verwendeten Tag sind in diesem Zusammenhang:

  • <p>,
  • <img>,
  • <ul>, <ol>, <dl>,
  • <blockquote>,
  • <table> und
  • <form>

Die Seiteninformationen

Meistens legt man solche Informationen an das Ende der HTML-Seite. Dazu gehören z.B. das Copyright, ein rechtlicher Hinweis, Kontaktmöglichkeiten und vielleicht ein paar Bedienmöglichkeiten, wie:

  • „nach oben“ und
  • „Seite drucken“

1 Kommentar

Schreib einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.