SN:Gruppen/AG Technik/Webseite/Layoutkonzept

Dieses Layoutkonzept bezieht sich auf folgendes Design: hier zu finden. Dieses Layout dient als Beispiel und soll zeigen, wie das Layoutkonzept funktioniert. Dabei sind Farben und Symbolik optional, die Aufteilung jedoch bindend.

Einleitung

Die neuen Webseiten der Piraten in Sachsen bieten eine völlig neue Struktur. Sie ist geradliniger und bietet dem Nutzer die Informationen, die er braucht, um sich zurecht zu finden und schnell die Informationen zu erreichen, die er braucht. Durch ein schnörkelloses Design mit klaren Linien, sowie ein paar wenigen Highlights wird der Besucher nicht von der eigentlichen Thematik abgelenkt und verweilt so länger auf den Seiten.

Farben (optional)

Die Hintergrundfarbe wurde aus dem CI des Landes Sachsen genommen. Das Grün wurde 1815 eingeführt, weil Friedrich August I. während der Befreiungskriege Generalleutnant von Lecoq das Kommando über die sächsischen Truppen am Rhein übergab. Damit es im Kampf keine Verwechslung mit anderen Kontingenten gäbe, sollte Lecoq das bis dahin weiße Hoheitszeichen an den Uniformen der Truppe mit einem breiten grünen Rand umgeben.

So wurden die frischen Farben nach den verlustreichen Befreiungskriegen zum Symbol für den Neuanfang. Dieser Neuanfang soll auch das Symbol der sächsischen Piraten werden. Durch die neue Homepage können die User schneller und einfacher an Informationen gelangen.

Symbolik (optional)

Das Design verzichtet zum Großteil auf viele Symbole und Grafiken. So kommen neben dem sächsischen Piratenlogo eine stillisierte Grafik eines Mannes, einer Frau und einer Überwachungskamera, sowie im unteren Bereich der Webseite weitere Kameras vor. Der Besucher soll daran erinnert werden, dass er ständig und überall überwacht werden kann.

Durch die Größe der Kamera im oberen Bereich, soll ein Unwohlsein hervorgerufen werden, durch dass sich der Besucher animiert sieht, etwas dagegen zu unternehmen (zum Beispiel Mitglied werden, Mitmachen, ...). Die Kamera wurde genutzt, weil sie jeder auf den ersten Blick erkennt und unmissverständlich klar macht: Big Brother is watching you.

Aufteilung

Die Webseite bietet klare Strukturen. Bei der Gestaltung wurde der Lesefluss von oben nach unten und von links nach rechts berücksichtigt. Grundsätzlich kann man das Layout in fünf Bereiche teilen: Header, Links, Mitte, Rechts, Unten, wobei jeder Bereich seine klar Definierte Funktionalität mit sich bringt.

Oben - der Headerbreich

Der Header hat die Aufgabe Aufmerksamkeit zu erzeugen, den Besucher zu begrüßen und ein paar Metainformationen zu bieten. Im säsischen Design wurde der Header in fünf Bereiche aufgeteilt: Oben links ist die Position des Logos, sowie der eben erklärten Symbolik. Rechts oben befinden sich Bookmarks zu wichtigen Seiten des Bundesverbandes. Darunter ist ein Werbebanner platziert, der auf wichtige Aktionen (FsA, ...) aufmerksam machen soll. Unten links ist ein Brotkrumenmenü, welches dem User Zeit, in welcher Ebene der Webseite befindet. Unten rechts ist eine Quicklink-Dropdownbox, welche den fehlgeleiteten Besucher zu seinem Landesverband bringen soll. - Anstatt die einzelnen Städte in die Sitemap aufzunehmen wäre es sinnvoller diese hier in der Quicklinkdropbox zu positionieren.

Links - die Hauptnavigation

Dieser Bereich wird dazu verwendet die Sitemap bis in die 2. Ebene darzustellen. Der User soll durch die einfache Gestaltung schnell abgeholt werden, sodass er die gewünschte Information ohne Umwege finden kann. Dezente Farben, wie ein pastell-orange weisen den Besucher darauf hin, wo er sich gerade befindet. Es ist grundsätzlich nicht gestattet auf diesen Bereich andere Informationen abzulegen, da sonst der User verwirrt werden könnte und die Webseite ihre klare Linie verliert.

Mitte - Der Inhaltsbereich

Hier braucht nicht viel gesagt zu werden: Der Inhaltsbereich stellt den - haltet euch fest - den Inhalt dar. Erklärungen über die verschiedenen Module werden in Punkt 2 besprochen.

Rechts - Die Sidebar

Die Sidebar der Webseite ist die Schnittstelle nach draußen. Das Thema hier heisst vernetzen. So befinden sich viele fluktuierende Inhalte (Termine, Twitter, News) auf ihr. Die Aufgabe besteht darin dem Besucher weiterführende Informationen zu zeigen, die Menschen dahinter zu präsentieren und auch um auf diverse Aktionen der Piraten aufmerksam zu machen. Die Sidebar ist flexibel anpassbar, jedoch muss darauf geachtet werden, dass nicht zu viele Informationen dargestellt werden. Desweiteren werden die genauen Inhalte der Sidebar im Punkt "Module" beschrieben.

Unten - Der Footer

Der Footer hat auf dieser Webseite nur eine Meta-Aufgabe. Er bietet Links zu Semi-Relevanten Seiten, wie Impressum, Kontaktseiten, Datenschutz oder AGBs. Der Footer erfüllt somit die Aufgabe, die Webseite rechtlich gesehen zu legitimieren.