Planungsphase: Webseitenkonzept erstellen

Aus PapayaCMS

Wechseln zu: Navigation, Suche

Im Folgenden soll dargestellt werden, wie Sie von einem Layout-Konzept zur konkreten Implementierung einer papaya-Webseitenvorlage gelangen können. Dabei sollten Sie beachten, dass in papaya CMS eine Seite aus drei verschiedenen Elementen zusammengesetzt ist:

  • Statische Elemente: Statische Elemente sind vor allem Objekte wie Layoutgrafiken oder Titel- bzw. Fußleisten mit Inhalten, die auf allen Seiten gleich bleiben.
  • Inhaltselemente: Inhaltselemente werden durch Seitenmodule generiert und im Content-Bereich einer Webseite dargestellt.
  • Funktionselemente: Funktionselemente werden durch Boxmodule generiert und in entsprechenden Boxbereichen dargestellt. Zu den Funktionselementen gehören bspw. die Seitennavigation, die Suche sowie weitere Kontextinformationen.

Wenn Sie ein Webseitenlayout planen, legen Sie also Layout und Grafik fest und bestimmen die Position des Inhaltselements sowie der einzelnen Funktionselemente. Bei der Konzeption von Aufbau und Inhalt der Seiten müssen Sie also festlegen,

  • ob ein zwei- oder dreispaltiges Layout verwendet werden soll,
  • welche Boxen auf der Webseite enthalten sein sollen und schließlich,
  • an welcher Stelle Sie Boxen wie die Seitennavigation und die Seitensuche positionieren wollen.

Das Layout und die in der Webseite enthaltenen Elemente richtet sich schließlich nach den Inhalten, die Sie auf Ihrer Site anbieten möchten. Im Folgenden werden Ihnen nun drei mögliche Layouts vorgestellt.

Inhaltsverzeichnis

Zweispaltiges Layout

Das folgende Schema stellt ein zweispaltiges Grundgerüst mit Titelleiste dar:

Zweispaltiges Grundgerüst

Die linke Spalte stellt den Bereich für die Navigationsboxen dar, während der zentrale Content-Bereich den Rest der Bildschirmbreite ausfüllt - sofern die Gesamtbreite nicht durch CSS beschränkt wird. Die Titelleiste erstreckt sich wie auch im vorhergenannten Schema über die Gesamtbreite von Box- und Content-Bereich.

Dieses Schema eignet sich vor allem für kleinere Sites, da verhältnismäßig wenig Inhalte auf übersichtliche Weise dargestellt werden können.

Dreispaltiges Layout mit Titelleiste

Das folgende Schema stellt eine klassische dreispaltige Aufteilung des Content-Bereiches mit Titelleiste dar:

Dreispaltiges Grundgerüst mit Titelleiste

Die linke Spalte stellt den Bereich für die Navigationsboxen dar und die rechte Spalte enthält Boxen, die Kontextinformationen darstellen. Im zentralen Bereich in der Mitte des Bildschirmes, im Content-Bereich, werden die Inhalte wie bspw. Artikel und Bilder dargestellt.

Dieses Schema eignet sich vor allem für Sites, die neben unstrukturierten Inhalten wie Text und Bild auch Foren, FAQ-Listen und sonstige strukturierte Inhalte verwalten, die sich an geeigneter Stelle mit Boxen im Kontext-Bereich anteasern lassen. Sie können bspw. auf der Forumsseite mit einer Box eine FAQ-Frage anzeigen, die zum Forenthema passt.

Komplexes Layout mit vielen Boxbereichen

Das letzte Schema stellt ein Layout vor, das über die dreispaltige Aufteilung des Content-Bereiches hinausgeht und weitere Boxbereiche für zusätzliche Web-Funktionen und Inhalte definiert:

Komplexes Grundgerüst mit vielen Boxbereichen

In diesem Layout sind also nicht nur Box-Bereiche für eine Navigation- und Kontext-Spalte definiert, sondern zusätzliche Bereiche für eine Breadcrumb-Navigation und eine Suchfunktion. Zudem existieren weitere Boxbereiche links und rechts in der Titelleiste. Als zusätzlicher Box-Bereich wurde noch eine Fußzeile eingefügt.

Dieses Layout eignet sich dazu, in bestimmten Box-Bereichen zusätzliche Funktionen einzubinden. Solche Funktionen können bspw. die Volltextsuche, das Anpassen der Schriftgröße oder die Ausgabe von Artikeln im PDF-Format beinhalten. Sie sollten jedoch bei solchen komplexen Layouts beachten, dass die Seite an Übersicht verliert, je komplexer die Struktur der Seite wird. Durch überladene Seiten können sogar bestimmte Bereiche untergehen, die Sie als besonders wichtig erachten.

Das Layout des Demotemplates in papaya CMS

Das Demotemplate in papaya CMS stellt sowohl den klassischen zweispaltigen sowie den dreispaltigen Layout-Typ dar. Der zweispaltige Typ wird automatisch durch das Template generiert, wenn Sie in papaya CMS keine Boxen für die rechte Spalte definieren.

Persönliche Werkzeuge