Rubrik Navigation
Musterseite für Web-CMS
Diese Musterseite soll Ihnen die Möglichkeiten von unserem Web-CMS und deren korrekte Verwendung im Sinne einer einheitlichen und flexiblen Gestaltung der Webseiten aufzeigen.
Der zweite Absatz hier, der durch ein ENTER erzeugt wurde, hat automatisch einen Abstand zum vorhergehenden Absatz.
-> Wollen Sie keinen Abstand, müssen Sie UMSCH-ENTER drücken.
Wichtige Formatierungen (Überschriftsebene 2)
Die erste Überschriftsebene ist für die Seitenüberschrift (Musterseite für Web-CMS) vorgesehen. Benutzen Sie diese Ebene nicht oder nur sehr gezielt im eigenen Text.
Als nächstes sollte immer die Überschriftsebene 2 folgen, auch wenn optisch eine andere Ebene besser passen sollte. Denken Sie daran, das die Optik durch zentrale Konfigurationsdateien bestimmt wird.
Textformatierungen (3. Ebene)
Benutzen Sie die rechts schwebende braune
Box und denken Sie daran, mit UMSCH-ENTER
einen Zeilenwechsel zu machen.
Sollen bestimmte Wörter hervorgehoben werden, gibt es 3 Möglichkeiten: einfaches Fettschreiben genügt manchmal. Noch auffälliger ist ein hervorgehobener Text.
Als vierte Möglichkeit,
die ebenfalls nur gezielt
eingesetzt werden sollte,
gibt es den farblich
hinterlegten
bzw. markierten Text.
(Dies ist eine links
schwebende braune Box)
Wem das immer noch zu wenig ist, schreibt den hervorgehobenen Text in Fettschrift. Eine Unterstreichung ist nicht vorgesehen, weil sie mit Hyperlinks verwechselt werden kann.
Weniger wichtige Texte und Kleingedrucktes wird mit kleiner Schrift dargestellt. So passt sehr viel Information auf eine Seite.
Eine Aufzählung erscheint immer etwas eingerückt:
- erster Punkt
- und wenn ein zweiter Punkt mal etwas länger werden sollte, so dass er nicht mehr auf eine Zeile passt, wird die folgende Zeile ebenfalls eingerückt
Mit UMSCH-ENTER können Sie z.B. eine Leerzeile einfügen und den Aufzählungstext hier fortsetzen - dritter Punkt
Hier kann mittels code-Format ein Programmcode eingefügt werden:
Es ist ein paradiesmatisches Land, in dem einem
gebratene Satzteile in den Mund fliegen.
Eine Datumsangabe, wie der 12. März 2010, kann im Text durch ein kleines Symbol hervorgehoben werden.
Genauso ist die bei Uhrzeitangaben möglich. Ein Termin am 12. März um 12 Uhr kann im Text durch ein kleines Symbol hervorgehoben werden.
Verweise auf andere Seiten oder auf einen ausführlichen Text auf anderen Seiten werden mit einem kleinen grünen Pfeil (Verweis grün) markiert. mehr
Daneben gibt es eine Reihe automatisch vorgenommener Formatierungen, z.B. wenn Sie eine PDF-Datei zum download anbieten, wird automatisch das Acrobat-Icon davor gesetzt: Download Handbuch. Oder bei einer Emailadresse test@hnee.de wird ein kleiner Brief dahinter angezeigt.
Noch mehr Boxen
Es gibt neben den braunen Boxen noch welche in einer anderen Farbe. Dies sind die grünen Boxen, die auch entweder links oder rechts schweben können. Dieses Beispiel nutzt die links schwebende Box.
Es gibt neben den braunen Boxen noch welche in einer anderen Farbe. Dies sind die grünen Boxen, die auch entweder links oder rechts schweben können. Dieses Beispiel nutzt die rechts schwebende Box.
Mehrspaltiger Text
Um den breiten Inhaltsbereich besser lesbar zu gestalten, empfielt sich der Einsatz mehrerer Textspalten. Es sollte möglichst darauf verzichtet werden, Tabellen als Hilfsmittel für das Gestalten der Spalten zu nutzen. Dafür werden eine Reihe sogenannter Snippets bereitgestellt.
Mit dem folgenden Texten soll die Verwendung der Snippets beispielhaft gezeigt werden.
Zweispaltiger Text (jede Spalte 50% breit)
Dreispaltiger Text (jede Spalte 33% breit)
Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien leben die Blindtexte. Abgeschieden wohnen Sie in Buchstabhausen an der Küste des Semantik, eines großen Sprachozeans. Ein kleines Bächlein namens Duden fließt durch ihren Ort und versorgt sie mit den nötigen Regelialien.
Das Einfügen von Bildern
Bildbox links augerichtet
Ein Bild wird rechts von Text umflossen
Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien leben die Blindtexte. Abgeschieden wohnen Sie in Buchstabhausen an der Küste des Semantik, eines großen Sprachozeans. Ein kleines Bächlein namens Duden fließt durch ihren Ort und versorgt sie mit den nötigen Regelialien. Es ist ein paradiesmatisches Land, in dem einem gebratene Satzteile in den Mund fliegen. Nicht einmal von der allmächtigen Interpunktion werden die Blindtexte beherrscht — ein geradezu unorthographisches Leben. Eines Tages aber beschloß eine kleine Zeile Blindtext, ihr Name war Lorem Ipsum, hinaus zu gehen in die weite Grammatik. Der große Oxmox riet ihr davon ab, da es dort wimmele von bösen Kommata, wilden Fragezeichen und hinterhältigen Semikoli, doch das Blindtextchen ließ sich nicht beirren. Es packte seine sieben Versalien, schob sich sein Initial in den Gürtel und machte sich auf den Weg. Als es die ersten Hügel des Kursivgebirges erklommen hatte, warf es einen letzten Blick zurück auf die Skyline seiner Heimatstadt Buchstabhausen, die Headline von Alphabetdorf und die Subline seiner eigenen Straße, der Zeilengasse.
Einsatz von Tabellen
Eine Tabelle sollte möglichst nicht für Layout-Zwecke benutzt werden, sondern zur Darstellung von Informationen. Es sind inzwischen mehr als 9 Tabellenvarianten verfügbar:
| Variante 1 | |
| Überschriftenzeile | nein |
| Überschriftenspalte | ja |
| wechselfarbige Zeilen | nein |
| Features | |
| Variante 2 | Überschriftenzeile: ja |
Denken Sie daran, dass jede Zelle automatisch ein Leerzeichen enthält! Wenn Sie, wie unter Features, mehrere Zeilen in einer Zelle schreiben wollen, müssen Sie das Leerzeichen erst löschen (Zeilenwechsel mit UMSCH-ENTER).
| Variante 3 | ist vorhanden |
| Überschriftenzeile | ja |
| Überschriftenspalte | ja |
| wechselfarbige Zeilen | nein |
| Variante 4 | ist vorhanden |
| Überschriftenzeile | nein |
| Überschriftenspalte | nein |
| wechselfarbige Zeilen | nein |
| Variante 5 | |
| Überschriftenzeile | nein |
| Überschriftenspalte | nein |
| wechselfarbige Zeilen | ja |
| Variante 6 | ist vorhanden |
| Überschriftenzeile | ja |
| Überschriftenspalte | ja |
| wechselfarbige Zeilen | nein |
|
| Features |
| Variante 7 | Überschriftenzeile: ja |
|
| Features |
| Variante 8 | Überschriftenzeile: ja |
|
| Features |
| Variante 9 | Überschriftenzeile: ja |
| Variante 10 | |
| Überschriftenzeile | nein |
| Überschriftenspalte | nein |
| wechselfarbige Zeilen | nein |
| Hintergrundfarbe | nein |
| Tabellenränder | nein |
| Variante 11 | |
| Überschriftenzeile | nein |
| Überschriftenspalte | nein |
| wechselfarbige Zeilen | nein |
| Hintergrundfarbe | nein |
| Tabellenränder | nein |
Die Breite der Spalten wird automatisch so groß gewählt, dass die gesamte Breite des Inhaltsbereiches genutzt wird (100%).
Bildmenüs
Studentenleben
Hier kommt erklärender Text hinein. Das ist das Snippet: Bildmenü 1x horizontal.
Natürlich funktionieren auch andere Formate hier drinnen. Standardmäßig geht der Text bis zum Rand, wenn Sie nicht vorher mit UMSCH-ENTER einen Zeilenumbruch einfügen.
Schreibweise von Kontaktdaten
Die Schreibweise von Telefonnummern und Emailadresse sollte einheitlich erfolgen. Wenn Sie Emailadressen auf unserer Webseite veröffentlichen, kann es sein, dass Sie bald mehr Spams als gewöhnlich erhalten.
Terminlisten
Hier kommen Informationen zur Veranstaltung hinein. 2. Diskussionsforum umweltorientierte Unternehmensführung "EMASeasy - Umweltmanagement im Ökolandbau?"
Hier kommen Informationen zur Veranstaltung hinein. Sommerakademie des Studiengangs Ökolandbau und Vermarktung.
Linklisten und andere Listen
Hier steht eine Liste die als Linkliste formatiert wurde.