Nach dem Ermitteln der notwendigen Inhalte und der Entwicklung des Basis-Designs geht es nun an die Erstellung der Webpräsenz. Im Regelfall wird mit der Skizzierung der Startseite, dem Mockup begonnen. Der Mockup kann auf einen Blatt Papier gezeichnet werden oder mit Hilfe von Software Werkzeugen, wie Balsamiq Mockups, iPlotz,The Pencil Project oder Open Office erstellt werden. Danach werden weitere Grundtypen der Webseiten skizziert.
mockup-Beispiel
Auf Basis der erstellten Skizzen wird nun mit der Erstellung der HTML Webseiten begonnen. Dazu starten wir das Programm zur Erstellung der Webseiten. Auf Basis der gewählten Technologien ist der Entwicklungsprozess unterschiedlich und daher gehe ich hier nicht näher darauf ein.
Nach der Erstellung findet die Qualitätssicherung statt. Dies kann je nach Festlegung des Qualitätsstandards unterschiedlich aufwendig ausfallen. Die minimale Qualitätssicherung ist die optische Prüfung der Webseiten im Browser und ein Test auf fehlerfreie Verlinkung.
Hier kann der bereits beschriebene PDCA-Prozess nach William Edwards Deming verwendet werden.
Zurück zu
Strategien des Informationsmanagement bei der Webdesign Planung nutzen
Die Strategien des Informationsmanagement zeigen die allgemeine Vorgehensweise auf. Nachdem der Informationsbedarf und das Design geklärt ist, werden Inhalte für die Webseite gesammelt. Das können unstrukturierte und strukturierte Informationen sein.
Bei unstrukturierten Informationen empfiehlt sich die Daten zu kategorisieren. Dadurch lassen sich die Daten später leichter verwenden. Webseiten leben durch Veränderung und die kategorisierten Daten lassen eine mehrfache Wiederverwendung zu. Zudem können die Daten leichter wiedergefunden werden.
Strukturierte Informationen stammen meist aus Datenbanken, Wikis, Tabellen, Mindmaps und weiteren Quellen. Je nach Quelle können die Informationen mehr oder weniger einfach in die Webseiten eingefügt werden. Meist werden die Informationen umgeformt. Dazu gibt es unterschiedliche Techniken.
Wichtig ist auch die Dokumentation der eingesetzten Quellen, Techniken und deren Besonderheiten.
Einer der ersten Schritte bei der Planung eines Internet Projekts ist das Ermitteln der Anforderungen des Auftraggebers. Wichtig hierbei ist nicht nur aktives Zuhören, sondern auch der Erfassen der Anforderungen. Dazu eignet sich hervorragend ein Mindmapping Tool, wie Freemind.
Basierend auf den Anforderungen des Auftraggebers sind weitere Tätigkeiten notwendig.
- Die Anforderungen auf Machbarkeit prüfen
- Alternative Vorschläge machen, falls die Anforderung nicht oder aufwendig machbar ist
- Die Informations- und Datenquellen ermitteln
- Sind die verfügbaren Informationen ausreichend?
- Haben die Informationen genügend Qualität?
- Die weitere Vorgehensweise festlegen, um fehlende Informationen zu erhalten.
Ein weiterer Schritt ist die Auswahl des Designs nach den Anforderungen des Auftraggebers. Dies wird in einer folgenden Webseite erläutert.
Informationsmanagement und Webdesign, das sind zwei Instrumente die aufeinander aufbauen. Zur Erstellung von Webseiten wird psychologiebasiertes Informationsmanagement genutzt. Das bedeutet, dass Beziehungen zwischen den Partnern, Partner <-> Kunde die wesentliche Vorgehensweise bestimmen. Zudem werden die Felder
- Absatzmarkt
- Beschaffungsmarkt
- Konkurrenzmarkt
- interner Markt
nach strategischen und taktischen Gesichtspunkten analysiert. Das Ergebnis legt die weitere Vorgehensweise fest.
Nach dieser Analyse erfolgt
- das Ermitteln des Informationsbedarfs und des Designs
- das Erfassen der Informationen und deren Quellen
- das Erstellen der Webpräsenz
- die Aufbereitung der erfassten Informationen für die Webpräsenz
- die Organisation zur weiteren Pflege der Webseiten/Datenbanken
Durch diese Vorgehensweise wird eine erfolgreiche Webpräsenz erstellt.
Tony Buzan, britischer Mentaltrainer und Mitglied von Mensa International hat in den 70er Jahren Mindmapping entwickelt. Mindmapping ist eine Technik bei der Gedächtniskarten entstehen. Durch Mindmapping wird das Sprachzentrum der linken Gehirnhälfte und der gegenüberliegende, räumlich abstrakt denkende Bereich des Gehirns angeregt. Dadurch lassen sich Informationen ganzheitlich verarbeiten.
Gezeichnete Mindmap
Mindmapping wird genutzt für
- Planung und Organisation
- Strukturierte Darstellung von Texten und Berichten
- Aufbereiten der Information für Lernen und Lehren
- Ideenfindung und Brainstroming
- Projektmanagement
- Qualitätssicherung
- Webseiten Planung und Entwicklung
Durch die Umsetzung des Mindmapping auf dem Computer haben sich Vorteile ergeben, die eine effektivere Nutzung zulassen. Die Äste lassen sich einfach verschieben und neu anordnen. Wenn die Mindmap in Laufe der Zeit umfangreicher wird, dann wird automatisch für neue Äste Platz geschaffen.
Es gibt aber auch Einschränkungen, da das Konzept von Tony Buzan bei Mindmapping Software nicht vollständig umgesetzt worden ist. Bei der grafischen Darstellung von Bildern gibt es Einschränkungen mit der Darstellung von Grafik. Es gibt keine Bildbearbeitungs-Funktionen und somit können nur fertige Bilder und Grafiken eingebunden werden.
Freemind Präsentation
Das Programm dass ich heute vorstellen werde, heißt FreeMind und ist ein Open Source Programm mit GPL Lizenz, das kostenlos genutzt werden kann. Das Programm kann mit Windows, Linux und Apple OS-X benutzt werden. FreeMind funktioniert auf allen Betriebssystemen die die Java Runtime Engine (JAR) von Sun unterstützen.
Die Oberfläche kann wie links dargestellt, im Präsentations Modus genutzt werden. Dann werden die zur Entwicklung notwendigen Funktionen ausgeblendet.
Ein blauer Rahmen zeigt den ausgewählten Text oder Grafik an. Mit gedrückter linker Maustaste lässt sich die Mindmap verschieben. Dadurch können auch umfangreichere Mindmaps benutzt werden.
Freemind Mindmap Entwicklung
Um Mindmaps zu erstellen wählt man im Menü “Maps” den Mindmapmodus. Die Oberfläche ändert sich und es können weitere Funktionen genutzt werden.
Wer sich einige Tastaturkürzel merkt, kann sehr schnell Mindmaps erstellen oder ändern. Es lassen sich Bilder, Dateien und Hyperlinks einbinden.
Im unteren Bereich sehen Sie den Editor für Kommentare. Hier kann mit einem WYSIWYG Editor oder im Quellcode mit HTML und Cascading Style Sheets gearbeitet werden.
Auf der linken Seite befinden sich kleine Grafiken, die zum Text hinzugefügt werden können. Dadurch lassen sich grafische Hinweise wie Prioritäten und Hinweise in die Äste hinzufügen.
Die Mindmaps lassen sich vielfältig exportieren. Es stehen die Dateiformate HTML, Flash, Java Applet, PDF, SVG, verschiedene Bild- und Office Formate zur Verfügung. Hier zwei Beispiele einer exportierten Mindmap.
Beispiel1:
Mini Mindmap Webseiten entwickeln in 3 Minuten
Beispiel2:
Fazit: Danke, Tony Buzan für deine genialen Ideen!
Mindmapping setze ich nun bereits seit ca. 10 Jahren erfolgreich ein. Ich bin immer wieder begeistert, welche Potentiale durch Mindmapping freigesetzt werden.
In meinen Workshops können Sie Mindmapping kennenlernen.
Durch einheitliche Designvorgaben, die oft Style Guides genannt werden, lassen sich Webseiten mit einheitlicher Bedienung und Aussehen erstellen. Bei Webdesign wird im professionellen Umfeld immer mit diesen Methoden gearbeitet.
Die Designvorgaben enthalten folgende Informationen:
- Ziel der Webseite
- Zielgruppe der Nutzer
- URLs der betroffenen Webseiten
- Struktur der Webseite
- Technologie (HTML, CSS, …)
- Maße der Tabellen oder Boxen
- Rahmen
- Schriftarten
- Gliederung von Bildern, Grafiken und anderen Objekten
- Beispielseiten mit den Stil
- Homepage Struktur
- HTML Seiten
- CSS Dateien
- Javascript Dateien
- Frameworks
- sonstige Objekte
Es gibt verschiedene Wege zur Dokumentation. Ich persönlich finde ein Wiki am praktischsten, wenn in einer Gruppe an den Webseiten gearbeitet wird.
Wenn eine Person die Seiten bearbeitet, dann kann auch ein Open Office Text Dokument eingesetzt werden. Dies hat den Vorteil, dass die HTML-Beispiele direkt in die Dokumentation mit eingearbeitet werden können.
William Deming lebte von 1900 bis 1993 und wird von Experten als Vater der Qualitätsbewegung angesehen. Unter anderem wird der von Ihm entwickelte PDCA Zyklus als Basis zur Qualitätssicherung genutzt.
Deming Zyklus zur Qualitätssicherung
Diese Methode lässt sich leicht zur Qualitätssicherung von Webseiten und bei der Webdesign Entwicklung nutzen.
- Planen bedeutet das Vorbereiten nach den vorgegebenen Stil Regeln (Style Guides)
- Ausführen ist das Umsetzen der geplanten Webseiten und Inhalte
- Prüfen bedeutet das Durchsuchen der Webseiten nach Fehlern
- Reagieren heißt, dass nach der festellten von Mängeln der Entwicklungsprozess ganz oder teilweise mit geänderten Vorgaben wiederholt wird
Das Ganze wird in bestimmten Zeitabständen wiederholt. Im Laufe der Zeit ändern sich die Anforderungen. Daher ist dies ein stetiger Prozess, der über die Lebensdauer der Webseiten anhält.
Hier finden Sie Regeln von William Edwards Deming, die zu erfolgreichen Bestehen und Expansion im Markt führen.
Im Projektmanagement gibt es verschiedene Phasen. Diese nennt man Prozesse. Diese sind nach DIN 8402 definiert:
- Prozesse bestehen aus Tätigkeiten und Mitteln. Diese stehen in Wechselwirkung zueinander.
- Bei Prozessen müssen Eingaben gemacht werden.
- Prozesse geben Ergebnisse aus.
Im Schaubild sehen Sie den Prozessablauf bei Projekten. Diese Vorgehensweise eignet sich für kleinere Webprojekte.
Auf Grund einer Idee wird die Umsetzung eines Vorhabens geprüft. Diese Analyse dient auch als Projekt-Vorbereitung, falls die Verantwortlichen auf Grund des Analyseergebnisses das Projekt freigeben.
In der Planungs- und Konzeptionsphase werden Umfang, Inhalte, Design der Webseiten und die Verteilung der Aufgaben festgelegt. Zudem wird ein Zeitplan erstellt.
Nach Fertigstellung werden die Webseiten auf Funktion und Fehler geprüft. Wenn Fehler festgestellt werden, so beseitigt sie der Ersteller der Webseiten. Danach erfolgt erneut die Prüfung, bis die Webseiten einbandfrei dargestellt werden.
Nun können die Webseiten veröffentlicht werden.