http://www.uni-magdeburg.de

AG-Internet Sitzung am 21. März 2007 2

http://www.uni-magdeburg.de

Styleguide für den Internetauftritt der OvGU

Struktureller Aufbau

1 Grundlegendes Definition des Anliegens Festlegen des Geltungsbereiches Allgemein Anzuwendendes Empfehlungen zur Barrierefreiheit

2 Gestalterisches Gestaltungsfläche Farben, Typographie Seitenaufbau

3 Beispielhaftes

Anhang Styleguide der OvGU und das Contentmanagementsystem EgoCMS Hinweise an Administratoren Hinweise an Redakteure zur Nutzung der EgoCMS-Templates

Dipl.-Ing. A. Gerecke

AG-Internet Sitzung am 21. März 2007 3

http://www.uni-magdeburg.de

Anliegen: Die Otto-von-Guericke-Universität tritt visuell einheitlich und geschlossen auf. Jede Einheit sieht sich als ein Teil dieses Ganzen.

Geltungsbereich: Das Web-Styleguide gilt für den zentralen Internetauftritt der Universität (Zentrale Gremien und Verwaltung) sowie für andere Struktureinheiten wie Fakultäten und zentrale Einrichtungen. Diese Instanzen entscheiden, welche nachgeordneten Struktureinheiten den Styleguide anwenden müssen bzw. können.

Dipl.-Ing. A. Gerecke

Grundlegendes

Styleguide für den Internetauftritt der OvGU

Gestalterisches Beispielhaftes

AG-Internet Sitzung am 21. März 2007 4

http://www.uni-magdeburg.de

Web-Styleguide der OvGUGrundlegendes

Allgemein Anzuwendendes: Das Corporate Design des Internet-Auftrittes der OvGU hat feststehende Basiselemente: die stets zu positionierende Wortmarke der OvGU (Schriftzug), die Bildwortmarke der OvGU (Logo der OvGU), das 5-Farbentupel als Zugehörigkeitssymbol zum

Internetauftritt der OvGU für andere Ressorts und Strukturbereiche,

einen einheitlichen Schriftfont

Empfehlungen zur Barrierefreiheit: Ein barrierefreier Zugang zum Internet bedeutet, dass Internetanwendungen so entwickelt und technisch umgesetzt werden, dass ein größtmöglicher Nutzerkreis mit unterschiedlichsten Hard- und Software-Voraussetzungen oder speziellen Hilfsmitteln die Inhalte erreichen kann.

Dipl.-Ing. A. Gerecke

Grundlegendes Gestalterisches Beispielhaftes

AG-Internet Sitzung am 21. März 2007 5

http://www.uni-magdeburg.de

Web-Styleguide der OvGUGrundlegendes

Das Layout wird in cascading stylesheets (css) definiert.

CSS sind Stilvorlagen, die es ermöglichen, das Layout, die Schriften, Farben etc. von HTML-Seiten zu definieren.

Dipl.-Ing. A. Gerecke

Grundlegendes Gestalterisches Beispielhaftes

AG-Internet Sitzung am 21. März 2007 6

http://www.uni-magdeburg.de

Web-Styleguide der OvGUGrundlegendes

Gestaltungsfläche: ist in neun, konsistent platzierte und in ihren Funktionen einheitliche Bereiche aufgeteilt: die Logobereiche links und rechts für die Bildwortmarke der

OvGU und/oder einer Struktureinheit

der Identitätsbereich mit der primären (obersten) Navigationsebene - den Hauptkategorien

dem Navigationsbereich mit den ggf. auch hierarchisch strukturierten Navigationsebenen

der Contentbereich für die Text- und Bildinhalte

der weiterführende Informationsbereich ggf. für externe Links oder aktuelle Meldungen

die Servicebereiche links und rechts mit Servicefunktionen

die Fußzeile

Dipl.-Ing. A. Gerecke

Grundlegendes Gestalterisches Beispielhaftes

AG-Internet Sitzung am 21. März 2007 7

http://www.uni-magdeburg.de

Web-Styleguide der OvGUGrundlegendes

Farben: Das Farbklima des zentralen Internetauftritts der OvGU bilden die Farbspektren Seegrün für die Masterfarbe, Gelb, Hell- und Dunkelorange, Hellgrün und Hellblau für die Akzentfarben der Hauptnavigationsbereiche Überblick, Studium, Forschung, International und Kontakt.

Dipl.-Ing. A. Gerecke

Grundlegendes Gestalterisches Beispielhaftes

Primärfarbspektrum Seegrün

Master- und Akzentfarben der zentralen Seiten des OvGU-Webauftrittes

AG-Internet Sitzung am 21. März 2007 8

http://www.uni-magdeburg.de

Web-Styleguide der OvGUGrundlegendes

Akzentfarben:

Akzentfarben aus den Farbspektren Gelb, Hell- und Dunkelorange, Hellgrün und Hellblau

Weiter Farbspektren: Rot, Reingelb, Blau

Grautöne

Dipl.-Ing. A. Gerecke

Grundlegendes Gestalterisches Beispielhaftes

Überblick Studium Forschung International Kontakt

AG-Internet Sitzung am 21. März 2007 9

http://www.uni-magdeburg.de

Web-Styleguide der OvGUGrundlegendes

Typographie: Das Corprate Design der OvGU verwendet für Online-Medien die Systemschriften Times New Roman und Verdana. Der Einsatz unterschiedlicher Schriftschnitte (Regular, Italic, Bold) und Schriftgrößen ergibt ein differenziertes, jedoch stets auf Klarheit bedachtes, modernes Schriftbild. Times New Roman Regular wird ausschließlich für den

Schriftzug OTTO-VON-GUERICKE-UNIVERSITÄT MAGDEBURG verwendet.

Verdana Regular in unterschiedlichen Schriftgrößen ist die Grundschrift für Fließtexte, Titel, Kapitelüberschriften sowie Bild- und Tabellenlegenden.

Verdana Bold ist für die verstärkte Auszeichnung von Überschriften vorgesehen.

Dipl.-Ing. A. Gerecke

Grundlegendes Gestalterisches Beispielhaftes

AG-Internet Sitzung am 21. März 2007 10

http://www.uni-magdeburg.de

Web-Styleguide der OvGUGrundlegendes

Seitenaufbau:

Dipl.-Ing. A. Gerecke

Grundlegendes Gestalterisches Beispielhaftes

AG-Internet Sitzung am 21. März 2007 11

http://www.uni-magdeburg.de

Web-Styleguide der OvGUGrundlegendes

Contenbereich:

screen/css definieren Überschriften Links (auf interne und

externe Seiten, E-Mails,Bilder)

Listen- und Formulargestaltung

Tabellen Bilder und Linien Downloadangebote

Templates Standard, Portrait,

Allgemein, Aktuelles, …)

Dipl.-Ing. A. Gerecke

Grundlegendes Gestalterisches Beispielhaftes

AG-Internet Sitzung am 21. März 2007 12

http://www.uni-magdeburg.de

Web-Styleguide der OvGUGrundlegendes

Dipl.-Ing. A. Gerecke

Grundlegendes Gestalterisches Beispielhaftes

AG-Internet Sitzung am 21. März 2007 13

http://www.uni-magdeburg.de

Web-Styleguide der OvGUGrundlegendes

Dipl.-Ing. A. Gerecke

Grundlegendes Gestalterisches Beispielhaftes

http://www.fmb.uni-magdeburg.de