Sitedesign: Unterschied zwischen den Versionen
Verena (Diskussion | Beiträge) K |
|||
(21 dazwischenliegende Versionen von 3 Benutzern werden nicht angezeigt) | |||
Zeile 1: | Zeile 1: | ||
− | ''' | + | =='''Kurze Definition'''== |
+ | [[definition::Sitedesign ist der strukturelle und funktionale Aufbau von Webseiten.]] Das graphischen Design (siehe unter [[Pagedesign]]) wird hierbei nicht in Betracht gezogen. | ||
− | + | Der Nutzen einer Website ist es, über ein spezifisches Thema informiert zu werden. So dient der strukturelle und funktionale Aufbau eines Webangebotes der übersichtlichen Überlieferung von Informationen. Hier gibt es veschiedene Formalien, die beim Sitedesign beachtet werden sollten, um erfolgreich eine Website im Internet präsentieren zu können (bezogen auf die Bedürnisse der Benutzers). | |
− | |||
− | |||
− | |||
Zeile 10: | Zeile 8: | ||
Fundierte Recherche und verständlich geschriebene Texte sind Vorraussetzung für eine erfolgreiche Information auf einer Website. | Fundierte Recherche und verständlich geschriebene Texte sind Vorraussetzung für eine erfolgreiche Information auf einer Website. | ||
− | |||
''5 fundamentale Schritte'' sind dabei zu beachten, um den Lesern qualitativ hochwertige und nachvollziehbare Informationen zu präsentieren: | ''5 fundamentale Schritte'' sind dabei zu beachten, um den Lesern qualitativ hochwertige und nachvollziehbare Informationen zu präsentieren: | ||
− | 1. Unterteile | + | 1. Unterteile deine Inhalte in kleinere Einheiten (Chunking) |
− | |||
− | |||
− | |||
− | |||
− | + | 2. Gliedere deine Informationen hierarchisch (von der allgemeineren zur spezifischeren Einheit) | |
− | + | 3. Nutze diese Hierarchie, um Beziehungen zwischen den einzelnen Einheiten herzustellen | |
+ | 4. Folge bei der Erstellung deiner Website der ihr zu Grunde liegenden Informationsstruktur | ||
− | + | 5. Analysiere den funktionalen und ästhetischen Erfolg deiner Website | |
+ | ==='''"Chunking" von Information (Informationen auf den Punkt gebracht)'''=== | ||
Ziel von [http://dict.leo.org/?lp=ende&lang=de&searchLoc=0&cmpType=relaxed&relink=on§Hdr=on&spellToler=std&search=chunk Chunking] ist es, die Fülle von Informationen, die auf einer Website zu präsentieren sind, zu sortieren und indexieren, um für den User eine Übersicht zu schaffen. | Ziel von [http://dict.leo.org/?lp=ende&lang=de&searchLoc=0&cmpType=relaxed&relink=on§Hdr=on&spellToler=std&search=chunk Chunking] ist es, die Fülle von Informationen, die auf einer Website zu präsentieren sind, zu sortieren und indexieren, um für den User eine Übersicht zu schaffen. | ||
− | ===Hierarchie | + | ====Hierarchie vom "Allgemeinen" zum "Spezifischen" ==== |
− | + | Der Schritt, Informationen hierarchisch zu organisieren, ist im Internet unabdingbar. Dieses Ziel wird verwirklicht, indem der User von der Hauptoberfläche („Homepage“) über die allgemeineren Informationen (in Form von Links bzw. Anker) zu Untermenüs verschiedener spezifischerer Inhalte geleitet wird (Pages). So hat man ein Paket, in dem die allgemeinere Information an erster Stelle steht und anschließend die spezifischeren und detaillieren folgen. | |
− | Der Schritt Informationen hierarchisch zu organisieren ist im Internet unabdingbar. Dieses Ziel wird verwirklicht, indem der User von der Hauptoberfläche („Homepage“) über die allgemeineren Informationen (in Form von Links bzw. Anker) zu Untermenüs verschiedener spezifischerer Inhalte | ||
''Kurz:'' Von der allgemeinen zur spezifischeren und detaillierten Information. | ''Kurz:'' Von der allgemeinen zur spezifischeren und detaillierten Information. | ||
− | ===Beziehungen zwischen den einzelnen Seiten (Pages) und Funktion der Menüseiten=== | + | ====Beziehungen zwischen den einzelnen Seiten (Pages) und Funktion der Menüseiten==== |
+ | Seiten innerhalb einer Website müssen sinnvoll miteinander verknüpft sein. Von Seite A wird zu Seite A.1 verlinkt und nicht zu Seite B.2. Die Reihenfolge der einzelnen Seiten muss nachvollziehbar sein, sonst treten Verwirrungen auf, wie sie die Abbildung zeigt. | ||
− | |||
[[Bild:Beziehungen.gif]] | [[Bild:Beziehungen.gif]] | ||
+ | Lynch, Patrick; Horton, Sarah (2004): Webstyleguide. 2nd edition. Online abrufbar unter: http://www.webstyleguide.com/page/hierarchy.html | ||
− | |||
− | + | Die Funktion einer Menüseite ist das erfolgreiche Führen eines Internetbesuchers durch eine Website. Dabei sind die Faktoren Länge einer Menüseite und Verschachtlung mehrerer Menüseiten ausschlaggebend für den Erfolg einer Recherche auf einer Website. | |
− | Die Funktion einer Menüseite ist | ||
Das heißt, eine Menüseite darf nicht zu lange sein, die Verlinkung nicht zu veschachtelt. | Das heißt, eine Menüseite darf nicht zu lange sein, die Verlinkung nicht zu veschachtelt. | ||
Zeile 59: | Zeile 52: | ||
==''' Die Seitenstruktur'''== | ==''' Die Seitenstruktur'''== | ||
− | Bei vielen Webanbietern | + | Bei vielen Webanbietern gibt es Unstimmigkeiten über das Verfahren des Verlinkens von Seiten. Am besten ist es, die Informationen in eine sinnvolle Reihenfolge zu bringen, um somit dem Leser nachvollziehbar aufeinander aufbauende Informationen zu liefern. |
===Die Grundlegende Informationsstruktur=== | ===Die Grundlegende Informationsstruktur=== | ||
− | Es können drei grundlegende Strukturen bei der | + | Es können drei grundlegende Strukturen bei der Erstellung einer Webseite genutzt werden. |
====Sequenzen==== | ====Sequenzen==== | ||
− | Aneinandergereihte Seiten, die miteinander verlinkt sind, lassen sich als Sequenzen bezeichnen. Sie sind für den Benutzer am unkompliziertesten. | + | Aneinandergereihte Seiten, die miteinander verlinkt sind, lassen sich als Sequenzen bezeichnen. Sie sind für den Benutzer am unkompliziertesten in der Nutzung. |
====Hierarchie==== | ====Hierarchie==== | ||
− | Bei der Hierarchie gibt es eine Menüseite, die alle Links enthält | + | Bei der Hierarchie gibt es eine Menüseite, die alle Links enthält und von der aus auf alle anderen Seiten verlinkt wird. |
Doch hier kann ein Problem auftreten. Bei diesem Modell muss man, um zum nächsten Thema zu gelangen, wieder auf die Hauptseite zurückkehren. Bei mehreren Seiten und Themen kann dies zur Verwirrung des Benutzers führen. | Doch hier kann ein Problem auftreten. Bei diesem Modell muss man, um zum nächsten Thema zu gelangen, wieder auf die Hauptseite zurückkehren. Bei mehreren Seiten und Themen kann dies zur Verwirrung des Benutzers führen. | ||
Zeile 80: | Zeile 73: | ||
====Webs==== | ====Webs==== | ||
− | Bei Webs | + | Bei Webs wird, neben internen Verlinkungen, themenspezifisch auch auf externe Angebote verwiesen, um einen Themenbereich näher zu erläutern. Diese Art von Verlinkung wird meistens nur bei Seiten gesetzt, bei denen der Leser eine gewisses Grundwissen mitbringt. |
Zeile 86: | Zeile 79: | ||
=='''Elemente einer Website'''== | =='''Elemente einer Website'''== | ||
− | + | Viele Webseiten variieren stark in ihrer Organisation, Absicht, ihrem Aussehen und Inhalt. Alle Webseiten informativen Charakters teilen jedoch einige typische Merkmale. | |
− | + | ||
− | + | Um Internetseiten einheitlicher zu gestalten, gibt es einen Masterplan (siehe Abbildung), der zeigt, nach welchen Richtlinien man eine Internetseite aufbauen kann. Solch ein Gerüst dient als Unterstützung zum Bau einer Webseite. | |
+ | |||
+ | Zuerst ist es ratsam, sich mit dem Grundgerüst zu beschäftigen, bevor in einem spästeren Schritt die Inhalte eingefügt werden. Nach diesem Modell ist es empfehlenswert die einzelnen Inhalte auszutauschen, ohne etwas am Grundgerüst zu ändern. Auch Layout, wie Farben und Logos, sind später nach Belieben auszutauschen. Wichtig ist, dass die Übersichtlichkeit und Benutzerfreundlichkeit bewahrt wird, wie es in diesem Modell präsentiert wird. | ||
Zeile 94: | Zeile 89: | ||
− | http://www.webstyleguide.com/site/home.html | + | Lynch, Patrick; Horton, Sarah (2004): Web Style Guide. 2nd edition. Online abrufbar unter: http://www.webstyleguide.com/site/home.html |
− | |||
=='''Was ist beim Sitedesign zu beachten?'''== | =='''Was ist beim Sitedesign zu beachten?'''== | ||
Zeile 102: | Zeile 96: | ||
− | =='''Online - | + | =='''Online-Quellen'''== |
− | |||
− | |||
− | |||
− | |||
+ | *Lynch, Patrick; Horton, Sarah (2004): Web Style Guide. 2nd edition. Online abrufbar unter: http://www.webstyleguide.com/site/index.html | ||
+ | *Menon, Sathish; Michael Douma (2008): Finding Information - factors that improve online experiences. Institute for Dynamic Educational Advancement (IDEA). http://www.idea.org/find-information.html. | ||
[[category:Webdesign]] | [[category:Webdesign]] |
Aktuelle Version vom 12. Februar 2009, 11:22 Uhr
Inhaltsverzeichnis
Kurze Definition
Sitedesign ist der strukturelle und funktionale Aufbau von Webseiten. Das graphischen Design (siehe unter Pagedesign) wird hierbei nicht in Betracht gezogen.
Der Nutzen einer Website ist es, über ein spezifisches Thema informiert zu werden. So dient der strukturelle und funktionale Aufbau eines Webangebotes der übersichtlichen Überlieferung von Informationen. Hier gibt es veschiedene Formalien, die beim Sitedesign beachtet werden sollten, um erfolgreich eine Website im Internet präsentieren zu können (bezogen auf die Bedürnisse der Benutzers).
Organisierte Information
Fundierte Recherche und verständlich geschriebene Texte sind Vorraussetzung für eine erfolgreiche Information auf einer Website.
5 fundamentale Schritte sind dabei zu beachten, um den Lesern qualitativ hochwertige und nachvollziehbare Informationen zu präsentieren:
1. Unterteile deine Inhalte in kleinere Einheiten (Chunking)
2. Gliedere deine Informationen hierarchisch (von der allgemeineren zur spezifischeren Einheit)
3. Nutze diese Hierarchie, um Beziehungen zwischen den einzelnen Einheiten herzustellen
4. Folge bei der Erstellung deiner Website der ihr zu Grunde liegenden Informationsstruktur
5. Analysiere den funktionalen und ästhetischen Erfolg deiner Website
"Chunking" von Information (Informationen auf den Punkt gebracht)
Ziel von Chunking ist es, die Fülle von Informationen, die auf einer Website zu präsentieren sind, zu sortieren und indexieren, um für den User eine Übersicht zu schaffen.
Hierarchie vom "Allgemeinen" zum "Spezifischen"
Der Schritt, Informationen hierarchisch zu organisieren, ist im Internet unabdingbar. Dieses Ziel wird verwirklicht, indem der User von der Hauptoberfläche („Homepage“) über die allgemeineren Informationen (in Form von Links bzw. Anker) zu Untermenüs verschiedener spezifischerer Inhalte geleitet wird (Pages). So hat man ein Paket, in dem die allgemeinere Information an erster Stelle steht und anschließend die spezifischeren und detaillieren folgen.
Kurz: Von der allgemeinen zur spezifischeren und detaillierten Information.
Beziehungen zwischen den einzelnen Seiten (Pages) und Funktion der Menüseiten
Seiten innerhalb einer Website müssen sinnvoll miteinander verknüpft sein. Von Seite A wird zu Seite A.1 verlinkt und nicht zu Seite B.2. Die Reihenfolge der einzelnen Seiten muss nachvollziehbar sein, sonst treten Verwirrungen auf, wie sie die Abbildung zeigt.
Lynch, Patrick; Horton, Sarah (2004): Webstyleguide. 2nd edition. Online abrufbar unter: http://www.webstyleguide.com/page/hierarchy.html
Die Funktion einer Menüseite ist das erfolgreiche Führen eines Internetbesuchers durch eine Website. Dabei sind die Faktoren Länge einer Menüseite und Verschachtlung mehrerer Menüseiten ausschlaggebend für den Erfolg einer Recherche auf einer Website.
Das heißt, eine Menüseite darf nicht zu lange sein, die Verlinkung nicht zu veschachtelt.
Die Seitenstruktur
Bei vielen Webanbietern gibt es Unstimmigkeiten über das Verfahren des Verlinkens von Seiten. Am besten ist es, die Informationen in eine sinnvolle Reihenfolge zu bringen, um somit dem Leser nachvollziehbar aufeinander aufbauende Informationen zu liefern.
Die Grundlegende Informationsstruktur
Es können drei grundlegende Strukturen bei der Erstellung einer Webseite genutzt werden.
Sequenzen
Aneinandergereihte Seiten, die miteinander verlinkt sind, lassen sich als Sequenzen bezeichnen. Sie sind für den Benutzer am unkompliziertesten in der Nutzung.
Hierarchie
Bei der Hierarchie gibt es eine Menüseite, die alle Links enthält und von der aus auf alle anderen Seiten verlinkt wird. Doch hier kann ein Problem auftreten. Bei diesem Modell muss man, um zum nächsten Thema zu gelangen, wieder auf die Hauptseite zurückkehren. Bei mehreren Seiten und Themen kann dies zur Verwirrung des Benutzers führen.
Webs
Bei Webs wird, neben internen Verlinkungen, themenspezifisch auch auf externe Angebote verwiesen, um einen Themenbereich näher zu erläutern. Diese Art von Verlinkung wird meistens nur bei Seiten gesetzt, bei denen der Leser eine gewisses Grundwissen mitbringt.
Elemente einer Website
Viele Webseiten variieren stark in ihrer Organisation, Absicht, ihrem Aussehen und Inhalt. Alle Webseiten informativen Charakters teilen jedoch einige typische Merkmale.
Um Internetseiten einheitlicher zu gestalten, gibt es einen Masterplan (siehe Abbildung), der zeigt, nach welchen Richtlinien man eine Internetseite aufbauen kann. Solch ein Gerüst dient als Unterstützung zum Bau einer Webseite.
Zuerst ist es ratsam, sich mit dem Grundgerüst zu beschäftigen, bevor in einem spästeren Schritt die Inhalte eingefügt werden. Nach diesem Modell ist es empfehlenswert die einzelnen Inhalte auszutauschen, ohne etwas am Grundgerüst zu ändern. Auch Layout, wie Farben und Logos, sind später nach Belieben auszutauschen. Wichtig ist, dass die Übersichtlichkeit und Benutzerfreundlichkeit bewahrt wird, wie es in diesem Modell präsentiert wird.
Lynch, Patrick; Horton, Sarah (2004): Web Style Guide. 2nd edition. Online abrufbar unter: http://www.webstyleguide.com/site/home.html
Was ist beim Sitedesign zu beachten?
Beim Sitedesign ist zu beachten, die Informationen mit Hilfe eines gut organisierten Grundgerüstes (Grunddesign/Sitedesign) dem Adressaten durchschaubar und nachvollziehbar auf einer Webseite zu präsentieren und dabei auf Qualität und Genauigkeit des Inhaltes zu achten.
Online-Quellen
- Lynch, Patrick; Horton, Sarah (2004): Web Style Guide. 2nd edition. Online abrufbar unter: http://www.webstyleguide.com/site/index.html
- Menon, Sathish; Michael Douma (2008): Finding Information - factors that improve online experiences. Institute for Dynamic Educational Advancement (IDEA). http://www.idea.org/find-information.html.