[[...]] == Kommentar im Text ((...)) == Fussnote [[ Text für Titelseite ]] Konzept für ansprechende Internetseiten Gute Planung ist die Grundvoraussetzung für eine gelungene Homepage von Kerstin Blossey [[ Dokument Inhalt ]] [[ Inhaltsverzeichnis ]] [[ Info-Kasten mit einleitender Hand und Begrenzungslinie rechts und links ]] Auf einer wirklich gelungenen Website erkennt man sofort, um was es dort geht, und ob es sich lohnt, diese Seite genauer anzusehen. Wo Text, Bilder, Farben und Ton einfach aneinandergereiht wurden, bleibt nur selten ein Internetbesucher hängen. Das Zauberwort auf dem Weg zur guten Homepage heißt "Design". Hinter dem Begriff steckt aber viel mehr als nur die Bedeutung aus dem Lexikon "Muster" oder "Entwurf". Es geht vielmehr um "Gestaltung" -- den bewussten Einsatz von Elementen - und sogar um eine konkrete "Absicht" -- also ein Ziel, das kluge vorherige Planung erfordert. "Gutes Design bedeutet relevante Information".((Roger Black: Web Sites that work. Adobe Press 1997;)) Doch was ist relevante Information -- und was muss gutes Design können? Wer eine wirklich gelungene Homepage präsentieren will, muss sich vor allem über Inhalt, Aufbau, Navigation und Erscheinungsbild klar werden. [[ Zum Inhaltsverzeichnis hinzufügen ]] Inhalt & Ziel Ihrer Homepage (Informationsdesign) Thema Die erste Frage auf dem Weg zur gelungenen Internetseite lautet: Was ist das Thema und das Ziel Ihrer Webseite? Vielleicht wollen Sie sich selbst vorstellen, oder Sie haben ein Hobby oder ein Thema, das Sie mit anderen Internetbenutzern teilen wollen. Unter Umständen wollen Sie auch online Geschäfte machen. Um so vielfältiger die Möglichkeiten im Internet sind, um so wichtiger ist zielgrichtetes Auftreten Ihrer Internetseite. Entscheidend hierfür ist die Aufbereitung Ihres Themas: Erstellen Sie eine genaue Gliederung aller thematischen Punkte, die Sie auf Ihrer Homepage darstellen wollen. Diese Aufstellung liefert Ihnen zugleich inhaltliche Ebenen, die Sie später für den Aufbau Ihrer Seiten benötigen werden. Zielgruppe Die zweite Frage betrifft Ihre konkrete Zielgruppe: Wen genau wollen Sie mit Ihrer Webseite ansprechen? Nur wenn Sie vorab festlegen, wer Ihre zukünftigen Besucher im Internet sein sollen, können Sie Ihre Homepage inhaltlich und grafisch so gestalten, dass sie für genau diese Internetbenutzer auch interessant ist. [[ Info-Kasten mit einleitender Hand und Begrenzungslinie rechts und links ]] Beispiel: Ein Computer-Neuling wird sich kaum eine Seite ein zweites Mal ansehen, wenn er schon auf der Startseite vor lauter Fachwörtern nur Bahnhof verstanden hat. In diesem Fall muss die Wortwahl auf Besucher angepasst werden, die bisher nichts mit der Computerwelt zu tun hatten. Fachwörter müssen gut dosiert eingesetzt und auf jeden Fall immer erklärt werden -- zum Beispiel durch eine kleine Erklärung in einem Zusatzfenster, das sich öffnet, wenn der Besucher auf das Fachwort klickt. Information und Kommunikation (Email) sind nach wie vor zentrale Motive für die Anschaffung eines Online-Zuganges. ((ARD/ZDF-Online-Studie 2000)) Denken Sie deshalb darüber nach, was Sie als Besucher von einer bestimmten Homepage erwarten würden. So können Sie den Erwartungen Ihrer Zielgruppe gerecht werden. Arbeitsumgebung Bedenken Sie bei der Gestaltung Ihrer Homepage auch die Arbeitsumgebung Ihrer Internetbesucher: Die örtlichen Gegebenheiten sind oft entscheidend, wie jemand Ihre Webseite erlebt und bewertet. Beispielsweise bei hohem Lichteinfall am Arbeitsplatz werden Elemente auf Ihrer Site, die nur einen niedrigen Kontrast zum Hintergrund haben, unleserlich. Auch der Einsatz von Geräuschen, Tönen und Hintergrundmusik und anderen Effekten muss wohlüberlegt sein, wenn er nicht abschrecken soll. Auch die technische Ausstattung des Nutzers setzt Grenzen. Hier kann die parallele Verwendung von jeweils zwei ergänzenden Elementen hilfreich sein. [[ Info-Kasten mit einleitender Hand und Begrenzungslinie rechts und links ]] Hat ein Nutzer z.B. Probleme mit seiner Soundausgabe, so kann er etwa eine vorgelesene Textstelle zugleich gedruckt auf dem Bildschirm mitlesen. Gehen Sie bei Ihrer Zielgruppe am besten vom "worst case", also dem schlechtesten anzunehmenden Fall, aus. So können Sie ohne allzu große Abstriche schnell treue Besucher gewinnen -- Ihre beste Werbung! Überlegen Sie sich bei jedem Textfeld und jeder Ihrer Internetseiten, ob der Inhalt Ihre Zielgruppe wirklich interessiert, ob er weiterhelfen kann und ob Besucher, die weniger als Sie von dem behandelten Thema verstehen, den Inhalten auch folgen können. [[ Zum Inhaltsverzeichnis hinzufügen ]] Aufbau & Navigation Ihrer Homepage (Interaktionsdesign) Qualitätskriterien Qualitätskriterien für gute Webseiten sind längst definiert. Wer sich daran hält, dem ist ein gewisses Maß an Erfolg von vorneherein sicher. Neben dem inhaltlich nachvollziehbaren Konzept will der Internetbesucher vor allem schnellen Seitenaufbau, klare Übersicht auf der Site und ständige Aktualität. Informationen müssen vollständig sein und am besten durch Quellen belegt werden, um so eine gewisse Glaubwürdigkeit zu erhalten. Besonders ärgerlich sind tote Links sowie lange Lade- und Downloadzeiten. Design Nun zum Aufbau Ihrer Website. In der Designplanungs-Phase legen Sie die Orientierung sowie deren bildliche Symbolisierung für den Benutzer fest: Entwickeln Sie ein Führungssystem, mit dessen Hilfe man sich jederzeit und von jeder Seite aus auf Ihrer Homepage orientieren kann. Sogenannte Imagemaps und Symbole können hier große Dienste leisten, besonders wenn man voraussetzt, dass die Homepage auch von internationalen Besuchern angesehen wird. Icons, wie sie z.B. für Email, vor- oder zurück-Funktion und viele andere Steuerelemente weltweit gängig sind, heben Sprachbarrieren schnell auf. [[ TIPP Kasten, TIPP negativ, Kasten farblich hinterlegt mit grau ]] TIPP: Achten Sie bei der Auswahl und Erstellung Ihres Designs auf ein harmonisches, einheitliches Layout. Die Navigation sollte möglichst auf allen Seiten Ihrer Homepage gleich sein. Funktionsweise Im zweiten Schritt legen Sie die Funktionsweise Ihrer Homepage fest: Navigation, Anwendbarkeit, Funktionsfähigkeit und eine logische Anordnung Ihrer Inhalte müssen nun zu einem schlüssigen Gesamtkonzept zusammengefügt werden. Die Navigation sollte allgemeinverständlich, übersichtlich und möglichst einfach (Länge und Verbindungen) sein. Oft fällt das Stichwort der "intuitiven Benutzerführung", was nichts anderes meint, als dass der User so geführt wird, dass er sich ohne weitere Hilfen auf Ihrer Site zurechtzufinden kann. Anwendbarkeit Die Anwendbarkeit bezieht sich vor allem darauf, ob Ihre Site einen erkennbaren Nutzen für Ihre Besucher hat. Unterteilen Sie Ihre thematische Gliederung dazu in Ebenen, wie in der Skizze dargestellt. Die wesentlichen Informationen gehören möglichst weit nach oben, spezielle Details weiter nach unten. So stellen Sie sicher, dass der Benutzer sofort die entscheidenden Informationen bekommt. Wünscht er dann tiefergehende Einblicke in Ihr Thema, wird er sich sicher auch tiefere Ebenen durchklicken. Funktionsfähigkeit Bei voller Funktionsfähigkeit stößt der Nutzer weder auf tote Links, noch auf unvollständige Seiten, noch auf Platzhalter von Bildern, die nicht angezeigt werden können. Legen Sie dazu für jede Ihrer Unterseiten den Inhalt und das genaue Geschehen fest (Storyboard). Machen Sie sich zusätzlich einen Plan, in dem sie alle Verlinkungen Ihrer Unterseiten und zu externen Seiten einzeichnen. Das erleichtert nicht nur den Überblick, sondern verhilft Ihnen auch zu einer vollständigen Navigation. [[ TIPP Kasten, TIPP negativ, Kasten farblich hinterlegt mit grau ]] TIPP: Verzichten Sie auf Elemente, bei denen eine volle Funktionsfähigkeit nicht sichergestellt werden kann. Testen Sie daher schon während dem Homepagebau regelmäßig Ihre Seite auf verschiedenen Browsern (MS Internetexplorer, Netscape Communicator, Opera). Nur so kommen Sie zu voller Funktionsfähigkeit. Kontrollelemente Ein paar Wort zu den Kontrollelementen einer Homepage: Das Internet ist ein Medium, in dem der Benutzer eine Art Macht ausüben kann -- und zwar über die Kontrollelemente, die der Homepagegestalter ihm zur Verfügung stellt. Je mehr also Ihr Besucher das Gefühl bekommt, selbst entscheiden zu können, was er auf Ihrer Internetseite tut, umso ungezwungener und offener wird er sich dort bewegen. Deshalb sollten Sie folgende Möglichkeiten für Kontrollelemente in Betracht ziehen -- jedoch gut dosiert: [[ Aufzählung mit "Pfeil" als Aufzählungszeichen ]] - Tempo (wann ist der User bereit zum nächsten Klicken?) - Medien (Play, Start, Stop, Vor-/Rücklauf) - Objekte (ein Fenster, das man verschieben kann) - Reihenfolge (auf welche Seite der User wann gehen möchte) - Transaktionen (Passwort-Eingabe oder Senden einer Nachricht) - Variablen (Suchfunktionen anpassen) - Simulationen (Perspektive einer Ansicht ändern). [[ Info-Kasten mit einleitender Hand und Begrenzungslinie rechts und links ]] Auch der "Service" einer Webseite sollte nicht vernachlässigt werden: Eine engagierte Hausfrau kaum wird eine Seite mit einem Online-Kochbuch kaum ein zweites Mal besuchen, wenn sie auf ein interessantes Rezept stößt, dieses aber nicht zum Nachkochen ausdrucken kann. Beinahe für jedes Thema lassen sich Punkte finden, wo man durch einen kleinen Service sicherstellen kann, dass Ihre Besucher gerne regelmäßig wiederkommen. [[ Zum Inhaltsverzeichnis hinzufügen ]] Erscheinungsbild Ihrer Homepage (Präsentationsdesign) Wenn Sie sich bis hierher geduldig mit den Inhalten Ihrer Homepage beschäftigt haben, dann bleibt Ihnen nun der reine Genuss an der kreativen Gestaltung Ihrer Internetpräsenz. Nun liegt es an Ihnen, Farben und Formen, Hintergrund und Schriftart, Texte, Bilder, Ton und Videostreaming, Animationen und Ihren so sorgsam geplanten Inhalt zu einem Ganzen zusammenzufügen. Aber das Webdesign ist ein eigenes Kapitel. Deshalb an dieser Stelle nur ein paar kleine Denkanstöße: [[ Aufzählung mit "Pfeil" als Aufzählungszeichen ]] - Gängige Auflösung: optimal 800x600 (für die breite Masse, 1024x768 für PC-Zielgruppe) - Thumbnails als Vorschaumöglichkeit für das Bild, das auf Wunsch dann geladen werden kann. - Bei aller künstlerischer Freiheit: auf Ladezeiten beim User achten! - Inhalt und Stil Ihrer Seite sollten zusammenpassen - Erstellen Sie zunächst einen Prototypen, der Ihnen dann als Basis für alle weiteren Seiten dienen kann. [[ TIPP Kasten, TIPP negativ, Kasten farblich hinterlegt mit grau ]] TIPP: Umsetzung von Inhalten: Das Internet als nonlineares Medium lebt von Schnelligkeit und Kürze. Der User will möglichst viel Info auf einen Blick. Vermeiden Sie daher lange Fließtexte. Arbeiten Sie statt dessen mit Inhaltsverzeichnissen, die per internem Link auf einen Textblock verweisen. Fall sich lange Texte nicht vermeiden lassen, heben Sie in jedem Textabsatz das entscheidende Stichwort hervor. Fazit Das Internet ist ein wahres Sammelsurium an schlechten, unvollständigen und subjektiven Informationen, irreführenden oder nicht mehr vorhandenen Links, sowie falschen oder nicht aktualisierten Daten. Wie die aktuellen Studien zeigen, ist das ein angebotsbedingtes Problem, das der User ausbaden muss. Wer sich die Mühe macht und ein Konzept für seine Homepage erstellt, bietet eine klar aufgebaute Website, hochwertige Informationen, aktuelle Daten und interessante Links auf andere Angebote, die ebenso sorgfältig aufgebaut wurden. [[ Zum Inhaltsverzeichnis hinzufügen ]] Anhang Quellennachweis [[ Aufzählung mit negativen Kreisziffern als Aufzählungszeichen ]] - Kentie, Peter: WebGraphics -- Tools und Techniken für die Web-Gestaltung, 3., erweiterte und aktualisierte Auflage, Addison-Wesley Verlag, München 2003; - Kristof, Ray und Satran, Amy: Interactivity by design -- Creating & Communicating with New Media, Adobe Systems Incorporated, Indianapolis 1995; - Thissen, Frank: Screen-Design-Handbuch -- Effektiv informieren und kommunizieren mit Multimedia, Springer-Verlag Berlin, Heidelberg 2001; - ARD/ZDF-Online-Studie 2000 Zusatzservice Bei der Autorin können Sie eine kostenlose Checkliste für Ihr persönliches Homepage-Design anfordern (Mail an kerstin.blossey@epost.de). Folgende Themen sind derzeit verfügbar: [[ Tabellarisch darstellen mit Linien rund um die Tabelle und zwischen den Zeilen und Spalten ]] Checkliste 1 Wie komme ich zu Thema und Gliederung? Checkliste 2 Erwartungen der User an meine Website? Checkliste 3 Anleitung für ein Homepagekonzept [[ Am Ende der letzten Seite ]] © by Kerstin Blossey: Website-Konzeption