Styleguide für den Internetauftritt der OvGU

Präsentation zum Thema: "Styleguide für den Internetauftritt der OvGU"—  Präsentation transkript:

1

2 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

3 Styleguide für den Internetauftritt der OvGU
Grundlegendes Gestalterisches Beispielhaftes 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

4 Web-Styleguide der OvGU Grundlegendes
Gestalterisches Beispielhaftes 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

5 Web-Styleguide der OvGU Grundlegendes
Gestalterisches Beispielhaftes 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

6 Web-Styleguide der OvGU Grundlegendes
Gestalterisches Beispielhaftes 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

7 Web-Styleguide der OvGU Grundlegendes
Gestalterisches Beispielhaftes 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. Master- und Akzentfarben der zentralen Seiten des OvGU-Webauftrittes Primärfarbspektrum Seegrün Dipl.-Ing. A. Gerecke

8 Web-Styleguide der OvGU Grundlegendes
Gestalterisches Beispielhaftes Akzentfarben: Akzentfarben aus den Farbspektren Gelb, Hell- und Dunkelorange, Hellgrün und Hellblau Weiter Farbspektren: Rot, Reingelb, Blau Grautöne Überblick Studium Forschung International Kontakt Dipl.-Ing. A. Gerecke

9 Web-Styleguide der OvGU Grundlegendes
Gestalterisches Beispielhaftes 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

10 Web-Styleguide der OvGU Grundlegendes
Gestalterisches Beispielhaftes Seitenaufbau: Dipl.-Ing. A. Gerecke

11 Web-Styleguide der OvGU Grundlegendes
Gestalterisches Beispielhaftes Contenbereich: screen/css definieren Überschriften Links (auf interne und externe Seiten, s, Bilder) Listen- und Formulargestaltung Tabellen Bilder und Linien Downloadangebote Templates Standard, Portrait, Allgemein, Aktuelles, …) Dipl.-Ing. A. Gerecke

12 Web-Styleguide der OvGU Grundlegendes
Gestalterisches Beispielhaftes Dipl.-Ing. A. Gerecke

13 Web-Styleguide der OvGU Grundlegendes
Gestalterisches Beispielhaftes Dipl.-Ing. A. Gerecke