Übung 1.2: Die Struktur der Website entwerfen

Zeigen

Sie müssen Übung 1.1: Ein Webprojekt erstellen beendet haben, bevor Sie die Struktur Ihrer Website entwerfen können.

Eine Website setzt sich aus einer Sammlung von Webseiten zusammen. Während eine Webseite tatsächlichen Inhalt (wie z.B. HTML-Elemente, Abbildungen oder Links) enthält, ist eine Website die hierarchische Struktur und Organisation der Webseiten zueinander. Eine Website sollte einen übergeordneten Aufgabenbereich haben (beispielsweise die Bereitstellung eines organisierten Erfassungsbereichs für Kleinanzeigen) und jede Webseite kann einen bestimmten Zweck bei der Erfüllung dieses übergeordneten Aufgabenbereichs übernehmen (z.B. eine Seite, die die aufgegebenen Anzeigen durchsucht).

Die beste Art, um mit dem Entwurf Ihrer Website zu beginnen, ist zu überlegen, welche Funktionen die Site unterstützen soll, um das übergeordnete Ziel zu erreichen. Für eine Website für Kleinanzeigen kennen Sie mehrere Funktionen, die die Site erfüllen soll. Sie wissen beispielsweise, dass Besucher der Site die Anzeigen durchsuchen und vollständig anzeigen können sollen. Ausserdem sollen Sie in der Lage sein, neue Einträge zu erstellen und zu bearbeiten.

Um eine Website zu erstellen, die diese Funktionen ausführt, werden wir in dieser Übung vier Seiten planen und diese Seiten in der nächsten Übung dann selbst erstellen.


  1. Erweitern Sie in der Sicht 'Projekt-Explorer' den Projektnamen ClassifiedsTutorial.
  2. Doppelklicken Sie in der Sicht 'Projekt-Explorer' auf Websitenavigation. Web Site Designer wird in der Sicht "Navigation" geöffnet. Mit diesem Tool können Sie die Webseiten, aus denen sich die Website zusammensetzt, hinzufügen, löschen und neu anordnen.
  3. Zunächst werden in der Sicht "Navigation" keine Seitensymbole angezeigt. Die erste Seite, die Sie normalerweise beim Entwurf der Website betrachten, ist die Anfangsseite oder Homepage der Site. Dies ist die Seite, über die Besucher Ihre Website betreten. Ziehen Sie die Komponente Neue Seite aus der Sicht "Palette" und übergeben Sie sie an die Sicht "Navigation". Ein Seitensymbol wird angezeigt, zusammen mit dem Navigationstitel der betrachteten Seite.
  4. Diese Seite soll die Homepage werden, auf der alle Anzeigen in der Datenbank angezeigt werden sollen. Geben Sie Alle Kleinanzeigen anzeigen als Navigationstitel der Seite ein. An einer späteren Stelle erfahren Sie noch, wie der Navigationstitel als Seitenbeschriftung zum Zweck der Navigation in der Site verwendet wird.
  5. Damit Besucher der Site eigene Listen übergeben können, ist eine Seite zum Erstellen neuer Listen erforderlich. Fügen Sie ein zweites Seitensymbol hinzu, indem Sie die Komponente Neue Seite in die Sicht "Navigation" direkt unter das Seitensymbol Alle Kleinanzeigen anzeigen ziehen. 
  6. Geben Sie der neuen Seite den Namen Anzeige aufgeben. Beachten Sie, dass das neue Seitensymbol unterhalb des Seitensymbols für Alle Kleinanzeigen anzeigen angezeigt wird und mit einer Linie verbunden ist. Dies bedeutet, dass die Seite "Anzeige aufgeben" der Seite "Alle Kleinanzeigen anzeigen" untergeordnet ist.
  7. Sie benötigen ausserdem eine Seite, auf der Besucher bestehende Anzeigen bearbeiten oder löschen können. Wenn ein Besucher beispielsweise eine Anzeige für ein Fahrrad aufgegeben hat, und die Anzeige über einen längeren Zeitraum hinweg keinerlei Reaktion hervorgebracht hat, möchte der Verkäufer möglicherweise den Preis senken. Fügen Sie ein weiteres Seitensymbol neben "Anzeige aufgeben" hinzu und geben Sie ihm den Namen Anzeige aktualisieren. Beachten Sie, dass dieses neue Seitensymbol ein gleichgeordnetes Element zu "Anzeige aufgeben" und ein weiteres untergeordnetes Element zu "Alle Kleinanzeigen anzeigen" ist.
  8. Als nächstes benötigt Ihre Website eine Suchfunktion, über die Besucher die bestehenden Anzeigen durchsuchen können, um die möglicherweise interessanten zu finden. Um eine Seite für die Anzeige von Suchergebnissen einzufügen, setzen Sie ein weiteres Seitensymbol neben die Seite "Anzeige aktualisieren" und geben Sie ihm den Namen Gefilterte Anzeigen.
    Hinweis: Wenn Sie eine Seite unbeabsichtigt an der falschen Stelle platzieren oder die Seitenstruktur umordnen möchten, können Sie die Seitensymbole durch Ziehen jederzeit neu anordnen.
  9. Drücken Sie Strg+S, um den Site-Entwurf zu speichern. Die Sicht "Navigation" sollte folgendermaßen aussehen:
Websitenavigation für das Projekt 'ClassifiedsTutorial'.

Beachten Sie, dass sich am unteren Ende jedes Seitensymbols eine Zeile mit kleinen Symbolen befindet. Das erste Symbol, das noch nicht sichtbar ist, stellt tatsächliche Dateien dar, die dem Symbol zugeordnet sind. Dieses Symbol wird angezeigt, sobald die Dateien erstellt sind. Wenn Sie eine JSP-Datei erstellen, handelt es sich bei dem Symbol um eine blaue Raute(); im Fall einer HTML-Datei ist das Symbol ein Satz Klammern(). Das zweite () und das dritte Symbol () sind sichtbar. Hierdurch wird angezeigt, dass standardmäßig alle Seiten so eingestellt sind, dass sie jeweils in der Navigation und in Website-Übersichten erscheinen. Das vierte Symbol (), das noch nicht sichtbar ist, wird angezeigt, wenn ein Seitensymbol einer tatsächlichen Datei zugeordnet wird, die keine Websitenavigation enthält. Das Symbol (), das noch nicht am oberen Rand des Seitensymbols sichtbar ist, stellt das Stammverzeichnis der Navigation dar. Im Rahmen dieses Moduls werden Sie noch mehr über diese Symbole und andere Aspekte der Seitensymbolanzeige erfahren.

Nachdem Sie nun eine allgemeine Website-Struktur erstellt haben, sind Sie bereit, um mitÜbung 1.3: Die Website mit Webseiten ausfüllen zu beginnen.

Nutzungsbedingungen | Feedback

(C) Copyright IBM Corporation 2000, 2005. Alle Rechte vorbehalten.