Web Style Guide

Identebene 2

Zusammenfassung der Anforderungen an Angebote der Identebene 2

Verwendung der Identebene 2

Nach den Verwendungsrichtlinien zum Corporate Design sind zentrale Einrichtungen und Fakultäten dazu verpflichtet, das Corporate Design unter Verwendung der Identebene 1 oder 1e anzuwenden.

Andere Einrichtungen und Institutionen an der Universität sind angehalten, Identebene 1 oder 1e zu verwenden. Wenn bislang ein eigenes professionelles Design traditionell eingesetzt wird, das weiterhin benutzt werden soll, ist die Identebene 2 anzuwenden.

Anforderungen

Webangebote der Identebene 2 müssen lediglich einen definierten Schutzraum mit Uni-Logo aufweisen.

Hierbei sind folgenden Punkte zu beachten:

Der Schutzraum erstreckt sich über die gesamte Angebotshöhe und darf weder beschnitten noch überschrieben werden. Ein Transparenzeffekt ist ggf. möglich.
Der Schutzraum ist links oder rechts dem bisherigen Angebot hinzuzufügen.
Die Breite des Schutzraumes ergibt sich aus der Größe des verwendeten Uni-Logos abzüglich des rechten oder linken Querbalkens, der in das bisherige Angebot hineinragt (siehe Beispiele).
Als Uni-Logo ist die Variante Uni_Logo_E2 zu verwenden (Download s.u.). Die Größe kann ggf. sinnvoll dem bisherigen Angebot angepasst werden, darf jedoch die Maße von 70px x 100px nicht unterschreiten.
Das Uni-Logo muss mit der Hompage der Universität Freiburg (http://www.uni-freiburg.de) verlinkt sein.

Einbindung Schutzraum mit Uni-Logo

Der Schutzraum mit Uni-Logo kann ohne größeren Aufwand durch umschließende DIV-Container dem bisherigen Angebot hinzugefügt werden.

Hierzu muss lediglich ein passendes Uni-Logo auf dem Webserver zur Verfügung gestellt und die folgenden Code-Ergänzungen um das bisherige Angebot gelegt werden:

Angebot mit fester Breite, Schutzraum rechte Seite, Logo oben:

<div id="wrapper" style="background-color:#FFF; width:947px;"> *)
  <div id="wrapper-content" style="float:left;">
    <div>Bisheriges Webangebot</div>
  </div>
  <div id="wrapper-unilogo" style="float:left; width:67px; height:100%;">
    <a href="http://www.uni-freiburg.de">
      <img id="unilogo" alt="Logo Universität Freiburg" src="Uni_Logo_E2_80x114.png" 
           style="margin:64px 0 0 -17px; position:absolute; z-index:1;"/>
    </a>
  </div>
  <div style="clear:both;" />
</div>

*) Anmerkung: Die Breite im umschließenden DIV-Container "wrapper" setzt sich zusammen aus bisheriger Breite + Schutzraum.

Demo: Angebot mit fester Breite

Angebot mit flexibler Breite, Schutzraum rechte Seite, Logo oben:

<div id="wrapper" 
     style="background-color:#FFF; width:100%; margin-right:-67px; float:left;">
  <div id="wrapper-content" style="width:100%;">
    <div id="content" style="background:###bisherige Definition###; margin-right:67px;">
      Bisheriges Webangebot
    </div> *)
  </div>
</div>
<div id="wrapper-unilogo" style="float:right; width:67px;">
  <a href="http://www.uni-freiburg.de">
    <img id="unilogo" alt="Logo Universität Freiburg" src="Uni_Logo_E2_80x114.png" 
         style="margin:64px 0 0 -17px; position:absolute; z-index:1;"/>
  </a>
</div>
<div style="clear:both;" />

*) Anmerkung: Die Background-Definitionen (Farbe, Graphik etc.) müssen zwingend in den DIV-Container "content" gelegt werden, da ansonsten der Schutzraum mit unterlegt wird.

Demo: Angebot mit flexibler Breite