Upload
popescu
View
230
Download
4
Embed Size (px)
Citation preview
EinführungDie Bundesregierung wird in ihrer Gesamtheit wahrgenommen.
Deshalb tritt sie mit ihren Ressorts visuell einheitlich und geschlossen auf –
unabhängig vom Medium. Dieser Styleguide beinhaltet die Übertragung
der für den Printbereich vereinbarten Gestaltungsrichtlinien auf die Online-
Auftritte der Bundesregierung und ihrer Ressorts. Ziel ist die einheitliche
und benutzerfreundliche Gestaltung der Internetpräsenzen und Online-
Medien der Bundesregierung, ohne individuelle Gestaltungsmöglichkeiten
zu sehr einzuschränken.
Der Online-Styleguide der Bundesregierung gilt für das Bundes-
kanzleramt, das Presse- und Informationsamt der Bundesregierung und die
Bundesministerien. Die Ministerien entscheiden, welche nachgeordneten
Behörden den Styleguide anwenden müssen bzw. können. Der Styleguide
richtet sich an Mediendesign-Agenturen.
Das Corporate Design der Bundesregierung hat feststehende Basis-
elemente, die unabhängig vom jeweiligen Medium gelten und in den Online-
Auftritten an technische Gegebenheiten angepasst sind:
die stets oben links positionierte Bildwortmarke, ein nach Primär-
und Sekundärfarben gestuftes Farbspektrum und einheitliche Schriften.
Die Basiselemente werden einheitlich auf den Websites der
Bundesregierung eingesetzt und tragen so zu einem gemeinsamen „Look
and Feel“ der Online-Medien bei. Daneben gibt es einen Spielraum, der den
Anforderungen der unterschiedlichen Medien in ihrer Nutzung und Hand-
habung Rechnung trägt.
Die Gestaltungsfläche ist in einen Logo-, Identitäts-, Service-, Navi-
gations- und einen Contentbereich aufgeteilt, deren Anordnung durch den
Styleguide definiert ist.
Die im Corporate Design der Bundesregierung verwendeten und
mit ihren Positionen definierten Gestaltungselemente erleichtern die Hand-
habung und Orientierung auf den einzelnen Websites.
Die Farbwahl einer Internetpräsenz orientiert sich in ihrer Anmu-
tung an der Thematik und ihren Inhalten. Die Farben sind einerseits dem
Corporate Design unterworfen, bieten aber zusammen mit der Bildwahl, z. B.
im Identitätsbereich, genügend Spielraum für die individuelle Gestaltung
des Betreibers.
Als Maßeinheiten für die Positionierung und die Größenangaben
von Layoutelementen werden die relativen Einheiten Pixel (px), M-höhe (em)
und Prozent (%) verwendet. Die Angaben sind für eine Bildschirmauflösung
1024 px x 768 px optimiert.
Das Informationsangebot der Bundesregierung und ihrer Ressorts
im Internet ist gemäß dem Gleichstellungsgesetz vom 01. 05. 2002 spätestens
ab dem 31.12. 2005 behindertengerecht, also barrierefrei zugänglich anzu-
bieten.
Online-Medien unterliegen einem rasanten technischen Fort-
schritt. Auch für den Online-Styleguide der Bundesregierung sind deshalb
kurzfristige Änderungen im Detail nicht ausgeschlossen. Im Internet unter
http://styleguide.bundesregierung.de/ kann stets die aktuelle Version eingese-
hen werden.
Die folgenden Gestaltungsvorgaben wurden entwickelt, um ein
optimales Erscheinungsbild bei einer Bildschirmauflösung von 1024 px x 768 px
zu gewährleisten.
Hierbei wird davon ausgegangen, dass das Browserfenster im Bild-
schirm füllend dargestellt und keine so genannten Y Sidebars (zusätzliche,
senkrechte Browserleisten, z. B. „Favoriten“ beim Internet Explorer) geöffnet
sind.
Eine Umsetzung von parallelen Versionen eines Angebots für ver-
schiedene Auflösungen ist nicht notwendig.
Im Kapitel „Anwendungsbeispiele“ wird der gestalterische Spiel-
raum der Corporate-Design-Richtlinien anhand beispielhafter Screenshots
visualisiert.
Gestaltungsfläche
Die Gestaltungsfläche ist in ein Grundraster mit Rastereinheiten
(RE) von jeweils 28 px x 20 px (Breite x Höhe) unterteilt. Gestalterisch wird
hier, auf Basis der empfohlenen Bildschirmauflösung von 1024 px x 768 px,
von einer inneren Browserfenster-Breite von 952 px ausgegangen.
Gemäß den Vorgaben zur Barrierefreiheit sollte bei der Gestaltung
und Programmierung eines Online-Angebotes aber darauf geachtet werden,
dass die Webseiten unabhängig von Bildschirmauflösungen, Browserfenster-
Größen oder eingestellter Schriftgröße eines Nutzers gut funktionieren und
ansprechend aussehen.
Grundlagen
6 G r u n d l a g e n
Der Styleguide für Online-Medien der Bundesregierung ist im Internet unter
http://styleguide.bundesregierung.de zu erreichen
Dies bedeutet, dass sich die Breite der Gestaltungsfläche prinzipiell
nach der Browserfenster-Größe des Nutzers richtet. Die Browserfenster-Größe
muss von der tatsächlichen Bildschirmauflösung unterschieden werden, da
der Nutzer die Größe seines Browserfensters unabhängig von der Bildschirm-
auflösung seines Monitors individuell bestimmen kann. Im Übrigen ist zu be-
rücksichtigen, dass viele Nutzer noch über Bildschirme von nur 800 px Breite
verfügen.
Bei der Seitenprogrammierung sollte daher darauf geachtet wer-
den, dass horizontale Bildlaufleisten, sog. Y Scrollbars, erst dann erscheinen,
wenn die äußere Browserfensterbreite kleiner als 800 px ist. Es kann zudem
eine Maximalbreite angegeben werden, um eine Zeilenlänge von mehr als
70 Zeichen in Fließtexten zu vermeiden.
Eine vertikale Begrenzung ist nicht definiert, da die Anordnung
und Länge der Seiten von der Struktur und Darstellungsweise ihrer Inhalte
abhängt.
Geht die Gestaltung in der Vertikalen stark über den sichtbaren Be-
reich hinaus, sollten die Inhalte durch Y Sprungmarken angemessen geglie-
dert werden.
Die Breite der Gestaltungsfläche, ausgehend von einem 1024 px breiten Browserfenster
Anmerkung: Für die Texte in allen schematischen Darstellungen wurde die Schrift Verdana verwen-
det. Sie wurde dem Online-Einsatz entsprechend nicht geglättet.
Raster
Der Raster wird immer, beginnend an der linken oberen Ecke, von
oben nach unten und von links nach rechts aufgebaut.
Anmerkung: Da in den Illustrationen die Vermaßungslinie 1 px
misst, wird die linke und obere Linie einbezogen. Die rechte untere Linie
liegt außerhalb der zu vermaßenden Fläche.
8 G r u n d l a g e n
Der Grundraster wird aus Rastereinheiten (RE) von 1,75 em x 1,25 em (28 px x 20 px) gebildet.
Zur feinen Abstufung dient ein Ausrichtungsraster von 0,25 em x 0,25 em (4 px x 4 px).
Grundraster
Für die Online-Medien der Bundesregierung
wurde der Raster, dem Pixelmaß entspre-
chend, modifiziert. Die Abstände der hori-
zontal verlaufenden Rasterlinien betragen
1,75 em (28 px), die der vertikalen 1,25 em (20
px). Der Raster richtet sich an der oberen lin-
ken Ecke der Gestaltungsfläche aus. Eine Ra-
stereinheit wird nachfolgend RE genannt.
Der Grundraster dient als Grundlage zur Aus-
richtung der unflexiblen Bereiche und Farb-
flächen.
Empfehlungen für Spaltenraster zur Ausrich-
tung von Bild und Text finden Sie im Kapitel
„Contentbereich“.
Ausrichtungsraster
Für die Anordnung feiner und detaillierter
Gestaltungselemente wird der Grundraster
durch einen zusätzlichen Ausrichtungsraster
ergänzt. Er beträgt 4 px x 4 px und beginnt
deckungsgleich mit dem Grundraster links
oben.
Screen-Aufteilung
Die Gestaltungsfläche wird in fünf konsistent platzierte und in ih-
ren Funktionen einheitliche Bereiche aufgeteilt. Dies erleichtert die Orien-
tierung in den unterschiedlichen Präsenzen der Bundesregierung und trägt
zu ihrer Wiedererkennung in erheblichem Maße bei. Die fünf Bereiche sind:
- der Logobereich für die Bildwortmarke
- der Identitätsbereich, ggf. mit der obersten Navigationsebene
- der Navigationsbereich mit den Navigationsebenen, ggf. auch den
hierarchisch tieferen Ebenen
- der Servicebereich mit Servicefunktionen der Internetpräsenz
- der Contentbereich für die Text- und Bildinhalte.
Detaillierte Angaben über die Gestaltung
und Funktion dieser Bereiche folgen in den
Kapiteln „Seitenaufbau“ und „Zusatzinfor-
mationen“ (Frames, Auffindbarkeit von Web-
Inhalten).
Die Aufteilung der Gestaltungsfläche in Bereiche
Beispiele für die Aufteilung der Gestaltungs-
fläche (siehe auch Kapitel „Anwendungsbei-
spiele“)
Farben
Ein wesentliches Basiselement des Corporate Designs ist das Farb-
klima. Ein ausgewähltes Farbklima ist eine Farbkombination, die zur unver-
wechselbaren Gesamtwirkung innerhalb des Corporate Designs beiträgt.
Dabei steht keine Farbe für sich allein, sondern ist immer von einer anderen
Farbe umgeben.
Das Corporate Design verfügt über mehrere Farbklimata für
unterschiedliche Einsatzgebiete. Für jedes Farbklima gilt, dass für Akzentuie-
rungen innerhalb der Internetpräsenz reine und klare Farben gewählt
werden. Farbflächen sind aus den gedeckten Farbtönen eines Klimas gewählt.
Die Verknüpfung des Identitäts- und des Navigationsbereiches
wird durch gleiche Farbklimata und gedeckte, abgetönte Farbflächen visua-
lisiert. Der Contentbereich, Träger der Hauptinformationen, wird von den
Farbflächen gehalten und hebt sich durch helle oder weiße Hintergrund-
farben ab.
Die Farbwahl einer Internetpräsenz orientiert sich in ihrer Anmu-
tung an der Thematik und ihren Inhalten.
Grundsätzlich sollte die Gestaltungsfläche mittig oder linksbündig
auf einer mit Weiß definierten Hintergrundfläche stehen. Durch die weiße
Hintergrundfarbe entsteht eine Verbindung mit der Bildwortmarke bzw.
eine Abgrenzung von den Navigations- und Informationsebenen.
Informationen zum Umgang mit Farben unter dem Gesichtspunkt
der Barrierefreiheit sind dem Kapitel „Zusatzinformationen“ zu entnehmen.
Ein wesentlicher Bestandteil der Farbwirkung ist, dass die Farben
der Staatsfahne vorzugsweise auf einem weißen Hintergrund stehen.
Für die Online-Anwendungen werden die Primärfarben um alle
reinen Grautöne, d. h. alle Hexadezimalzahlen mit sechs gleichen Stellen
(zum Beispiel #DDDDDD), erweitert.
10 G r u n d l a g e n
Primärfarben
Die Primärfarben Schwarz, Rot und Gelb sind
aus der Staatsfahne der Bundesrepublik
Deutschland abgeleitet. Sie benötigen des-
halb einen besonderen Umgang und dürfen
nur gezielt, sparsam und wirkungsvoll einge-
setzt werden.
CMYK-Wert
Hexadezimalwert
0|0|0|25
#999999
0|100|100|0
#FF0000
0|5|30|5
#F0ECDD
0|0|0|50
#666666
0|100|100|25
#990000
0|12|100|5
#FFCC00
0|0|0|100
#000000
0|100|100|45
#660000
0|20|100|15
#CC9900
Die Primärfarben mit ihren Hexadezimalzahlen
#FF6600
0|70|100|0
Hexadezimalwert
CMYK-Wert
#FF8C40
80 %
#FFB280
60 %
#FFD1B2
40 %
#FFF0E5
20 %
#D95700
0|70|100|20
#D9712B
80 %
#D98B57
60 %
#E5AE8A
40 %
#EDD4C2
20 %
#B34700
0|70|100|40
#BF5E1D
80 %
#BF7543
60 %
#CC9570
40 %
#D9B9A3
20 %
#993D00
0|70|100|60
#A65119
80 %
#AB6537
60 %
#B8815C
40 %
#BF9F8C
20 %
#803300
0|70|100|80
#8C4515
80 %
#99592E
60 %
#A66F4B
40 %
#AD8F79
20 %
#FF9900
0|40|100|0
#FFB340
80 %
#FFCC80
60 %
#FFE0B2
40 %
#FFF5E5
20 %
#CC7A00
0|40|100|20
#CC8F33
80 %
#D9A962
60 %
#E3C18F
40 %
#E8D9C5
20 %
#B36B00
0|40|100|40
#B37D2D
80 %
#BA8D4A
60 %
#C7A573
40 %
#D1C0A7
20 %
#8C5400
0|40|100|60
#996B26
80 %
#A1783B
60 %
#B09061
40 %
#B3A289
20 %
#6B4000
0|40|100|80
#805516
80 %
#8F672C
60 %
#997C51
40 %
#998A73
20 %
#007744
100|0|90|0
#2C9458
80 %
#65B876
60 %
#95CC95
40 %
#CAEOCA
20 %
#006633
100|0|90|20
#1F8248
80 %
#4DA15C
60 %
#7DB87D
40 %
#ADCCAD
20 %
#005229
100|0|90|40
#166B37
80 %
#388547
60 %
#65A165
40 %
#95BA95
20 %
#004015
100|0|90|60
#105728
80 %
#287036
60 %
#508A50
40 %
#7FA37F
20 %
#003300
100|0|90|80
#0E4721
80 %
#245E2E
60 %
#457A45
40 %
#6F946F
20 %
#ABBA00
50|0|100|0
#BDC936
80 %
#D0D96C
60 %
#E0E5A1
40 %
#EBEDD5
20 %
#8C9900
50|0|100|20
#A2AD28
80 %
#B6BF56
60 %
#C7CC85
40 %
#D6D9B8
20 %
#758000
50|0|100|40
#8F9926
80 %
#9EA64B
60 %
#AEB374
40 %
#BDBFA3
20 %
#5E6600
50|0|100|60
#788020
80 %
#888F40
60 %
#9A9E67
40 %
#A4A68D
20 %
#464D00
50|0|100|80
#60661A
80 %
#777D38
60 %
#888C5B
40 %
#979982
20 %
#1144AA
100|60|0|0
#446EC4
80 %
#76A4D7
60 %
#9BBDDE
40 %
#CFDCE5
20 %
#003399
100|60|0|20
#2656AB
80 %
#517EBD
60 %
#81A6CC
40 %
#B8CBD9
20 %
#002A80
100|60|0|40
#1F4991
80 %
#42699E
60 %
#7091B3
40 %
#9FB6C7
20 %
#002266
100|60|0|60
#1A3B75
80 %
#385885
60 %
#5D7C9C
40 %
#879EAD
20 %
#001A4D
100|60|0|80
#142E5C
80 %
#2D476B
60 %
#4A6580
40 %
#738A99
20 %
#2DC7E5
100|10|0|0
#64D6ED
80 %
#91E3F2
60 %
#C2EAF2
40 %
#E6F0F2
20 %
#26A6BF
100|10|0|20
#4EB9CF
80 %
#7ACDDE
60 %
#ACDBE3
40 %
#CFE2E5
20 %
#2190A6
100|10|0|40
#46A5B8
80 %
#70BDCC
60 %
#98CAD4
40 %
#BCD1D6
20 %
#1B7385
100|10|0|60
#388FA1
80 %
#59A4B3
60 %
#84B6BF
40 %
#A9C2C7
20 %
#145866
100|10|0|80
#307B8A
80 %
#4C8C99
60 %
#6F9FA8
40 %
#97B2B8
20 %
Sekundärfarbspektrum
Corporate-Design-Schriften
Das Corporate Design der Bundesregierung verwendet die Schrif-
ten Neue Demos und Neue Praxis als Hausschriften. Sie wurden für die
Bundesregierung überarbeitet und sind sowohl typografische Basis als auch
integraler Bestandteil in den Printmedien der Bundesregierung.
In Online-Medien können diese Schriften nur in Bildelementen
Verwendung finden (z. B. Texte in Bildern und Grafiken, Überschriften als
Bilder).
Als Y Systemschrift wird für die Online-Medien der Bundesregie-
rung die Verdana festgelegt.
Da nicht davon ausgegangen werden kann, dass die Verdana auf
allen verwendeten Betriebssystemen der Nutzer installiert ist, wird eine Fol-
ge von Alternativschriften angegeben. Sie lautet: Helvetica, Arial, Tahoma,
Sans Serif.
Durch die Angabe der Schriftgrößen in der absoluten Maßeinheit
px (Pixel) in den Y CSS wird die Vergrößerung der Schriften durch den Be-
nutzer unterdrückt. Die Angabe der Schriftgrößen sollte für einen barriere-
freien Zugang in relativen Prozentangaben bzw. em-Werten erfolgen.
Der Einsatz von Systemschriften erfordert keinen Erwerb von Nut-
zungsrechten und ist somit kostenfrei.
12 G r u n d l a g e n
Informationen zu „Barrierefreiheit und Schrif-
ten“ sind dem Kapitel „Zusatzinformationen“
zu entnehmen. Dort ist auch eine Umrech-
nungstabelle für Schriftgrößen beigefügt.
Die Corporate-Design-Schriften der Bundesregierung für den Online-Bereich
ABCDEFGHIJKLMNOPQRSTUVWXYZÄËÖÜabcdefghijklmnopqrstuvwxyzäöüáôçø1234567890 [{}(,.;:!?&ß-*@)]
Neue Praxis
ABCDEFGHIJKLMNOPQRSTUVWXYZÄËÖÜÁÇÔØabcdefghijklmnopqrstuvwxyzäöüáôçø 1234567890 [{}(,.;:!?€&ß-*@)] ƒ
Neue Demos
ABCDEFGHIJKLMNOPQRSTUVWXYZÄËÖÜÁÇÔØabcdefghijklmnopqrstuvwxyzäöüáô1234567890[{}(,.;:!?€&ß-*@)] 1234567890ƒ
Verdana
Bild- und Formensprache
Die klare und eindeutige Bildsprache bedient sich der journalisti-
schen und dokumentarischen Farb- oder Schwarz-Weiß-Fotografie. Sie ver-
meidet Metaphern, Inszenierungen und Collagen ebenso wie grafische Nach-
bearbeitungen, zum Beispiel Verläufe, Filter oder andere Verfremdungen.
Die grafischen Elemente für die Internetpräsenzen der Bundesre-
gierung basieren auf den Formen Quadrat, Rechteck und Linie. Sie werden
zur Gliederung der Y Navigationsebenen oder zur strukturierten Darstellung
der Inhalte verwendet. Eine Kombination unterschiedlicher Elemente ist
ebenso zu vermeiden wie die Verwendung von Kreisen, Ovalen, abgerunde-
ten Ecken sowie grafischen 3D-Effekten. Der Radius, mit dem die linke obere
Ecke des Identitätsbereiches abschließt, stellt als ein tragendes Element des
Erscheinungsbildes eine Ausnahme dar. Die einzelnen Elemente werden wie
folgt definiert:
- Für Linienstärken gilt: 1 px, 2 px, 4 px, 8 px, 16 px oder 20 px.
- Für Quadrate und Rechtecke gilt: Ihre Seitenlängen müssen durch 4
teilbar sein und sich am Ausrichtungsraster orientieren.
- Für Dreiecke gilt: Es sind nur rechtwinklige Dreiecke oder im Schrift-
satz vorhandene Winkel zugelassen.
- Für Pfeile gilt: Die Pfeilspitze soll einen rechten Winkel bilden.
Umsetzung des Corporate Designs auf der Website der Bundesregierung
Die Bundesregierung tritt durch ihre Ressorts mit verschiedenen
Internetpräsenzen an die Öffentlichkeit. Aufgrund der stark unterschied-
lichen Inhalte ist die visuelle Homogenität von großer Bedeutung für die
Identifikation und Wiedererkennung. Zudem erleichtert eine einheitliche
Screen-Aufteilung (vgl. Kapitel „Screen-Aufteilung“) in Bereiche den Benut-
zern die Navigation auf den verschiedenen Internetpräsenzen.
Logobereich
Im Logobereich wird ausschließlich die Bildwortmarke des jeweili-
gen Ressorts positioniert. Der Logobereich befindet sich auf der Gestaltungs-
fläche in der linken oberen Ecke.
Die Breite des Logobereiches ergibt sich aus der Breite der Y Bild-
wortmarke des jeweiligen Ressorts. Diese wurden einschließlich ihrer
Y Schutzzone auf zwei Breiten vereinheitlicht: entweder schmal (kürzerer
Ressortname) oder breit (längerer Ressortname).
Bei schmalen Bildwortmarken nimmt der Logobereich eine Breite
von 7 RE (= 196 px) ein und bei breiten Bildwortmarken eine Breite von 9 RE
(= 252 px). Die Höhe des Logobereiches ist einheitlich mit 5 RE (= 100 px) defi-
niert.
Für die Umsetzung in relativen Schriftgrößen-Einheiten wird aus-
gehend von einer 16 px Standard-Schriftgröße eine Breite von 196 px in 12,25 em
und eine Breite von 252 px in 15,75 em umgewandelt.
Der Hintergrund des gesamten Logobereiches ist weiß.
Seitenaufbau
16 S e i t e na u f b a u
Bildwortmarke
Die Bildwortmarke der Bundesregierung und
ihrer Ressorts besteht aus drei korrespondie-
renden Elementen: dem Bundesadler, dem
dreifarbigen Säulenelement und dem vom
Ressort abhängigen Text. Diese Elemente ste-
hen in einem durch den Raster fest definier-
ten Verhältnis zueinander und dürfen weder
verändert noch skaliert werden.
Die Bildwortmarke hat vier unterschiedliche
Größen: S, M, L und XL. Für die Online-Medien
werden ausschließlich farbige GIF-Dateien
der Größe M verwendet. Die Bildwortmarken
sind in deutsch- und englischsprachigen Ver-
sionen für die Bereiche Office, Internet und
Print auf den CD-ROMs der Corporate-Design-
Manuals zu finden. Die Corporate-Design-Ma-
nuals können unter
http://styleguide.bundesregierung.de
direkt aus dem Internet heruntergeladen
oder bestellt werden beim
Presse- und Informationsamt der
Bundesregierung,
Dorotheenstraße 84,
10117 Berlin,
E-Mail: [email protected].
Der Logobereich
Die Bildwortmarke in zwei Breiten mit jeweiliger Schutzzone
Bundesministerium fürwirtschaftliche Zusammenarbeitund Entwicklung
Die Bundesregierung
Die Farben der Bildwortmarke entsprechen
den Primärfarben der Bundesregierung. Die
Bildwortmarke steht grundsätzlich auf einer
weißen Fläche. Andere Platzierungen auf
Schwarz- oder Farbflächen sowie auf Bildern
sind unzulässig.
Die Bildwortmarke braucht, um repräsenta-
tiv wirken zu können, einen Freiraum: die
Schutzzone. Die einzelnen Schutzzonen-
Module entsprechen in der Größe den Raster-
einheiten von 28 px x 20 px. In der Vertikalen
wird die Schutzzone durch Module begrenzt,
die ober- und unterhalb des
Y Säulenelements stehen. Die linke Begren-
zung bildet ein Modul, dessen rechte Kante
sich mit der Mittelachse des Bundesadlers
deckt. Rechts wird das Modul an den letzten
Buchstaben des Textes gehängt. Empfeh-
lung: Der Weißraum wird über den Identi-
tätsbereich hinaus fortgeführt.
Die Bildwortmarke schließt oben, inklusive
ihrer Schutzzone, bündig mit der Gestal-
tungsfläche ab. Links wird die Schutzzone
der Bildwortmarke mit 12 px Abstand zum lin-
ken Rand der Gestaltungsfläche gesetzt.
An der Bildwortmarke darf ausschließlich
Text ausgerichtet werden, der wiederum
bündig mit dem Text der Bildwortmarke
steht. Weitere Gestaltungselemente dürfen
sich nicht auf die Bildwortmarke beziehen.
Empfehlung: Die Bildwortmarke ist mit ei-
nem Link zur Homepage belegt, so dass die
Homepage immer mit einem Klick erreichbar
ist. Die Bildwortmarke darf dabei nicht durch
Animation verändert werden.
Die Platzierung der Bildwortmarke im Logobereich
Die durch Rastereinheiten/Schutzzonen-Module definierte Schutzzone der Bildwortmarke
Identitätsbereich
Durch eine aussagekräftige Gestaltung des Identitätsbereichs wird
die Bundesregierung oder das jeweilige Ressort als Betreiber der Internet-
präsenz deutlich gekennzeichnet. Der Identitätsbereich dient der Wieder-
erkennung und als Orientierungshilfe für die Besucher der Websites und
muss auf allen Seiten eingesetzt werden.
Der Identitätsbereich kann die oberste Ebene der Navigation, das
Hauptmenü, beinhalten. Es wird empfohlen, nicht mehr als sechs Punkte im
Hauptmenü zu platzieren.
Ob das Hauptmenü im Identitätsbereich steht oder ob alle Ebenen
im Navigationsbereich angesiedelt werden, muss aufgrund der Komplexität
und Tiefe der Navigationsstruktur individuell entschieden werden.
Die Platzierung anderer Navigationselemente im Identitätsbereich
ist nicht gestattet. Eine Ausnahme bildet die Positionierung des Servicebe-
reichs (vgl. Kapitel „Servicebereich“) im Identitätsbereich.
Die Aufteilung der Gestaltungsfläche in einen Identitäts-, einen
Navigations- und einem Contentbereich wird durch eine Farbkodierung dar-
gestellt. Die Verknüpfung des Identitäts- und des Navigationsbereichs wird
durch gleiche Farbklimata und gedeckte, abgetönte Farbflächen visualisiert.
Der Contentbereich, Träger der Hauptinformationen, wird von den Farbflä-
chen gehalten und hebt sich durch helle oder weiße Hintergrundfarben ab.
Der Akzentuierung dienen klare, reine und helle Farben aus einem der defi-
nierten Farbklimata.
Empfehlung: Über die weitere Ausgestaltung durch Verwendung
zusätzlicher Gestaltungselemente, zum Beispiel Farbflächen oder Bilder, ent-
scheidet das jeweilige Ressort. Es ist darauf zu achten, dass eine gestalteri-
sche Verbindung zum Navigationsbereich gewahrt bleibt und der Logobe-
reich optisch nicht beeinträchtigt wird.
Der Identitätsbereich schließt mit seiner Oberkante bündig mit der
Gestaltungsfläche ab. Links wird er durch den Logobereich begrenzt. In der
Breite nimmt er den gesamten verbleibenden Raum rechts des Logobereichs
ein. Die Höhe beträgt 100 px. Bei Schriftvergrößerung durch den Nutzer be-
legt er gegebenenfalls mehr Raum in der Höhe.
Um der Bildwortmarke einen repräsentativen Wirkungsraum zu
geben, sollten auch außerhalb der Schutzzone großzügig weiße Flächen
stehen. Um eine optische Verbindung zwischen der Hintergrundfläche und
der Schutzzone zu schaffen, wird empfohlen, die oberen 20 px des Identitäts-
bereichs mit einer weißen Fläche zu unterlegen.
18 S e i t e na u f b a u
Sprachregelungen
Einheitliche Sprachregelungen und Benennun-
gen in den unterschiedlichen Internetpräsen-
zen und Online-Medien erleichtern den Besu-
chern die Orientierung und Navigation. Aus
diesem Grund wird die Benennung von zwei
Punkten der obersten Navigationsebene vor-
gegeben:
- „Ministerium“ (bzw. „Bundesregierung“,
„Bundeskanzler“)
anstelle vager oder wechselnder Bezeich-
nungen wie: Das Ministerium, Wir über uns,
Über uns, Behörden und Einrichtungen, Die
Ministerien, Die Staatssekretäre etc.
- „Themen“
anstelle vager oder wechselnder Bezeich-
nungen wie: Schwerpunkte, Sachgebiete,
Fachabteilungen, Arbeitsfelder etc.
Die Benennung aller weiteren Menüpunkte im
Identitätsbereich bleibt den einzelnen Ressorts
überlassen. Empfehlung: Folgende Bezeichnun-
gen werden weiterhin eingesetzt:
- „Aktuelles“
für aktuelle Nachrichten und Themen.
- „Publikationen“
für Veröffentlichungen, Broschüren, Maga-
zine und Medien aller Art.
- „Presse“
für Presseforum, Interviews, Mitteilungen
und Reden.
Im Übrigen sind hierzu die Informationen zu
„Barrierefreiheit und Sprache“ im Kapitel
„Zusatzinformationen“ zu beachten.
Das Bildelement des Identitätsbereiches kann an der oberen linken
Ecke mit einem auszeichnenden Gestaltungselement der Internetpräsenzen
versehen werden: einem Radius. Dieser entspricht einem geglätteten Vier-
telkreis mit einem Durchmesser von 24 px.
Schriften
Die Navigation im Identitätsbereich wird in
der Systemschrift Verdana in einer Schriftgrö-
ße von 0,7 em oder 0,75 em in Bold gesetzt.
Die Reihenfolge der Alternativschriften ist
Verdana, Helvetica, Arial, Tahoma, Sans Serif.
Im Übrigen ist hierzu die „Umrechnungsta-
belle Schriftgrößen“ im Kapitel „Zusatzinfor-
mationen“ zu beachten.
Interaktives Verhalten
Es ist möglich, die Buttons des Hauptmenüs
mit einer Klickfunktion oder einem YDrop-
down-Menü zu belegen, wenn der Naviga-
tionsbereich weitere Navigationsebenen
beinhaltet. Hinweis: Da Drop-down-Menüs
bisher nicht geräteunabhängig zu bedienen
sind, muss jedoch parallel ein geräteunab-
hängiger Zugang zu den Informationen an-
geboten werden.
Es wird empfohlen, zwischen Y Active,
YHover-/Focus-,Y Visited und YUnvisited
Links zu differenzieren. Grafische Spielformen
wie Blinkeffekte oder Ähnliches sind auszu-
schließen.
Anwendungsbeispiel für einen Identitätsbereich auf einer Website des Presse- und Informations-
amtes der Bundesregierung
Die beiden Größen des Identitätsbereichs
Die beiden Schriftarten und -größen des
Identitätsbereichs
Navigationsbereich
Der Navigationsbereich nimmt entweder alle Y Navigationsebenen
oder die Navigation unterhalb der ersten Ebene auf. Bei nur zwei Naviga-
tionsebenen wird empfohlen, diese vollständig in den Navigationsbereich
zu integrieren. Bei komplexeren Seitenstrukturen ist es ratsam, die oberste
Navigationsebene im Identitätsbereich zu platzieren.
Dabei ist allgemein darauf zu achten, dass die Farben und Schriften
im Navigations- und im Identitätsbereich übereinstimmen. Durch diese ge-
stalterische Verbindung beider Bereiche darf der Logobereich optisch nicht
beeinträchtigt werden.
Die Aufteilung der Gestaltungsfläche in einen Identitäts-, einen
Navigations- und einen Contentbereich wird durch eine Farbkodierung dar-
gestellt. Die Verknüpfung des Identitäts- und des Navigationsbereiches wird
durch gleiche Farbklimata und gedeckte, abgetönte Farbflächen visualisiert.
Der Contentbereich, Träger der Hauptinformationen, wird von den Farbflä-
chen gehalten und hebt sich durch helle oder weiße Hintergrundfarben ab.
Der Akzentuierung dienen klare, reine und helle Farben aus einem der defi-
nierten Farbklimata.
Grafische Gestaltungselemente wie Farbflächen und ggf. verwen-
dete Schriften sollten mit dem Identitätsbereich korrespondieren. Die Ver-
wendung von Fotos und Y Grafikelementen oder weiteren funktionalen Ele-
menten ist im Navigationsbereich nicht gestattet.
Der Navigationsbereich ist entweder 7 RE (= 196 px = 12,25 em) oder
9 RE (= 252 px = 15,75 em) breit, abhängig von der Breite des Logobereichs
und den geplanten Wortlängen der Navigationsbegriffe. Wird die Schrift-
größen-Einstellung vom Nutzer erhöht, wächst auch die Breite.
Der Navigationsbereich beginnt am linken Rand der Gestaltungs-
fläche. Er schließt mit der Oberkante unmittelbar an den Logobereich an.
Am linken Rand des Navigationsbereichs ist ein vertikaler Streifen von 12 px
Breite weiß definiert.
Innerhalb des Navigationsbereichs werden die einzelnen Elemente
entsprechend dem Ausrichtungsraster positioniert.
20 S e i t e na u f b a u
Sprachregelungen
Einheitliche Sprachregelungen und Benen-
nungen in den unterschiedlichen Internet-
präsenzen und Online-Medien erleichtern
den Besuchern die Orientierung und Naviga-
tion. Aus diesem Grund wird die Benennung
von zwei Punkten der obersten Navigations-
ebene vorgegeben:
- „Ministerium“ (bzw. „Bundesregierung“,
„Bundeskanzler“)
anstelle vager oder wechselnder Bezeichnun-
gen wie: Das Ministerium, Wir über uns, Über
uns, Behörden und Einrichtungen, Die Mini-
sterien, Die Staatssekretäre etc.
- „Themen“
anstelle vager oder wechselnder Bezeich-
nungen wie: Schwerpunkte, Sachgebiete,
Fachabteilungen, Arbeitsfelder etc.
Die Benennung aller weiteren Menüpunkte im
Identitätsbereich bleibt den einzelnen Ressorts
überlassen. Empfehlung: Folgende Bezeichnun-
gen werden weiterhin eingesetzt:
- „Aktuelles“
für aktuelle Nachrichten und Themen.
- „Publikationen“
für Veröffentlichungen, Broschüren, Maga-
zine und Medien aller Art.
- „Presse“
für Presseforum, Interviews, Mitteilungen
und Reden.
Im Übrigen sind hierzu die Informationen zu
„Barrierefreiheit und Sprache“ im Kapitel
„Zusatzinformationen“ zu beachten.
Der Navigationsbereich
Beispiele für die Benennung der ersten Navigationsebene auf der Website des Bundesministeriums für
Familie, Senioren, Frauen und Jugend
Schriften
Im Sinne eines einheitlichen Erscheinungsbil-
des ist für die Navigation ein einheitlicher
Schrifttyp zu verwenden: Die Reihenfolge
der Alternativschriften ist Verdana, Helvetica,
Arial, Tahoma, Sans Serif.
Im Übrigen ist hierzu die „Umrechnungstabelle
Schriftgrößen“ im Kapitel „Zusatzinformatio-
nen“ zu beachten.
Interaktives Verhalten
Wurde bei der Navigation im Identitätsbe-
reich ein Y Drop-down-Menü verwendet,
steht die zweite Ebene der Navigation in die-
sem Menü. Auf YMouse-down eines Menü-
punktes wird eine weitere Navigationsebene
in den Navigationsbereich geladen. Der aus
dem Drop-down-Menü gewählte Menüpunkt
steht – grafisch hervorgehoben – am Kopf
der Liste im Navigationsbereich. Darunter
folgt die weitere Ebene der Navigation.
Existiert im Identitätsbereich kein Drop-
down-Menü, kann die zweite Ebene der Navi-
gation bei Mouse-down als Liste in den Navi-
gationsbereich geladen werden. Die weite-
ren Ebenen können – wie bei einer Ordner-
struktur – unterhalb des gewählten Naviga-
tionspunktes „ausklappen“.
Findet die Navigation ausschließlich im Navi-
gationsbereich statt, so werden die Menü-
punkte als Liste dargestellt. Bei Mouse-down
können – wie bei einer Ordnerstruktur –
unterhalb des gewählten Navigationspunkts
die weiteren Ebenen der Navigation „aus-
klappen“.
Bei einer Positionierung der Navigationsebe-
nen im Identitäts- und dem Navigationsbe-
reich muss ein deutlicher, visueller Zusammen-
hang geschaffen werden.
Es wird empfohlen, zwischen Y Active,
YHover-/Focus-,Y Visited und YUnvisited
Links zu differenzieren.
Die beiden Größen des Navigationsbereichs
Die Schriftarten und -größen im Identitäts-
und Navigationsbereich
Servicebereich
Der Servicebereich dient der Aufnahme ständig sichtbarer Service-
funktionen der gesamten Internetpräsenz. Seine Gestaltung ist dem Iden-
titäts- und Navigationsbereich untergeordnet. Für den Servicebereich sind
zwei alternative Positionierungen möglich:
- Innerhalb des Identitätsbereichs:
Der Servicebereich kann oberhalb des Identitätsbereiches positioniert
werden. In diesem Fall nimmt er in der Vertikalen einen Raum von mini-
mal (bei Grundeinstellung der Schriftgröße) 20 px (= 1,25 em) ein.
Empfehlung: Um die durch Weißraum gebildete visuelle Klammer der
Internetpräsenzen zu verstärken, steht ein im Identitätsbereich positio-
nierter Servicebereich auf einem weißen Hintergrund.
22 S e i t e na u f b a u
Sprachregelungen
Einheitliche Sprachregelungen und Benen-
nungen erleichtern den Besuchern das
schnelle Finden von Service-Inhalten, zum
Beispiel Suchfunktionen oder Kontaktmög-
lichkeiten. Aus diesem Grund werden drei
Servicepunkte auch mit ihrer Benennung vor-
gegeben:
- „Home“
Der direkte Link zur Startseite. Er ist parallel
zur Verlinkung über die Bildwortmarke zu
berücksichtigen.
- „Kontakt“
Die Möglichkeit, über einen Link E-Mails an
die Betreiber der Website zu versenden,
Korrespondenz- oder Ortsangaben zu er-
halten.
- „Suche“
Der Aufruf der Suchfunktion innerhalb der
Internetpräsenz. Es ist möglich, einen
Suchbegriff direkt in ein Feld einzugeben
oder alternativ die Suchfunktion über ei-
nen Link einzuleiten.
Empfehlung: Neben den verbindlichen Be-
nennungen innerhalb des Servicebereiches
werden folgende Begriffe eingesetzt:
- „Sitemap“
Als Bezeichnung für die verlinkte Struktur-
übersicht der Internetpräsenz.
- „Hilfe“
Die Benennung der Bedienungshilfe inner-
halb der Website.
Die Position und Größe des Servicebereichs im Identitätsbereich
- Unterhalb des Navigationsbereichs:
Der Servicebereich kann unterhalb des Navigationsbereiches positioniert
werden. Zur besseren Differenzierung ist zwischen den Bereichen ein
Abstand zu halten: Der Servicebereich beginnt mindestens 2 RE (= 40 px
= 2,5 em) unterhalb des letzten Menüpunktes der Navigation.
Aufgrund seiner Funktion sollte der Servicebereich so platziert
werden, dass er ohne vertikales oder horizontales Scrollen im sichtbaren Be-
reich des Browsers liegt. Eine inhaltliche Festlegung oder Begrenzung kann
ein eventuelles Wegscrollen verhindern.
Im Übrigen sind hierzu die Informationen zu „Barrierefreiheit und
Frames“ im Kapitel „Zusatzinformationen“ zu beachten.
- „E-Mail“
Bezeichnung für eine formlose E-Mail-Funk-
tion oder ein E-Mail-Formular direkt an den
Website-Betreiber.
- „Textversion“
Ein Link, der die Nur-Text-Version der Inter-
netpräsenz aufruft. (Falls trotz aller Bemü-
hungen keine barrierefreie Umsetzung
möglich ist, muss zumindest eine barriere-
freie Textversion angeboten werden).
- „Kontakt“
Bezeichnung für ein E-Mail-Formular, das
Antworten oder Reaktionen auf eine spezi-
fische Frage an den Betreiber der Website
übermittelt.
- „Download“
Die Bezeichnung für den Download-Be-
reich, aus dem Dateien auf den Computer
des Anwenders geladen werden können.
- „Newsletter“
Benennung für ein An- bzw. Abmeldefor-
mular für den Bezug eines Newsletters des
Betreibers der Internetpräsenz.
- „Linkliste oder Links“
Als Bezeichnung für eine Liste verlinkter,
weiterer Websites.
- „Glossar“
Die Benennung für ein alphabetisch geord-
netes, erläuterndes Stichwortverzeichnis.
Position und Breiten des Servicebereichs im Navigationsbereich
24 S e i t e na u f b a u
- „English |Français| Español“
Bezeichnungen für die Auswahl fremd-
sprachlicher Versionen der Internetprä-
senz. Die Darstellung von Flaggen für die
Sprachauswahl ist unzulässig, da unkorrek-
te Aussagen möglich sind: So wird Englisch
auch außerhalb Großbritanniens und Spa-
nisch auch außerhalb Spaniens gespro-
chen.
- „Impressum“
Die Bezeichnung für die Nennung der pres-
serechtlich Verantwortlichen der Internet-
präsenz, der Gestalter und Umsetzer der
Website sowie eventuelle rechtliche Hin-
weise.
Zur besseren Übersicht sollten innerhalb des
Servicebereichs nicht mehr als acht Begriffe
verwendet werden. Im Übrigen sind hierzu
die Informationen zu „Barrierefreiheit und
Sprache“ im Kapitel „Zusatzinformationen“
zu beachten.Beispiel für einen Servicebereich im Navigationsbereich auf der Website Medienmonitoring (eine
Intranetanwendung in Entwicklung des Presse- und Informationsamtes der Bundesregierung)
Beispiel für einen Servicebereich im Identitätsbereich auf einer Website des Bundesministeriums für
Verkehr, Bau- und Wohnungswesen
Buttons, Piktogramme
Im Servicebereich können entweder Textlinks
oder Text in Form von YGrafikelementen als
Buttons verwendet werden. Diese sind
gegenüber den Elementen der Navigation im
Identitäts- und Navigationsbereich zurück-
haltender gestaltet.
Wird der Servicebereich im Navigationsbe-
reich unterhalb der Menüpunkte angeord-
net, so richtet sich seine Größe und Ausrich-
tung nach der dort gewählten Spaltenbreite.
Im Übrigen sind hierzu die Informationen zu
„Barrierefreiheit und Sprache“ im Kapitel
„Zusatzinformationen“ zu beachten.
Schriften
Die Navigation wird in der Systemschrift Ver-
dana regular gesetzt, die Schriftgröße be-
trägt 0,7 em. Die Reihenfolge der Alternativ-
schriften ist Verdana, Helvetica, Arial, Taho-
ma, Sans Serif. Text-Links bzw. Text-Buttons
werden als Liste gesetzt oder durch druckba-
re Schriftzeichen (zum Beispiel | oder o) von-
einander getrennt, die von Leerzeichen um-
geben sind.
Interaktives Verhalten
Es wird empfohlen, zwischen Y Active,
YHover-/Focus-, Y Visited und YUnvisited
Links zu differenzieren.
Beispiel für die Benennung der Servicepunkte auf der Website des Bundesministeriums für Wirtschaft
und Arbeit (Ausschnitt)
Die Schriftarten und -größen im Servicebereich
Contentbereich
Der Contentbereich beinhaltet die redaktionellen Inhalte der
Internetpräsenz. Diese können, der Komplexität einer Regierung entspre-
chend, sehr unterschiedlich sein: Text- und Bildinformationen, Listen, Links,
Banner, Datenbankanbindungen und Download-Bereiche etc.
Die Gestaltung des Contentbereichs transportiert die visuelle Kultur
der Bundesregierung in besonderem Maße, da hier die wechselnden Bilder
und Texte die Aufmerksamkeit besonders in Anspruch nehmen.
Die Aufteilung der Gestaltungsfläche in einen Identitäts-, einen
Navigations- und einen Contentbereich wird durch eine Farbkodierung dar-
gestellt. Die Verknüpfung des Identitäts- und des Navigationsbereichs wird
durch gleiche Farbklimata und gedeckte, abgetönte Farbflächen visualisiert.
Der Contentbereich wird von den Farbflächen gehalten und hebt sich durch
helle oder weiße Hintergrundfarben ab. Der Akzentuierung dienen klare, rei-
ne und helle Farben aus einem der definierten Farbklimata.
Für gestalterisch hier nicht definierte Funktionen und Anwendun-
gen wird empfohlen, sich an den vorliegenden, allgemeinen Richtlinien zu
orientieren.
Der Contentbereich beginnt mit seiner linken Seite direkt am Navi-
gationsbereich. Oben schließt der Contentbereich an der Unterkante des
Identitätsbereiches an.
Die Breite des Contentbereichs nimmt den gesamten restlichen
Raum ein. Auf der rechten Seite bleibt ein Streifen von 12 px als Abstand zum
inneren Browserrand geschützt.
26 S e i t e na u f b a u
Spaltenraster
Empfehlung: Texte, Tabellen und Formulare
können im Sinne eines Satzspiegels in Spal-
ten angeordnet werden. Die folgenden Emp-
fehlungen dienen der Orientierung und kön-
nen flexibel angewandt werden.
Zur Auswahl stehen folgende Spaltenraster,
jeweils mit schmalem oder breitem Naviga-
tionsbereich:
- Einspaltiger Raster mit Marginalspalte
- Zweispaltiger Raster mit Marginalspalte
- Zweispaltiger Raster ohne Marginalspalte.
Für Überschriften, größere Abbildungen etc.
können mehrere Spalten zusammengefasst
werden. Ebenso ist es möglich, die vordefi-
nierten Spalten für Tabellen etc. weitere
Male zu unterteilen.
Die Marginalspalte enthält Text- und Bild-
informationen, die einen nebenstehenden
Inhalt ergänzen. Dies kann eine Auflistung
weiterführender Links, die direkte Verbin-
dung zu Sonderseiten und -themen oder
auch die Abbildung von Bannern der Bundes-
regierung sein.
Genaue Maßangaben für die Spaltenraster
finden sich im Kapitel „Seitenvermaßungen“.
Im Übrigen sind hierzu die Informationen zu
„Barrierefreiheit und Spalten“ im Kapitel „Zu-
satzinformationen“ zu beachten.
Die beiden Breiten des Contentbereichs
Die drei empfohlenen Spaltenraster des Contentbereichs, jeweils mit schmalem und breitem
Navigationsbereich
28 S e i t e na u f b a u
Buttons, Piktogramme
Im Contentbereich können sowohl Textlinks
als auch Text in Form von YGrafikelementen
als Buttons verwendet werden. Werden im
Contentbereich Piktogramme eingesetzt,
müssen diese mit der Gesamterscheinung
korrespondieren. Der Piktogrammstil muss
dem Erscheinungsbild der Internetpräsenz
bzw. der Bundesregierung entsprechen und
sich an den Vorgaben für die Formensprache
orientieren (vgl. Kapitel „Bild- und Formen-
sprache“).
Kommen Programm-Icons, zum Beispiel im
Download-Bereich, zum Einsatz, werden sie
der verfügbaren Datei vorangestellt.
Innerhalb des Contentbereiches gibt es
unterschiedliche Möglichkeiten, Links anzu-
legen:
- Funktionen, zum Beispiel für den Druck,
Bestellungen oder Download von Dateien.
- Text-Links als Inhaltsverzeichnis, die direkt
zu den entsprechenden Positionen im glei-
chen Contentbereich führen.
- Sprungmarken, die zur inhaltlichen Gliede-
rung innerhalb des Contentbereiches, zum
Beispiel als Rücksprung zum Seitenanfang,
verwendet werden.
- Textlinks, die zu anderen Seiten innerhalb
der eigenen Internetpräsenz führen, zum
Beispiel zur Fortsetzung eines Textanrisses.
- Links zu externen Internetadressen.
Links, welche die eigene Internetpräsenz ver-
lassen, sollen immer in einem weiteren, sepa-
raten Browserfenster geöffnet werden.
Empfehlung: Die Wortwahl der Links kann je-
der Betreiber frei wählen. Es werden im Sinne
der Einheitlichkeit folgende Vorschläge ge-
macht:
- Die Benennung sollte eindeutig und kurz
sein.
- Die Bezeichnungen sollen dem allgemei-
nen deutschen Sprachgebrauch entspre-
chen. Abkürzungen sowie so genanntes
„Amts- bzw. Behördendeutsch“ sind zu ver-
meiden.
- Behördeninterne Dateinamen dürfen nicht
verwendet werden. Anwendungsbeispiele des Corporate Designs im Contentbereich: Text- und Tabellendarstellung
Funktionen werden in einer einfachen Form
benannt:
- „Drucken“ anstelle von „Print-Version“ und
Ähnlichem (Die Anzeige einer Druckversion
auf dem Bildschirm ist bei Einsatz eines ent-
sprechenden CSS nicht notwendig)
- „Bestellen“ anstelle von „Broschüre bestel-
len“ etc.
- „Download“ oder „PDF-Download“ anstelle
von „Herunterladen“ und Ähnlichem.
Sprungmarken, die zur inhaltlichen Gliede-
rung verwendet werden, tragen folgende
Bezeichnungen:
- „Zum Seitenanfang“
- „Nach oben“
- „Artikelanfang“.
Verweise, die der Fortsetzung von Textanris-
sen dienen, tragen Bezeichnungen, aus de-
nen eindeutig der Inhalt der Zielseite hervor-
geht. Die gleich lautende mehrfache Ver-
wendung von „mehr“ oder „weiter“ auf einer
Seite ist zu vermeiden.
Im Übrigen sind hierzu die Informationen zu
„Barrierefreiheit und Bilder“ im Kapitel „Zu-
satzinformationen“ zu beachten.
Anwendungsbeispiele des Corporate Designs im Contentbereich: Formular, Sitemap
30 S e i t e na u f b a u
Schriften
Im Contentbereich kann sowohl die Neue
Demos und Neue Praxis als auch die System-
schrift Verdana verwendet werden.
Empfehlung: Wenn Überschriften, Themen-
titel oder Ähnliches als Grafiken gesetzt wer-
den, ist darauf zu achten, dass die Zugäng-
lichkeit des Textes und die semantische Aus-
zeichnung mit entsprechenden HTML-Tags
(h1, h2, caption, legend, u. Ä.) gewährleistet
ist. Dies ist zur Gewährleistung der Barriere-
freiheit wie zur Optimierung einer Seite für
Suchmaschinen unerlässlich.
Überschriften werden in der Verdana bold in
90 % oder 100 % Größe als Systemschrift an-
gegeben oder als Neue Demos mit 18 px oder
20 px Größe und einer Spationierung von
0,04 YGeviert mit Schriftenglättung als Bild
eingesetzt.
Untertitel und Tabellenüberschriften, sowie
Zusammenfassungen eines Artikels werden
in Verdana bold in 70 % Größe angegeben.
Mengentexte werden in Verdana regular in
70 % Größe als Systemschrift gesetzt. Hervor-
hebungen im Mengentext stehen in der glei-
chen Größe, aber in Verdana bold.
Thementitel können in Verdana bold in 70 %
Größe oder in der Neuen Demos SC OsF in
13 px Größe und einer Spationierung von
0,04 YGeviert mit Schriftenglättung als Bild
eingesetzt werden.
Bildunterschriften werden in der Verdana
regular in 65 % Größe als Systemschrift an-
gegeben.
Wird ein Copyright am Textende verwendet,
wird es in Verdana regular in 70 % Größe als
Systemschrift angegeben.
Die Reihenfolge der Alternativschriften ist Ver-
dana, Helvetica, Arial, Tahoma, Sans Serif.
Empfehlung: Als Schriftfarbe wird die Farbe
mit der Hexadezimalzahl #333333 anstelle
von hundertprozentigem Schwarz empfoh-
len.
Im Übrigen sind die Umrechnungstabelle
Schriftgrößen und die Informationen zum
Thema „Barrierefreiheit und Schriften“ im Ka-
pitel „Zusatzinformationen“ zu beachten.
Die Schriftarten, -schnitte und -größen im Contentbereich
Überschrift
Überschrift
Thementitel
Interaktives Verhalten
Links innerhalb von Texten werden durch
Unterstreichungen und/oder farbliche Kenn-
zeichnung hervorgehoben.
Wird die Systemschrift Verdana gewählt,
empfiehlt es sich, zwischen YActive,Y Hover-/
Focus-,Y Visited und YUnvisited Links zu diffe-
renzieren.
Anwendungsbeispiel des Corporate Designs: Suche mit Suchergebnis auf einer Website des Presse-
und Informationsamtes der Bundesregierung
32 S e i t e na u f b a u
Abbildungen
Bilder innerhalb des Contentbereichs werden
in ihren Formaten und Größen anhand des
Ausrichtungsrasters von 4 px x 4 px linksbün-
dig in den Spalten platziert. Empfehlung:
Werden Bilder von einem Text umflossen,
wird zwischen dem Text und dem Bild ein
Mindestabstand von 16 px eingehalten. Bei-
spiele für den Umgang mit Abbildungen fin-
den sich im Kapitel „Anwendungsbeispiele“.
Im Übrigen sind die Informationen zu „Barrie-
refreiheit und Bilder“ im Kapitel „Zusatzinfor-
mationen“ zu beachten.
Beispiel für die Positionierung von Abbildungen im Contentbereich
Empfohlener Mindestabstand von 16 px zwischen Bild und Text
Seitenvermaßungen
Die Vermaßung definiert die Größen der einzelnen Flächen und ih-
rer Position auf der Gestaltungsfläche. Sie beginnt immer an der linken obe-
ren Flächenbegrenzung.
Seitenvermaßung für einen Contentbereich mit einem einspaltigen Raster, einer Marginalspalte
und schmalem Navigationsbereich
Seitenvermaßung für einen Contentbereich mit einem zweispaltigen Raster, einer Marginalspalte
und schmalem Navigationsbereich
34 S e i t e na u f b a u
Seitenvermaßung für einen Contentbereich mit einem zweispaltigen Raster und schmalem Naviga-
tionsbereich
Seitenvermaßung für einen Contentbereich mit einem einspaltigen Raster, einer Marginalspalte und
breitem Navigationsbereich
Seitenvermaßung für einen Contentbereich mit einem zweispaltigen Raster, einer Marginalspalte
und breitem Navigationsbereich
Seitenvermaßung für einen Contentbereich mit einem zweispaltigen Raster und breitem Naviga-
tionsbereich
Die folgenden Anwendungsbeispiele von aktuellen Internet-Auf-
tritten der Ministerien veranschaulichen die Corporate-Design-Richtlinien der
Bundesregierung und visualisieren den gestalterischen Spielraum innerhalb
der Vorgaben und Empfehlungen.
Homepages und Folgeseiten
In den Anwendungsbeispielen für Homepages und Folgeseiten
kommen unterschiedliche Farben, Formen und grafische Auszeichnungs-
elemente zum Einsatz.
Anwendungsbeispiele
38 A nw e n d u n g s b e i s p i e l e
Anwendungsbeispiele für Homepage und Folgeseiten auf der Website der Bundesregierung
Anwendungsbeispiele für Homepage und Folgeseiten auf der Website des Bundesministeriums für
Wirtschaft und Arbeit
Formular
Tabelle
40 A nw e n d u n g s b e i s p i e l e
Anwendungsbeispiel für die Gestaltung von Formularen auf der Website des Bundesministeriums für
Verkehr, Bau- und Wohnungswesen
Anwendungsbeispiel für die Gestaltung von Tabellen auf der Website der Bundesregierung
Suche
Sitemap
Anwendungsbeispiel für die Gestaltung einer Sitemap auf der Website des Bundesumweltministeriums.
Zu beachten ist, dass das Logo gemäß Styleguide-Vorgaben auf weißem Grund stehen müsste.
Anwendungsbeispiel für die Gestaltung von Suchmasken und Suchergebnislisten auf einer Website
des Presse- und Informationsamtes der Bundesregierung
Nachfolgend werden Basisinformationen zu den technischen
Standards des World Wide Web, zur Sicherheit und zur Auffindbarkeit von
Web-Inhalten gegeben. Außerdem werden die Richtlinien für die Erstellung
barrierefrei zugänglicher Online-Medien erläutert.
Technische Standards
Im Rahmen der Initiative BundOnline 2005 werden technische
Standards im Internet – vom Bundesministeriums des Innern initiiert –
diskutiert und im SAGA-Dokument (Standards und Architekturen für
E-Government-Anwendungen) vorgestellt. Diese Diskussion und das fort-
laufend aktualisierte SAGA-Dokument sind unter http://wwwbund.de
veröffentlicht. Empfehlungen für Standards, Methoden und Produkte gelten
gleichlautend in der jeweils aktuellen Fassung für die Internetpräsenzen der
Bundesregierung.
Sicherheit von Internetpräsenzen
Das Thema IT-Sicherheit wird im Rahmen der Initiative Bund-
Online 2005 im E-Government-Handbuch im Modul „IT und IT-Sicherheit“
für E-Government-Anwendungen beschrieben und steht in der Online-
Version des E-Government-Handbuchs
(http://www.bsi.bund.de/fachthem/egov/HYPERLINK) als PDF-Datei zur Verfü-
gung. Die dort niedergelegten Sicherheitskonzepte sind in der jeweils ak-
tuellen Fassung für Internetpräsenzen der Bundesregierung anzuwenden.
Auffindbarkeit von Web-Inhalten
Um die Auffindbarkeit der eingestellten Informationen der Inter-
netpräsenzen der Bundesregierung möglichst erfolgreich zu planen und
umzusetzen, müssen sowohl technische als auch redaktionelle Dinge beach-
tet werden. Hinweise zu diesem Thema werden im Rahmen der Initiative
BundOnline 2005 im E-Government-Handbuch im Abschnitt „Auffindbar-
keit von Web-Inhalten“ beschrieben und stehen in der Online-Version des
E-Government-Handbuchs (http://www.bsi.bund.de/fachthem/egov/) als PDF-
Datei zur Verfügung. Sie sind in der jeweils aktuellen Fassung für Internet-
präsenzen der Bundesregierung zu berücksichtigen.
Zusatzinformationen
44 Z u s a t z i n f o r m a t i o n e n
Barrierefreier Zugang
Barrierefreier Zugang zum Internet bedeutet, dass Internet-
anwendungen 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.
Dies ist durch die konsequente Entwicklung gemäß den allgemeinen Spe-
zifikationen und Empfehlungen des W3-Konsortiums /W3C) und den 14
Richtlinien der Arbeitsgruppe WAI (Web Accessibility Initiative, Initiative
für barrierefrei zugängliches Internet) möglich.Gemäß BITV (Barrierefreie
Informationstechnik-Verordnung) müssen bis 31. 12. 2005 alle öffentlich zu-
gänglichen Internetauftritte und -angebote sowie Intranetauftritte und
-angebote der Behörden der Bundesverwaltung barrierefrei umgesetzt werden.
Barrierefreiheit und Endnutzer
Computer und elektronische Netzwerke geben vielen Menschen,
gesunden ebenso wie körperlich und geistig Behinderten, neue Chancen
und Möglichkeiten, zum Beispiel eine wachsende intellektuelle und wirt-
schaftliche Unabhängigkeit.
Einige Anwender benötigen technische Hilfsmittel, die Standards
der gängigen Internet-Interpretatoren überbrücken, damit sie angebotene
Informationen abrufen können. Die Auswahl spezifischer Hilfsmittel für
unterschiedliche Behinderungen ist groß, zum Beispiel Screenreader für
Menschen mit Sehschwäche oder Zusatzsoftware für die Stimmsteuerung
von Computern. Organisationen arbeiten weltweit an der Aufgabe, die Ent-
wicklung dieser Hilfsmittel auf die Codierungsmethoden des W3C zu opti-
mieren.
Gleichzeitig ist Koordinierungsarbeit bei den so genannten Stan-
dardtechnologien zu leisten. Einige Nutzergruppen, zum Beispiel Menschen
in ländlichen Gegenden oder mit eingeschränkten wirtschaftlichen Mög-
lichkeiten, dürfen von der Aufnahme und dem Austausch von Informatio-
nen nicht ausgeschlossen werden. Daher sind spezielle Angebote, die ihnen
einen großen Vorteil bringen (zum Beispiel das E-Government), so zu ent-
wickeln, dass sie auch bei einem Einsatz älterer Hard- und Software oder bei
langsameren Übertragungsraten nutzbar sind.
Neue Internettechnologien sind für eine große Anzahl potenziel-
ler, aber auf Hilfsmittel angewiesener Nutzer nur eingeschränkt oder nicht
zugänglich. Die Ursache kann sein, dass die Hilfsmittel die neu eingesetzten
Technologien nicht interpretieren können oder dass bei der Entwicklung der
Websites nicht an einen barrierefreien Zugang gedacht wurde.
Die folgenden Richtlinien wenden sich an professionelle Entwick-
ler und Programmierer von Websites. Durch die Einhaltung dieser Tipps und
Techniken kann ein wichtiger und letztlich notwendiger Beitrag geleistet
werden, um größere Teile des World Wide Web barrierefrei zugänglich zu
machen.
Barrieren und Hilfsmittel
Circa 20 % der Internetnutzer (nicht eingerechnet sind Nutzer, die
auf sehr langsame Übertragungsraten oder ältere Hard- und Software ange-
wiesen sind) weichen vom so genannten Standardnutzer ab. Sie leben mit
körperlichen Einschränkungen, die es ihnen nur mit Hilfe von Zusatzsoft-
oder Hardware erlauben, Inhalte aus dem Internet zu erschließen. Auch
geistige Einschränkungen sind möglich, aufgrund derer Nutzer auf klare
und einfache Strukturen sowie Inhalte angewiesen sind.
Sehbehinderte oder Blinde greifen auf Hilfsmittel zurück, die ihnen
die Texte von Websites entweder durch einen so genannten Screenreader in
synthetischer Sprache oder als Braille-Zeile an ein Zusatzgerät mit Spezialtas-
tatur wiedergeben. Auch so genannte Audio-Browser können die Texte von
Internetseiten als Toninformationen ausgeben. Jegliche Bildinformation in-
klusive Video und Animationen bleiben diesen Nutzern verschlossen.
Für Fehlsichtige ist eine Vergrößerungs-Software hilfreich, die Teile
des Bildschirmes stark vergrößert darstellt. Problematisch dabei ist das Bewah-
ren eines „Überblicks”, da nur ein Ausschnitt der gesamten Seite sichtbar ist.
Es ist möglich, die Darstellung durch Änderung der System- bzw.
Browsereinstellungen an individuelle Bedürfnisse anzupassen. Schriften
können vergrößert, der Kontrast erhöht oder die Schriftfarben verändert
werden. Dieser Eingriff ist jedoch nur möglich, wenn im Quellcode der jewei-
ligen Website die Farben und Größen nicht als absolute Einheiten angege-
ben werden.
Motorische Störungen sind eine weitere Ursache für den Einsatz
von Hilfsmitteln bei der Nutzung des Internets. So müssen alternative Einga-
bemedien wie Tastatur, Mund- und Kopfstab oder Sprachsteuerung die Ein-
gabe durch die Maus ersetzen können.
Menschen, die schlecht oder gar nicht hören können, nicht oder
nur undeutlich sprechen, müssen bisher relativ wenig Hürden im Internet
überbrücken. Mit der Weiterentwicklung der Technologien wird das Inter-
net jedoch stärker als bisher akustische Ein- und Ausgabemöglichkeiten inte-
grieren. Für diese Interaktionsformen und Informationsmedien müssen bar-
rierefreie Zugänge entwickelt und berücksichtigt werden.
Personen mit eingeschränktem Konzentrationsvermögen oder
kognitiven Störungen bedürfen einer logisch aufgebauten und klar struktu-
rierten Navigation (die auch allen anderen Nutzern einer Site zugute
kommt).
Das Gleichstellungsgesetz
Mit der E-Government-Initiative BundOnline 2005 hat sich die
Bundesregierung verpflichtet, alle internetfähigen Dienstleistungen der
Bundesverwaltung bis zum Jahr 2005 online bereitzustellen. BundOnline
2005 wird dafür sorgen, dass Bürger und Wirtschaft die Dienstleistungen
der Bundesverwaltung einfacher, schneller und kostengünstiger in An-
spruch nehmen können (http://www.bundonline2005.de).
Für öffentlich zugängliche Angebote von Behörden der Bundesver-
waltung gilt die BITV (http://www.bmi.bund.de/dokumente/Artikel/ix_90156.htm).
46 Z u s a t z i n f o r m a t i o n e n
Die Anzahl der Bürger, die diese Dienste online in Anspruch nehmen
können, wächst stetig. Jeder Bürger hat das Recht, Zugang zu Diensten und
Informationen der Bundesregierung zu erhalten. Mit dem Erlass des Gleich-
stellungsgesetzes vom 1. Mai 2002 (http://www.behindertenbeauftragter.de/) ist
es Pflicht der Bundesregierung und ihrer Ressorts, diesen Zugang zu ermög-
lichen.
Die Umsetzung dieser Online-Dienste gemäß den vorliegenden
Richtlinien stellt sicher, dass die Dienstleistungen der Bundesverwaltung ei-
nem größtmöglichem Personenkreis zur Verfügung stehen. Zugleich wird
die Entwicklung klar strukturierter, leicht verständlicher und kostengünsti-
ger Websites unterstützt.
Richtlinien zur Barrierefreiheit
Die folgende Zusammenfassung der Richtlinien beruht auf den
WAI-Richtlinien des W3C
http://www.w3.org/TR/1999/WAI-WEBCONTENT-19990505/ sowie auf den An-
forderungen der BITV (Abkürzung für Barrierefreie Informationstechnik-
Verordnung, http://www.bmi.bund.de/dokumente/Artikel/ix_90156.htm). Die
BITV beschreibt die Anforderungen in Bezug auf Barrierefreiheit für alle öf-
fentlich zugänglichen Internetauftritte und -angebote sowie Intranetauftritte
und -angebote der Behörden der Bundesverwaltung. Diese Anforderungen
müssen bis spätestens 31.12.2005 umgesetzt sein.
Die aktuelle Version der BITV entspricht in Priorität 1 im Wesent-
lichen den Vorgaben von WAI AA, in Priorität 2 im Wesentlichen der
WAI AAA.
Die jeweils in Klammern angegebene Nummer verweist auf die
entsprechende WAI-Richtlinie bzw. BITV-Anforderung.
Der Einsatz von HTML 4.0 und CSS 2 wird vom W3C (World Wide
Web Consortium, http://www.w3.org) als Grundlage für die Umsetzung all-
gemein zugänglicher Websites gesetzt. Informationen zum fachgerechten
Einsatz der neuesten Elemente von HTML 4.0 und CSS 2 sind in den entspre-
chenden technischen Standards und Spezifikationen des W3-Konsortiums
zu finden: http://www.w3.org/TR/.
Die Erstellung von Internetdokumenten, die den dort veröffent-
lichten Standards entsprechen, ist eine zu befolgende Richtlinie (WAI 3.2,
BITV 3.2).
Der Schlüssel zu einer allgemein zugänglichen Internetanwendung
liegt in der klaren Trennung von Inhalt und Layout: In der HTML-Codierung
dürfen zu Layoutzwecken keine Strukturelemente und keinerlei Layoutele-
mente zur strukturellen Auszeichnung verwendet werden (BITV 3.5).
Dies erfordert den syntaktischen und formal korrekten Einsatz von
HTML gemäß den W3C-Spezifikationen für den Grundaufbau und die Struk-
tur einer Website sowie die Verwendung von Stylesheets für alle Layout- und
Präsentationsbelange.
Der Aufbau von Seiten ist so zu gestalten, dass sie auch ohne
Stylesheets lesbar sind. Ist der Inhalt logisch aufgebaut, wird er auch dann in
einer sinnvollen Reihenfolge dargestellt, wenn die Stylesheets abgeschaltet
sind oder nicht unterstützt werden (WAI 6.1, BITV 6.1 ).
Für eine barrierefreie Gestaltung ist die Bereitstellung so genann-
ter Textäquivalente für alle akustischen und visuellen Inhalte wichtig. Das
bedeutet, dass für visuelle und/oder akustische Informationen, die für blinde
oder taube Menschen unzugänglich sind, entsprechende Textbeschreibun-
gen bereitgestellt werden (BITV 1.1 –1.44).
Ebenso wird mit aktiven Inhalten wie Applets und Scripts verfahren.
Die Inhalte müssen auch zugänglich sein, wenn diese Technologien nicht
unterstützt werden oder ausgeschaltet sind (WAI 6.3, BITV 6.3). Dies bedeu-
tet, dass sie mit entsprechenden Textalternativen hinterlegt oder nach barrie-
refrei zugänglichen Standards programmiert werden (WAI 8.1, BITV 8.1).
Die Navigation muss geräteunabhängig bedienbar sein, zum Bei-
spiel ohne den Gebrauch einer Maus. Eingabefunktionen, die allein über die
Tastatur erreichbar sind, können im Allgemeinen über alternative Eingabe-
medien wie Spracheingabe oder eine Kommandozeilen-Schnittstelle be-
dient werden.
Es wird empfohlen, die neuesten Versionen von W3C-Technologien
zu verwenden (WAI 11.1 BITV 11.1), veraltete Funktionen hingegen (zum Beispiel
das veraltete <FONT>-Element, WAI 11.2, BITV 11.2) sind zu vermeiden.
Sollten diese Anforderungen nicht umsetzbar sein, wird das paral-
lele Angebot einer mit W3C-Technologien erstellten, barrierefrei zugäng-
lichen „Nur-Text-Version”, mit äquivalenten Inhalten angeraten (WAI 11.4,
BITV 11.3). Dabei ist sicherzustellen, dass diese immer dem Aktualitätsgrad
der Hauptseite entspricht (WAI 6.2, BITV 6.2).
Barrierefreiheit und Seitenaufbau/Layout
Ein durchgängiges Layout erleichtert die Orientierung für alle Nut-
zer und erhöht die Wiedererkennung einer Internetpräsenz. Einer guten
und verständlichen Benutzerführung liegt die konsistente Verwendung von
Funktionsbereichen und Navigationslisten zugrunde.
Barrierefreiheit und Buttons in Forms
Buttons in Formularen können per CSS gestaltet werden. Die Be-
schriftungen sollten selbsterklärend die interaktive Funktion des Buttons be-
schreiben. Wird, etwa aus gestalterischen Gründen, ein von Screenreadern
nicht sinnvoll erfassbares Symbol (z. B. „>>“) oder ein fremdsprachiger Be-
griff (z.B. „Go“ oder „OK“) verwendet, muss ein aussagekräftiges <title>-At-
tribut eingesetzt werden.
Barrierefreiheit und Tabellen
Layouttabellen: Vom Einsatz von Tabellen für den Grundaufbau
eines Seitenlayouts wird abgeraten (WAI 5.3, BITV 5.3). Hilfsmittel wie
Screenreader interpretieren die Seiten in Zeilen linear von links nach rechts.
Sie geben im Falle einer Layouttabelle deren Inhalte nur dann sinnvoll wie-
der, wenn die Seite diesem linearen Aufbau entsprechend strukturiert ist.
Wird dennoch eine Tabelle zu Layoutzwecken verwendet, darf
kein weiteres strukturelles HTML-Markup zur Textauszeichnung verwendet
werden; hierfür sind Stylesheets einzusetzen (WAI 5.4, BITV 5.4).
Allgemein sollte das Layout der Seite allein durch den Einsatz von
Stylesheets formatiert werden. Das HTML-Dokument muss gelesen werden
können, wenn alle zugeordneten Stylesheets abgeschaltet wurden.
48 Z u s a t z i n f o r m a t i o n e n
Checkliste Seitenaufbau/Layout:
- Einheitliches Layout für die gesamte
Internetpräsenz
- Konsistente Verwendung der Naviga-
tionsmechanismen
Checkliste Layouttabellen:
- Seitenlayout mit Stylesheets, nicht mit
Tabellen formatieren
- Tabellen für Layoutzwecke nur dann ein-
setzen, wenn eine lineare Bearbeitung
der Seite ihrem Sinn entspricht
- Wenn Tabellen zu Layoutzwecken ver-
wendet werden, kein zusätzliches struk-
turelles HTML-Markup für Textauszeich-
nungen einsetzen
Datentabellen: Da Hilfsmittel wie Screenreader die vorliegenden
Informationen linear in Zeilen bearbeiten, führt eine Datentabelle schnell
zur Verwirrung, wenn sie nicht mit den korrekten TABLE-Attributen ausge-
zeichnet – und damit als Tabelle erkennbar – gemacht wurde.
Um eine Tabelle auch für Menschen mit Hilfsmitteln lesbar und
verständlich darzustellen, sind die Zeilen- und Spaltenüberschriften klar zu
kennzeichnen. Dazu müssen die HTML-TABLE-Elemente TR, TD, TH und CAP-
TION verwendet werden (WAI 5.1, BITV 5.1).
Bei einer Tabelle mit zwei oder mehr logischen Ebenen von Zeilen-
und Spaltenüberschriften müssen die Daten- und Überschriftenzellen einan-
der klar zugeordnet werden. Dies geschieht mittels Einsatz von THEAD, TFOOT
und TBODY, um Zeilen zu gruppieren, COL und COLGROUP, um Spalten zu
gruppieren, und mit „axis“-, „scope“- und „headers“-Attributen, um komplexe-
re Zusammenhänge zwischen Daten zu beschreiben (WAI 5.2).
Barrierefreiheit und Spalten
In einem Layout sollte die Erstellung von Textspalten ausschließ-
lich über Stylesheets (CSS 2) erfolgen. Dies ermöglicht dem Nutzer das Aus-
schalten der Textspalten, um einen für ältere Screenreader lesbaren Text-
block zu erhalten.
Die Erstellung von Textspalten mit Hilfe von Frames ist nicht zu
empfehlen, da dies leicht zu Verwirrungen führen kann und der Einsatz von
Frames zusätzliche Probleme birgt (siehe Abschnitt „Barrierefreiheit und
Frames“).
Barrierefreiheit und Listen
Um eine korrekte Interpretation von Listen durch Screenreader zu
ermöglichen, müssen diese mit dem entsprechenden HTML-Markup ausge-
zeichnet werden. HTML-Elemente wie LI, OL, UL und DL markieren Listenele-
mente entsprechend der Listennatur und dürfen auch nur für Listen und
nicht für Texteinzüge im Fließtext etc. verwendet werden (WAI 3.6, BITV 3.6).
Werden Bildelemente als Aufzählungszeichen verwendet, so müs-
sen diese mit einem eindeutigen Namen benannt und ggf. mit <alt>-Text
versehen werden.
Barrierefreiheit und Frames
Blinde Nutzer navigieren mit der Tastatur und ohne Maus auf
Internetseiten. Dabei bleiben Screenreader häufig in einzelnen Frames hän-
gen und erreichen nicht alle Informationen. Deswegen sollte auf den Einsatz
von Frames verzichten werden.
Werden Frames eingesetzt, so muss jeder Frame eindeutig mit der An-
gabe des zugewiesenen Bildschirmbereichs und seiner Funktion (zum Beispiel
oben rechts Logo-Frame, oben Mitte Identitäts-Frame usw.) (WAI 12.2, BITV 12.2)
und über das <title>-Attribut im FRAME-Element mit einem schlüssigen Namen
versehen werden (zum Beispiel Logo, Identität usw.) (WAI 12.1, BITV 12.1).
Die einzelnen Seiten und Frames müssen mit Hilfe der Tastatur
navigierbar sein.
Checkliste Datentabellen:
- Zeilen- und Spaltenüberschriften kenn-
zeichnen
- Bei zwei und mehr logischen Ebenen von
Zeilen- und Spaltenüberschriften sollen
Daten- und Überschriftenzellen klar zu-
geordnet werden
Checkliste: Spalten
- Textspalten nur mittels Stylesheets for-
matieren
- Keine Frames für ein Spaltenlayout ein-
setzen
Checkliste Listen:
- Für Listen das korrekte HTML-Markup ver-
wenden
- Keine HTML-Listenelemente für Textein-
züge verwenden
- Aufzählungszeichen aus Bildelementen
mit entsprechenden Namen und <alt>-
Texten versehen
Checkliste Frames:
- Nach Möglichkeit keine Frames verwen-
den
- Wenn Frames, mit <NOFRAMES>-Version
hinterlegen
- Frames eindeutig mit Ortsbezeichnung
und Funktion benennen
- Jeden Frame mit einem Namen versehen
Checkliste Schriften:
- Schriftart, -größe und -farben mit CSS
formatieren
- Für Schriftarten, -größen und -farben kei-
ne <FONT>-Tags verwenden
- Schriftart und -größe nicht in absoluten
Einheiten angeben
- HTML-Elemente und -Attribute korrekt
einsetzen (zwischen Struktur und Präsen-
tation trennen)
- Schriftarten ohne Serifen verwenden
- Unterschiedliche Schriftarten sparsam
einsetzen
- Schriftgröße entsprechend 11 pt ange-
ben
- Standardabstand zwischen den Buchsta-
ben nicht verringern
- Keine <BLINK>-Tags verwenden
Eine Unterlegung der Frameversion mit einer No-Frame-Version
erleichtert die Lesbarkeit der Website mit Screenreadern und älteren Brow-
sern, die keine Frames unterstützen. Was zwischen <NOFRAMES> und
</NOFRAMES> steht, wird auf Browsern angezeigt, die keine Frames beherr-
schen, und von framefähigen Browsern als Tag erkannt und ignoriert.
Mit der Hinterlegung einer <NOFRAMES>-Version ist auch die An-
forderung gewährleistet, dynamische Inhalte zugänglich zu halten (WAI
6.5, BITV 6.5).
Barrierefreiheit und Schriften
Der Einsatz unterschiedlicher Schriftarten soll sich auf ein Mini-
mum beschränken.
Um sehbehinderten Menschen die Möglichkeit zu geben, die Dar-
stellung der Schriftgröße individuell in ihrem Browser einzustellen, sollen
die Schriftformate nie in absoluten Einheiten (WAI 3.4) und nicht mit dem
<FONT>-Tag in HTML, sondern mit der „font”-Property in CSS angegeben
werden (WAI 3.3, BITV 3.4).
Als Mindestgröße wird eine Schriftgröße empfohlen, die der Größe
von 11 pt entspricht. Der Standardabstand zwischen den Buchstaben darf zu-
gunsten der Lesbarkeit nicht verringert werden.
Die Angabe mehrerer alternativer Fonts im Quelltext (zum Beispiel
Verdana, Helvetica, Arial, Sans Serif) erhöht die Wahrscheinlichkeit, dass ei-
ne der angegebenen Schriften auf dem System des Nutzers verfügbar ist.
Auf den Einsatz eines <BLINK>-Tags ist zu verzichten, da Blink-
effekte nicht mit dem Einsatz von Vergrößerungs-Software kompatibel sind
und allgemein desorientierend wirken können (BITV 7.2).
Strukturelle HTML-Elemente (wie H1, H2 usw.) dürfen nur für Funk-
tionen eingesetzt werden, für die sie vorgesehenen sind (WAI 3.5, BITV 3.5).
Sie dürfen nicht für rein grafische Zwecke eingesetzt werden, da Hilfssoft-
ware die strukturelle Auszeichnung für die richtige Interpretation der Inhalte
benötigt. Das heißt zum Beispiel, wenn ein Wort im Fließtext mit dem Struk-
turelement H3 ausgezeichnet wurde, um es fett hervorzuheben, anstelle der
hierfür vorgesehenen Präsentationsauszeichnung „bold“, wird ein Screen-
reader dieses Wort durch Pause und Betonung missverständlich als Über-
schrift vorlesen.
50 Z u s a t z i n f o r m a t i o n e n
Umrechnungstabelle für Schriftgrößen
Nachfolgende Tabelle zeigt die Umrechnung der Schriftgrößen
zwischen den gängigsten Layoutprogrammen und Browsertypen.
Barrierefreiheit und Farben
Ein bewusster Einsatz von Farben steigert die Klarheit und Lesbar-
keit einer Internetpräsenz. Dem ausreichenden Kontrast zwischen den Text-
und Hintergrundfarben ist eine besondere Aufmerksamkeit zu schenken, so
dass auch Nutzer mit schwarz-weißen Bildschirmen oder Farbenfehlsichtig-
keit die Inhalte ohne Schwierigkeiten erkennen können (WAI 2.2, BITV 2.2/1).
Der Einsatz von Rot und Grün als Kontrastfarben ist zu vermeiden,
da die Rot-Grün-Schwäche eine der am häufigsten verbreiteten Farbenfehl-
sichtigkeiten ist.
Eingesetzte Grafiken müssen verständlich sein, wenn sie ohne Far-
ben betrachtet werden, d. h., Informationen dürfen nicht ausschließlich
über Farbe vermittelt werden. Der Hinweis „Klick den grünen Button!” zum
Beispiel ist nicht sinnvoll (WAI 2.1, (BITV 2.1)).
Farben sollen immer in Zahlen (RGB oder Hexadezimal) und über
Stylesheets angegeben werden, so dass die endgültige Farbwahl dem Nutzer
durch Einstellungen im Browser vorbehalten bleiben.
Barrierefreiheit und Bilder, Fotos und Grafikelemente
Bilder, Grafiken und Symbole – alle reinen Bild-Informationen also –
haben nur für Sehende einen Wert. Von Hilfsmitteln wie Screenreadern
können sie nicht erkannt und vermittelt werden. Auch Nutzer, die die Bild-
darstellung ausgeschaltet haben (zum Beispiel wegen zu langsamer Über-
tragungsrate), erhalten keine Informationen über die als Bild dargestellten
Grafiken und als Bilder angelegten Links.
Bildelemente einer Seite können nur von Sehenden und visuellen
Browsern als solche wahrgenommen werden. Blinde Nutzer beispielsweise,
aber auch Suchmaschinen sind darauf angewiesen, dass die Informationen,
die Bild, Symbol oder Grafik beinhalten, in Textform hinterlegt werden, um
einen Zugang zum Bildinhalt zu erhalten. Dies kann durch den Einsatz eines
aussagekräftigen Textes im <alt>-Attribut des IMG-Elementes für jedes Bild-
element erreicht werden. Gegebenenfalls ist über die Verwendung einer
<longdesc> nachzudenken. (WAI 1.1, BITV 1.1).
So genannte Spacer oder unsichtbare Platzhalter benötigen zwar
keinen <alt>-Text, sollen aber klar als Layoutelement benannt sein.
Falls ein Bildelement einen Link aufruft, sollte der Anlass und das
genaue Ziel des Links im <alt>- oder im <title>-Text bezeichnet werden.
Bilder und Grafiken sollen reduziert und gezielt zum Einsatz kom-
men. Dies kommt allen Nutzern des Internets zugute, zumal die Ladezeiten
verringert werden.
Besteht für eine Grafik, zum Beispiel eine mathematische Glei-
chung (MathML-Element), die Möglichkeit, diese durch HTML-Markup dar-
zustellen, ist diese Methode zu bevorzugen (WAI 3.1, BITV 3.1).
Wenn der Inhalt einer komplexeren Grafik (zum Beispiel einem
Diagramm) nicht in einem kurzen <alt>-Text wiedergegeben werden kann,
gibt es die Möglichkeit, die Grafik mit einem Link zu einer Unterseite mit ei-
ner ausführlichen Beschreibung zu versehen.
52 Z u s a t z i n f o r m a t i o n e n
Checkliste Farben:
- Auf ausreichenden Kontrast zwischen
Text- und Hintergrundfarbe achten
- Keine Rot-Grün-Kontraste einsetzen
- Informationen nicht allein durch Farben
vermitteln
- Farben in Zahlen und mit CSS formatieren
Checkliste Fotos und Grafikelemente:
- Angabe eines Textäquivalents (<alt>-
Text) für jedes Bildelement
- Einfügen eines Links, der auf eine genauere
Beschreibung des Bildes verweist
- Bei Bilder-Links: Eindeutige Beschrei-
bung des Ziels im <alt>-Text
- Wenn möglich, HTML-Markup (zum Bei-
spiel MathML) für Grafiken verwenden
- Typografie-Elemente und Texte als Bild
(.jpg oder .gif) vermeiden
Checkliste Diagramme:
- Angabe einer kurzen Textbeschreibung
(<alt>-Text)
- Einfügen eines Links, der auf eine genauere
Beschreibung des Bildes verweist
Bei Image-Maps ist eine alternative Bildbeschreibung (WAI 1.1)
ebenso notwendig wie die Angabe von Anzahl und Ziel enthaltener Links.
Besonders wichtig ist die eindeutige und klare Benennung angebotener
Links.
Image-Maps sollen immer clientseitig eingerichtet werden, da sie
nur dann mit der Tastatur (ohne Maus) angesteuert werden können (WAI
9.1). Kann aus bestimmten Gründen nur eine serverseitige Image-Map ein-
gerichtet werden, so ist diese unbedingt mit redundanten Text-Links auszu-
statten (WAI 1.2, BITV 1.2).
Barrierefreiheit und Multimedia
Grundsätzlich gelten für Bewegtbilder wie Video und Animatio-
nen die gleichen Richtlinien wie für stehende Bilder.
Um die Bewegtbild-Informationen für Blinde zugänglich zu ma-
chen, müssen Video und Animationen mit einem Textäquivalent hinterlegt
werden (WAI 1.1). Beim Einsatz von Video und Animationen ist es nahe lie-
gend, die visuellen Inhalte auf einer Extraseite als Text ausführlich zu be-
schreiben und auf diese einen Link zu legen.
Eine Audio-Beschreibung der visuellen Information des Videos
oder der Animation ist vorgeschrieben (WAI 1.3, BITV 1.3). Für Hörgeschädig-
te ist eine visuelle Übersetzung der Audio-Informationen notwendig. So
muss die Sprachspur des Videos oder der Animation als Untertitel synchron
zum Ablauf sichtbar sein (WAI 1.4, BITV 1.4).
Alle zeitgesteuerten Medien müssen durch den Nutzer unterbro-
chen oder angehalten werden können (WAI 7.3, BITV 7.3). Dabei sind auch
die Eingabearten über Tastatur, Stimme und Mund- oder Kopfstab zu berück-
sichtigen (WAI 9.3, BITV 9.3). Kann eine Unterbrechung oder das Anhalten
durch den Nutzer nicht gewährleistet werden, ist auf die Verwendung von
sich bewegenden Inhalten ganz zu verzichten.
Auch Y Animated GIFs müssen mit einem Alternativtext hinterlegt
werden.
Auf den Einsatz von Blink- und Flackereffekten des gesamten Bild-
schirms ist vollkommen zu verzichten (WAI 7.1, BITV 7.1), da dies für Men-
schen mit fotosensitiver Epilepsie schwere Folgen haben kann: Im Bereich
von 4 bis 59 Hertz oder bei einem schnellen Wechsel von Dunkel nach Hell
kann die Betrachtung dieser Effekte einen Anfall auslösen.
Blinkender Text stellt für viele Hilfsmittel ein Hindernis dar, da sie
über keine Übersetzungsmöglichkeiten verfügen. Daher sollen diese Effekte
ausschaltbar sein (WAI 7.2, BITV 7.2). Bei Einsatz des HTML-Elements BLINK
ist eine Nutzersteuerung nicht möglich. Werden Text-Blinkeffekte über das
CSS-Attribut style=„text-decoration:blink“ zugewiesen, kann der Nutzer die-
sen Effekt über seinen Browser abschalten.
Checkliste Image-Maps:
- Angabe eines Textäquivalents für das Ge-
samtbild
- Angabe einer Liste mit Übersicht, Anzahl
und Ziel aller enthaltenen Links
- Möglichst nur clientseitige Image-Maps
bereitstellen
- Bei serverseitigen Image-Maps redun-
dante Textlinks anbieten
Checkliste Multimedia:
- Hinterlegung eines Textäquivalents für
die visuellen Inhalte von Bewegtbildern
- Textbeschreibung der visuellen Inhalte
(bei größerem Umfang sollte auf eine se-
parate Seite mit Beschreibung verlinkt
werden)
- Audiobeschreibung der visuellen Inhalte
- Textbeschreibung aller Audio-Inhalte, bei
Video in Form von Untertiteln
- Keine Blink- und Flackereffekte auf dem
gesamten Bildschirm einsetzen
- Blinkenden Text nur über Stylesheets ein-
setzen
Barrierefreiheit und Formulare
Formulare werden besser barrierefrei zugänglich, wenn die Zuord-
nung zwischen dem Namen des Formularfeldes und dem Feld selbst eindeu-
tig ist. Dies wird durch eine Positionierung des Feldnamens direkt vor dem
dazugehörigen Formularfeld erzielt. Die Verbindung zwischen Beschriftung
und Formularfeld darf nicht unterbrochen werden (WAI 10.2, BITV 10.2).
Zu beachten ist die logische Reihenfolge der Formularbearbeitung
mit der Tastatur (Tab-Sprünge).
Es ist sinnvoll, mittels eines direkten E-Mail-Links zur entsprechen-
den Adresse eine formlose Variante des Formulars anzubieten. Vor diesem
Link sollte eine kurze Beschreibung der benötigten Daten stehen.
Barrierefreiheit und Applets/Scripts
Applets und Scripts (zum Beispiel eingebettete Java-Applikationen)
sind eigenständige kleine Programme, die automatisch auf dem Rechner des
Nutzers ablaufen, wenn dieser eine Internetseite mit Applets besucht. Dieser
Vorgang kann in den Browservoreinstellungen unterdrückt werden, da Applets
immer ein gewisses Sicherheitsrisiko bedeuten.
Manche Browser und Hilfsmittel für Behinderte unterstützen keine
Applets (zum Beispiel der DOS-Browser Lynx). Daher sollen Applets nur dann
eingesetzt werden, wenn gleichzeitig eine Alternative hinterlegt wird. Es
muss darauf geachtet werden, dass die Seite ihren vollen Informationswert
behält, selbst wenn Applets und Scripts nicht unterstützt oder absichtlich ab-
geschaltet werden (WAI 6.3, BITV 7.3).
Beim Einsatz von Applets und Scripten muss sichergestellt sein,
dass unabhängig vom Eingabegerät navigiert werden kann. So dürfen keine
gerätespezifischen Event-Handler (Ereignishändler) eingesetzt werden, son-
dern ausschließlich logische, geräteunabhängige (wie zum Beispiel onFocus,
onBlur) (WAI 9.2 und 9.3, BITV 6.4, 9.2, 9.3).
Eine weitere Option ist die Erstellung barrierefrei zugänglicher Ap-
plets und Scripts, da sie unabhängig von Browser und Hilfssoftware
abgespielt werden können. Anbieter von entsprechenden Produkten publi-
zieren Hinweise zur barrierefreien Anwendung ihrer Programme auf folgen-
den Websites:
Java Accessibility (Trace R&D Center)
http://trace.wisc.edu/world/java/java.htm
Active Accessibility (Microsoft Corporation)
http://www.msdn.microsoft.com/library/default.asp?url=/nhp/
Default.asp?contentid=28000544
http://www.microsoft.com/enable/default.htm.
54 Z u s a t z i n f o r m a t i o n e n
Checkliste Formulare:
- Formularbeschriftung immer direkt vor
dem Formularfeld positionieren
- Formlose Anfrage anbieten
- Bedienung mit Tastatureingabe ermög-
lichen
- Logische Tab-Reihenfolge anlegen
Checkliste Applets/Scripte:
- Applets und Scripts direkt zugänglich
programmieren
- Nicht zugängliche Applets und Skripte
mit Alternativinformationen hinterlegen
- Bereitstellung einer alternativen, barrie-
refrei zugänglichen Seite
- Die Alternativinformationen müssen
über Tastatur zugänglich sein
- Nur logische, geräteunabhängige Ereig-
nishändler einsetzen
Barrierefreiheit und Struktur/Orientierung
Jede Website muss inhaltlich klar und einfach strukturiert sein.
Über die Struktur sollen Informationen bereitstehen, zum Beispiel in Form
einer Sitemap oder eines Inhaltsverzeichnisses (WAI 13.3, BITV 13.3). Diese
Übersichten sind am zugänglichsten, wenn sie in einer einspaltigen Liste an-
geordnet sind.
Große Informationsblöcke sollen nach Möglichkeit in leicht hand-
habbare Gruppen unterteilt werden (WAI 12.3, BITV 13.3).
Barrierefreiheit und Navigation
Navigationsmechanismen sind in konsistenter Weise zu verwen-
den (WAI 13.4, BITV 13.4). Zudem sind Navigationsleisten bereitzustellen, die
den Navigationsmechanismus hervorheben (WAI 13.5, BITV 13.5, zum Bei-
spiel Haupt- und Untermenü). Dadurch wird die Navigationsstruktur ver-
ständlicher und der Zugriff auf sie erleichtert.
Eine Website wird allgemein benutzerfreundlicher durch die
gleich bleibende Position funktionaler Links über die gesamte Site und die
Platzierung wichtiger Navigationselemente direkt am Seitenbeginn. Nutzer,
die mit ihrem Screenreader die Seite nach Links abtasten, benötigen eindeu-
tige Link-Benennungen, die in wenigen Worten deutlich sagen, zu welchen
Informationen die Verknüpfungen führen (WAI 13.1, BITV 13.1). Eine Verlin-
kung mit dem Hinweis „Klicken Sie hier!” bietet einem blinden Nutzer keine
weiterführenden Informationen.
Horizontal nebeneinander angelegte Links benötigen genügend
Abstand oder ein Sonderzeichen als Trennelement. Andernfalls können
Screenreader Schwierigkeiten bei der Erkennung der Links bekommen. Eine
vertikale Anordnung ist zu bevorzugen.
Alle Links müssen über die Tastatur ansteuerbar sein.
Bildgrafiken als Links müssen mit einem <alt>-Text hinterlegt wer-
den, der klar den Sinn und das Ziel der Verlinkung nennt. Dies ist bei exter-
nen Links, die auf eine andere Domain verweisen, besonders wichtig.
Links, die auf Unterkapitel verweisen, sollen eine kurze Inhaltsbe-
schreibung beinhalten.
Bildelemente und Schaltflächen, die mit einer Verlinkung verse-
hen sind, sollen groß genug sein, dass sie von Menschen mit motorischen
Einschränkungen auch mit der Maus angewählt werden können.
Metadaten, die semantische Informationen über Webseiten anbie-
ten (Autor, Typ des Inhalts usw.) (WAI 13.2, BITV 13.2), sind bereitzustellen.
Dies sollte nach den Spezifikationen von RDF geschehen (Resource Descrip-
tion Framework), wie unter http://www.w3.org/RDF/ beschrieben.
Pop-ups: Die Hilfssoftware hat Schwierigkeiten, Inhalte in einem
neuen Fenster zu verlinken oder das aktuelle Fenster zu wechseln. Die Funk-
tion von Pop-ups ist zu vermeiden, bis sie von Nutzerseite aus unterbunden
werden kann (WAI 10.1, BITV 10.1).
Checkliste Struktur/Orientierung:
- Seiteninhalte klar und verständlich struk-
turieren
- Leicht zu handhabende, kleine Informa-
tionsblöcke bilden
- Einspaltige Sitemaps oder Inhaltsver-
zeichnisse anbieten
Checkliste Links:
- Durchgängig gleiche Positionierung der
Funktions-Links auf der gesamten Website
- Links mit inhaltlich eindeutiger Beschrif-
tung
- Links zu Unterkapiteln mit einer Kurzbe-
schreibung versehen
- Eine horizontale Aufreihung von Links im-
mer mit ausreichendem Abstand oder
Sonderzeichen voneinander trennen
- Alle Links für die Tab-Taste ansteuerbar
anlegen
- Grafische Schaltflächen ausreichend
groß gestalten
Checkliste Pop-ups:
Keine Pop-up-Fenster einbinden
Barrierefreiheit und Aktualisierung
Bei dynamischen Inhalten muss sichergestellt sein, dass die zur
Verfügung gestellten Alternativen dem Aktualitätsgrad der dynamischen
Inhalte entsprechen. Automatische Weiterleitung und Aktualisierung der
Seiten sind zu vermeiden, da diese Funktionen mit den gängigen Hilfsmitteln
nicht kompatibel sind (BITV 10.1).
Aufgrund der Tatsache, dass für eine barrierefreie Zugänglichkeit
der Web-Inhalte in vielen Fällen mit Textäquivalenten oder komplett alter-
nativen Seiten gearbeitet werden muss, ist die Aktualisierung aller dynami-
schen Inhalte eine vorrangige Richtlinie für den barrierefreien Zugang. Erst
wenn alle Nutzer an die gleichen, aktuellen Inhalte gelangen, ist der gefor-
derte universelle Zugriff möglich (BITV 6.2).
Weiterleitung: Screenreader haben Schwierigkeiten mit der auto-
matischen Aktualisierung von Seiteninhalten. Mindestanforderung ist, dem
Nutzer einen Hinweis auf diese Funktion zu geben und ihn entscheiden zu
lassen, ob die Seite aktualisiert werden soll. Bis zur browserseitigen Unter-
stützung dieser Funktionswahl sollte der Refresh-Befehl nicht verwendet
werden (WAI 7.4, BITV 7.4).
Auch eine automatische Weiterleitung auf andere Seiten verur-
sacht Hilfssoftware-Schwierigkeiten. Deshalb ist auf eine automatische
Weiterleitung zu verzichten (WAI 7.5, BITV 7.5). Nur eine serverseitig einge-
richtete Weiterleitung ist unproblematisch.
56 Z u s a t z i n f o r m a t i o n e n
Checkliste dynamische Inhalte:
Alle Alternativen für dynamische Inhalte
müssen parallel zu den dynamischen In-
halten aktualisiert werden.
Checkliste Weiterleitung:
- Hinweis auf automatischen Neuaufruf
der Seite geben
- Keine Verwendung des Refresh-Befehls
- Serverseitige automatische Weiterlei-
tung einsetzen, andernfalls einen norma-
len Link verwenden
Barrierefreiheit und Download-Dateien
PDF ist ein offenes, weit verbreitetes und plattformunabhängiges
Dateiformat, das von Adobe Systems entwickelt wurde. Durch dieses, im
Internet für Downloads eingesetzte Dateiformat ist es möglich, Dokumente
gleichen Inhalts sowohl für den Bildschirm als auch für den Druck zu gene-
rieren. Um eine PDF-Datei zu öffnen, ist die Zusatzsoftware Acrobat Reader
notwendig, die von Adobe Systems frei zur Verfügung gestellt wird.
Da es sich um ein grafisches Format handelt, sind PDF-Dateien in
der Regel nicht zugänglich für Nutzer von Screenreadern und nicht grafi-
schen Browsern.
Deshalb hat Adobe Systems einen Service eingerichtet, der PDF-Da-
teien in ASCII-Text oder ein HTML-Dokument übersetzt. Informationen und
Anweisungen können auf der folgenden Website eingesehen werden:
http://access.adobe.com.
Allerdings liefert die Konvertierung komplexer, grafischer PDF-Do-
kumente nicht unbedingt ein annehmbares Ergebnis. Vor dem Einsatz eines
PDF-Dokumentes sollte der Nutzer informiert werden, dass dieses Format
zum Einsatz kommt, dass eine Zusatzsoftware notwendig ist und wo diese
erhältlich ist: http://www.adobe.com/products/acrobat/main.html.
Eine weitere Möglichkeit ist, das Angebot um mehrere, unter-
schiedliche Dateiformate zu erweitern, darunter Standardformate wie RTF
und TXT.
Bei allen Dateien sollen die MS-DOS-Konventionen für Namens-
benennung der Dateien eingehalten werden: maximal 8 Zeichen, einen
Trennpunkt und eine Dateiformat-Erweiterung aus 3 Zeichen. 12345678.123
Checkliste Download-Dateien:
- Auf den Einsatz von PDF-Dokumenten
hinweisen
- Links zu den entsprechenden Websites
von Adobe Systems anbieten
- Dokumente in unterschiedlichen Datei-
formaten anbieten (PDF, RTF, TXT)
- MS-DOS-Konventionen für Dateibenen-
nungen einhalten
Barrierefreiheit und Sprache
Es ist auf einen allgemein verständlichen Sprachgebrauch mit ein-
fachen und gebräuchlichen Begriffen zu achten (WAI 14.1, BITV 14.1).
Es ist ratsam, sich knapp, aber klar und verständlich auszudrücken.
Lesbarkeitsstatistiken, die in einigen Programmen zur Textverar-
beitung verfügbar sind, können brauchbare Indikatoren für die Klarheit und
Einfachheit eines Textes sein. Es ist besser, einen professionellen Korrektor zu
bitten, den Inhalt auf seine Klarheit zu überprüfen. Zu prüfen sind unter an-
derem Fremdwörter oder Fachausdrücke.
Jeder Text sollte vor seiner Einstellung ins Internet eine Recht-
schreibprüfung durchlaufen. Personen, die eine Seite mit einem sprachge-
nerierenden Browser lesen, sind möglicherweise nicht in der Lage, falsch ge-
schriebene Wörter zu verstehen.
Sind Fachausdrücke unvermeidlich, sollen diese an geeigneter
Stelle mit Hilfe eines Glossars erläutert werden.
Für Screenreader sind Sprachwechsel, Fachtermini und Abkürzun-
gen oft ein Hindernis. Daher sollen Wechsel in der natürlichen Sprache (WAI
4.1, BITV 4.1), Fachausdrücke und Abkürzungen mit einem entsprechendem
MARKUP (dem <lang>-Attribut) ausgezeichnet werden.
Um Zitate korrekt zu interpretieren, benötigt gängige Hilfssoft-
ware die dafür vorgesehenen HTML-Elemente <BLOCKQUOTE> oder
<Q> (WAI 3.7). Ist ein Textabschnitt dementsprechend markiert, wird er
als Zitat ausgegeben oder vorgelesen.
Überprüfung der Barrierefreiheit
Die Überprüfung der barrierefreien Zugänglichkeit einer Internet-
präsenz sollte sowohl mit automatischen Tools als auch von Personen durch-
geführt werden. Automatisierte Methoden sind im Allgemeinen schnell und
bequem, können aber nicht alle Zugänglichkeitsprobleme erkennen. Eine
Überprüfung durch Personen mit unterschiedlichen Qualifikationen ist hilf-
reich, um eine klare Sprache und einfache Navigation sicherzustellen.
Es ist sinnvoll, die Überprüfungen in den frühesten Stufen der Ent-
wicklung zu beginnen, da zeitig erkannte Zugänglichkeitsprobleme einfa-
cher zu korrigieren und zu vermeiden sind.
Ein weiterer empfohlener Standard der WAI ist, jede Seite nach ih-
rer Überprüfung mit einer Dokumententyp-Erklärung (DTD) am Anfang der
Seite auszustatten (WAI 3.2). Dies dient der Erkennung des Zugänglichkeits-
levels sowie weiterer überprüfter und eingehaltener Standards.
58 Z u s a t z i n f o r m a t i o n e n
Checkliste Sprache:
- Einfache und verständliche Sprache ver-
wenden
- Fachausdrücke in einem Glossar erläu-
tern
- Sprachwechsel kennzeichnen
- Zitate kennzeichnen
- Fachausdrücke und Abkürzungen kenn-
zeichnen
- Professionelle Korrektoren einsetzen
Wichtige Überprüfungsmethoden auf
Barrierefreiheit:
- Überprüfung durch ein automatisches
Tool (zum Beispiel http://bobby.cast.org/)
- Überprüfung der Syntax (zum Beispiel
HTML, XML usw.)
- Überprüfung von Stylesheets (zum Bei-
spiel CSS)
- Test auf einem Text-Browser
- Test auf einem Grafik-Browser:
- mit Ton und Grafik aktiviert,
- ohne Grafiken,
- ohne Ton,
- ohne Maus (wichtig bei Einsatz von Lay-
outtabellen und Frames)
- mit deaktivierten Frames, Scripten,
Stylesheets und Applets
- Test auf mehreren, neueren und älteren
Browserversionen
- Einsatz einer Rechtschreib- und Gram-
matikprüfung
- Überprüfung auf Klarheit und Einfachheit
durch Personen
- Direkte Überprüfung durch behinderte
Menschen (Anfänger und Fortgeschritte-
ne) kann ein wertvolles Feedback über
Probleme der Zugänglichkeit oder Ver-
wendbarkeit und deren Umfang liefern.
Linkliste zum Thema „Barrierefreier Zugang“
Die offiziellen Richtlinien für barrierefreien Zugang zu Internet-
inhalten der Web-Accessibility-Initiative des W3-Konsortiums sind unter
folgender Adresse im Internet zu finden:
- http://www.w3.org/WAI (englisch)
- http://www.w3.org/WAI/Resources/#ts (Übersetzungen)
- http://www.w3.org/WAI/wcag-curric (Curriculum, englisch)
Die Vorgaben der Barrierefreie-Informationstechnik-Verordnung
für öffentlich zugängliche Angebote von Behörden der Bundesverwaltung
können hier nachgelesen werden:
http://www.bmi.bund.de/dokumente/Artikel/ix_90156.htm
Das E-Government-Handbuch des Bundesamtes für Sicherheit in
der Informationstechnik (BSI) gibt Empfehlungen zur Organisation und zum
IT-Einsatz im E-Government:
http://www.bsi.bund.de/fachthem/egov/6.htm
Im deutschsprachigen Internet bieten darüber hinaus die Web-
sites folgender Initiativen Informationen und Materialien zum Thema
barrierefreier Zugang an:
- http://www.barrierefreies-webdesign.de
- http://www.einfach-fuer-alle.de
- http://selfaktuell.teamone.de/artikel/design/barrierefrei
Für die Überprüfung von Websites auf ihre barrierefreie Zugänglich-
keit bieten folgende Adressen hilfreiche Informationen und Werkzeuge:
- http://www.w3.org/WAI/eval (englisch)
- http://www.w3.org/WAI/ER/existingtools.html (englisch)
- http://bobby.cast.org (englisch)
- http://www.accessibilitymonitor.com (englisch)
Nachstehend werden allgemeine Begriffe
aus Grafik- und Screendesign und Begriffe,
die im vorliegenden Styleguide eingeführt
wurden, alphabetisch aufgelistet und erläu-
tert. Technische Begriffe aus dem Internet
werden im Nachschlagewerk der Initiative
BundOnline 2005
(http://www.bund.de/BundOnline-
2005/SAGA/Glossar-.6343.htm) erläutert.
A
Active LinkEngl. für „betätigter Verweis“. Visuelle Aus-
zeichnung eines Text-Hyperlinks während
des Mausklicks. Beispielweise kann die Farbe
oder Unterstreichung eines Links während
des Klicks wechseln. Diese Auszeichnung sig-
nalisiert dem Nutzer, dass soeben eine Inter-
aktion aufgerufen wurde.
(Y Hyperlink)
Additives FarbsystemSystem zur Farbdarstellung auf Bildschirmen.
Aus den Y RGB-Farben Rot, Grün und Blau las-
sen sich alle weiteren, am Bildschirm sichtba-
ren Farben mischen. Zu gleichen Anteilen ge-
mischt, ergeben sich je nach Farbintensität
Weiß bis Schwarz.
AnimationDie Darstellung von sich bewegenden Bild-,
Text- oder Grafikelementen, so dass zum Bei-
spiel ein kleiner Film entsteht.
Animated GIFEin Dateiformat, das die Möglichkeit bietet,
mehrere Grafiken in einer einzigen Grafikda-
tei so zu speichern, dass die einzelnen Grafi-
ken zeitlich steuerbar sind. Dadurch wird die
Darstellung kleiner, aus GIF-Grafiken beste-
hender Filmsequenzen ermöglicht.
Anti-AliasingEin Algorithmus für Pixelgrafiken, der in Grafi-
ken an harten Kanten oder Farbübergängen
sichtbare Treppeneffekte ausgleicht.
AppletEin kleines, aus dem Internet ladbares, in der
Programmiersprache Java erstelltes Pro-
gramm.
ASP Die Abkürzung für „Active Server Pages“. ASP
führt auf einem Server Scripte (*.asp) für dy-
namisch generierte Internetseiten aus..
AttachmentEine beliebige Datei, die als Anlage mit einer
E-Mail versandt wird, zum Beispiel Textda-
teien und Bilder.
AuflösungDie Wiedergabefeinheit von Elementen bei
ihrer Zusammensetzung zu Bildern. Je höher
die Auflösung eines Bildes, desto detailrei-
cher ist seine Darstellung bzw. die Möglich-
keit seiner Vergrößerung. Die Auflösung wird
je nach Anwendung und Verfahren in dpi
(Dots per Inch), ppi (Points per Inch) oder lpi
(Lines per Inch) gemessen.
AusrichtungsrasterDie feinste Unterteilung einerY Rastereinheit.
Der Ausrichtungsraster dient der einheit-
lichen Anordnung detaillierter Gestaltungs-
elemente in einem Y Grundraster.
AuszeichnungDas Hervorheben einzelner Textteile durch
Varianten der Grundschrift, zum Beispiel kur-
sive oder fette Schnitte. Weitere Auszeich-
nungsmöglichkeiten sind Kapitälchen oder
Großbuchstaben, das Unterstreichen oder
farbliche Hervorstellen von Texten.
B
BannerEine kleine Werbefläche auf einer Internetsei-
te, die den Betrachter durch Anklicken mit
dem Web-Server des Werbenden verbindet.
Barrierefreiheit (oder
barrierefreier Zugang)Barrierefreier Zugang zum Internet bedeu-
tet, dass Internetanwendungen so entwick-
elt und technisch umgesetzt werden, dass
ein größtmöglicher Nutzerkreis mit unter-
schiedlichsten Hard- und Software-Voraus-
setzungen oder speziellen Hilfsmitteln die In-
halte erreichen kann. Im Abschnitt „Barriere-
freier Zugang“ des Kapitels „Zusatzinforma-
tionen“ werden dafür benötigte Richtlinien
zusammengefasst und nach Themen geglie-
dert wiedergegeben.
BasiselementeDie essenziellen Grundelemente eines Cor-
porate Designs, wie z. B. das Logo, Schriften
und Farben.
BaudNach Emile Baudot benannte Maßeinheit für
die Geschwindigkeit einer Datenübertra-
gung, zum Beispiel durch ein Modem. 28.800
Baud entsprechen der Übertragung von
28.800 Bit/Sekunde.
BildschirmauflösungDie durch ihre Pixelanzahl definierte Wieder-
gabefeinheit von Monitoren.
BildspracheDie durch ihren Stil hervorgerufene Anmu-
tung von Abbildungen.
BildunterschriftDer einem Bild zugeordnete, den Bildinhalt
beschreibende oder interpretierende Text.
BildwortmarkeEine gestaltete Kombination von einer Abbil-
dung mit einem Schriftzug. Die auch als Logo
bezeichnete Bildwortmarke drückt die Iden-
tität von Institutionen, Firmen, Marken oder
Veranstaltungen visuell aus.
BitDie Abkürzung für „Binary Digit“. Ein Bit ist
die kleinste, einer Speicherzelle entsprechen-
de Informationseinheit im binären Zahlensy-
stem. Ein Bit kann entweder den Wert 0 oder
1 annehmen; 8 Bit werden zu einem Byte zu-
sammengefasst.
BITVAbkürzung für „Barrierefreie-Informations-
technik-Verordnung“: Verordnung zur Schaf-
fung barrierefreier Informationstechnik nach
dem Behindertengleichstellungsgesetz,
nach deren Vorgaben alle öffentlich zugäng-
lichen Internetauftritte und -angebote sowie
Intranetauftritte und -angebote der Behör-
den der Bundesverwaltung bis zum
31.12.2005 umgesetzt werden müssen (vgl.
„Zusatzinformationen“).
BrailleEine nach ihrem Erfinder Louis Braille be-
nannte Blindenschrift, die einzelne Buchsta-
ben als eine Kombination aus sechs fühlbaren
Punkten darstellt.
BrowserAuch: Web-Browser. Die vom englischen „to
browse“ (durchblättern, sich umsehen) ab-
geleitete Bezeichnung für ein Programm zur
Darstellung von HTML-Dokumenten im Inter-
net. Daneben werden über den Browser die
Glossar
62 G l o s s a r
Befehle zur Navigation auf den Websites im
Internet gegeben. Bekannte Browser sind der
„Internet Explorer“ von Microsoft oder der
„Navigator“ von Netscape.
BrowserfensterInnerhalb eines Y Browsers der Bereich, in
dem HTML-Dokumente dargestellt werden,
wird auch Viewport genannt. Gemäß der Vor-
gaben des Styleguides der Bundesregierung
werden alle Webseiten auf Basis der empfoh-
lenen Bildschirmauflösung von 1024 x 768 px
für eine innere Browserfensterbreite von 952
px optimiert.
BrowseroptimierungAlle Internetpräsenzen und Online-Medien
der Bundesregierung sowie ihre Ressorts
müssen dem HTML 4.1 Standard entsprechen
und mittels Y CSS (Abkürzung für Casca-
ding Stylesheets) Level 2 formatiert sein. Da-
bei sollte auf die Darstellungseigenheiten ak-
tueller Versionen von populären Browsern,
(z. B. Microsoft Internet Explorer ab Version 5
und Netscape-Gecko-Browser ab Version 6)
Rücksicht genommen werden. Besondere
Beachtung muss der Interpretierbarkeit
durch Eingabe- und Ausgabegeräte für Kör-
perbehinderte (Braille-Ausgabe, Screenrea-
der), bei veränderten Benutzereinstellungen
(Farben, Schriften, Schriftgröße) und ohne
Zusatztechnologien (Plug-ins, Java, Java-
Script, CSS) finden. Eine Umsetzung einer ge-
sonderten Textversion wird dadurch in der
Regel unnötig.
BundOnline 2005Eine Initiative, mit der sich die Bundesregie-
rung verpflichtet, alle internetfähigen
Dienstleistungen der Bundesverwaltung bis
zum Jahr 2005 online bereitzustellen. Nach-
zulesen unter http://www.bundonline2005.de.
ButtonEin bildhaftes Bedienelement, das bei einem
Mausklick eine Funktion innerhalb des jewei-
ligen Programmes bewirkt. Bei der Wahl des
Buttontyps ist darauf zu achten, dass die But-
tons syntaktisch und visuell miteinander kor-
respondieren.
C
CGI-ScriptDie Abkürzung für „Common Gateway Inter-
face“. Das CGI ist die Schnittstelle auf einem
Web-Server zum Programmaufruf über einen
Browser. Die bekannteste Programmierspra-
che für diese Schnittstelle ist Perl.
ChatEin Chat ist eine Internetanwendung – eine
Plattform zur direkten Kommunikation ver-
schiedener Nutzer auf der Basis von Text-
nachrichten.
ContentDer im Y Browserfenster sichtbare Inhalt einer
Internetpräsenz, zum Beispiel Text- und Bild-
informationen, Datenbankanbindungen
oder Download-Bereiche etc.
Content-PagesDie Summe aller Y HTML-Seiten abzüglich
interaktiver Angebote wie Y Chats oder Da-
tenbanken.
Corporate DesignDas visuelle Erscheinungsbild einer Institu-
tion oder eines Unternehmens. Wichtige Ba-
siselemente des Corporate Designs sind das
Firmenzeichen, die Schriften und Farben so-
wie die Bildsprache. Das Corporate Design ist
der sichtbare Teil der Corporate Identity.
CSS Die Abkürzung für „Cascading Style Sheets“.
CSS sind Stilvorlagen, die es ermöglichen, das
Layout, die Schriften, Farben etc. von HTML-
Seiten zu definieren. Bei der Programmie-
rung von CSS muss auf die Darstellungseigen-
heiten aktueller Versionen von populären
Y Browsern, (z.B. Microsoft Internet Explorer
ab Version 5 und Netscape-Gecko-Browser ab
Version 6) Rücksicht genommen werden. Z. B.
wird die Einheit x-Höhe (ex) von populären
Browsern nicht regelrecht interpretiert und
kann daher zur Zeit nicht eingesetzt werden.
Die Interpretation durch Browser mit höhe-
rer Standardtreue (etwa Mozilla Firefox), so-
wie die semantische und technische Validität
des Quelltextes und der CSS-Anweisungen
darf dadurch jedoch nicht beeinträchtigt
werden. Browser der vierten Generation kön-
nen CSS-Anweisungen nicht interpretieren
(z. B. Netscape Navigator 4.7). Bei diesen
Browsern wird eine mit CSS programmierte
Seite ohne Designelemente dargestellt. So
lange die Funktionsfähigkeit der Seite ge-
währleistet bleibt, sind aber die Anforderun-
gen der Barrierefreiheit erfüllt. Die Defizite in
der Layoutdarstellung auf diesen Browsern
werden daher in Kauf genommen.
D
DateiformatEin Dateiformat ist ein Regelsatz zum struk-
turierten Aufbau von Dateien.
DitheringEin Verfahren, bei dem den Pixeln eines Bildes
bei einer Interpolation weitere „Zwischenfar-
ben“ zugeordnet werden.
DokumentvorlageEine YMusterdatei, in der bestimmte Gestal-
tungsparameter wie Schriften oder Farben
zur späteren Nutzung vorbereitet wurden.
DomainEine Domain ist eine Verwaltungseinheit in
Computernetzwerken, durch die eine Auftei-
lung in verschiedene logische oder geografi-
sche Segmente ermöglicht wird. Im Internet
werden Computer, die zu einer Domain ge-
hören, über Suffixe zusammengefasst, z.B.:
.com, .org, .de.
DownloadDer Datentransfer von einem Server, zum Bei-
spiel das Abrufen von Programmen, Bildern
oder Texten auf den eigenen Rechner.
Drop-down-MenüListe zum Auswählen eines Untermenüs, das
sich beim Klick auf das Hauptmenü „aus-
klappt“.
dpiDie Abkürzung für „Dots per Inch“, die die
Wiedergabefeinheit (Y Bildschirmauflösung)
von Monitoren bezeichnet.
E
E-GovernmentAllgemeine Bezeichnung für den über Daten-
netze abgewickelten Geschäftsverkehr von
Behörden. E-Government schließt die Kom-
munikation zwischen Behörden und Bürgern
(G2C), Behörden und der Wirtschaft (G2B) so-
wie Behörden untereinander (G2G) ein.
E-MailDie Abkürzung für „Electronic Mail“ (elektro-
nische Post), ein Postdienst, der über einen
Internetanschluss zur Nachrichtenübermitt-
lung dient.
F
FAQDie Abkürzung für „Frequently asked ques-
tions“ (häufig gestellte Fragen). Eine in vielen
Internetpräsenzen und News-Groups weit
verbreitete Online-Dienstleistung, bei der
häufig gestellte Fragen beantwortet werden.
FarbklimaAufeinander abgestimmte, sich ergänzende
Farbtöne, die am häufigsten mit speziellen
Wirkungen assoziiert werden.
FarbtiefeEine in der Einheit Bit angegebene Wiederga-
befeinheit von Farbtönen: Mit einer Farbtiefe
von 1 Bit kann zwischen nur zwei Zuständen
unterschieden werden, i. d. R. schwarz und
weiß. D. h., dass jedes Pixel wird entweder
schwarz oder weiß wiedergegeben. Bei einer
Farbtiefe von 8 Bit können schon 256 ver-
schiedene Farben dargestellt werden (zum
Beispiel bei YGIF-Dateien). Stehen für jeden
Farbkanal (Rot, Grün und Blau) jeweils 8 Bit
zur Verfügung, beträgt die Farbtiefe 24 Bit
oder 16,7 Millionen Farben (zum Beispiel bei
Y JPG-Dateien oder Y PNG-Dateien).
Focus-LinkEngl. für „anvisierter Verweis“. Visuelle Aus-
zeichnung eines Text-Hyperlinks (YHyperlink)
während des Fokus auf denselben durch Ta-
staturbedienung, üblicherweise bei Naviga-
tion mit der Tabulator-Taste. Beispielweise
kann die Farbe oder Unterstreichung eines
Link während des Fokus wechseln. Diese Aus-
zeichnung signalisiert dem Nutzer, dass eine
Interaktion möglich ist. Die Formatierung
entspricht idealerweise der des YHover-
Links.
FrameEin von Netscape entwickelter Standard für
ein Bildschirmelement, der eine Website in
fest definierte, voneinander unabhängige
Bereiche aufteilt. Diese können auch dann
sichtbar bleiben, wenn andere Seiten derselben
Internetpräsenz aufgerufen werden. Frames
führen häufig zu Problemen beim Anlegen
von Favoriten/Bookmarks, beim Drucken, bei
der Indizierung durch Suchmaschinen und
beim manuellen Empfehlen einer Website.
Von der Verwendung ist daher im Allgemei-
nen abzuraten.
G
GeviertEin nicht druckendes „Leerzeichen“, dessen
Breite der Schriftgröße entspricht. Ein Ge-
viert einer 12-Punkt-Schrift hat somit eine
Breite von 12 Punkt (pt). Das Geviert wird zum
Setzen von schriftgrößenabhängigen Ab-
ständen verwendet.
GIFDie Abkürzung für „Graphics Interchange For-
mat“, ein stark komprimierendes Dateiformat
für Bilder und Grafiken. Das GIF-Format ist un-
abhängig vom Betriebssystem.
Guided TourEine vorbereitete, „geführte“ Tour, die den
Benutzer durch fest definierte Bereiche
führt, zum Beispiel als Einführung in eine
neue Software.
GrafikelementZusammenfassende Bezeichnung von Fotos,
Grafiken oder Text, die als Grafikformate
(YGIF, Y JPG etc.) in Online-Medien einge-
setzt werden.
GrundrasterEin Gliederungs- und Anordnungssystem für
Text- und Bildelemente in einem Y Layout. Es
dient der stilistischen Stärkung und Verein-
heitlichung des Designs und seiner schnellen
und wirtschaftlichen Herstellung. Besonders
detaillierte Elemente können mit einem fei-
neren Y Ausrichtungsraster exakt positioniert
werden.
H
HauptnavigationDie oberste Navigationsebene einer Internet-
präsenz.
HexadezimalwertEine Zahl, die einen Skalen-Farbton für die
Darstellung von Y RGB-Farben an Bildschir-
men definiert.
HomepageStart- oder Begrüßungsseite eines Internet-
angebots, von der aus auf weitere Untersei-
ten zugegriffen werden kann.
Hover-LinkEngl. für „schwebender Verweis“. Visuelle
Auszeichnung eines Text-Hyperlinks
(YHyperlink) während des YMouse-over.
Beispielweise kann die Farbe oder Unterstrei-
chung eines Links wechseln. Diese Auszeich-
nung signalisiert dem Nutzer zusätzlich zur
üblichen Verwandlung des Mauszeigers zur
Hand, das eine Interaktion möglich ist.
HTMLDie Abkürzung für „Hypertext Markup Lan-
guage“ (YHypertext), der Kennzeichnungs-
sprache zum Erstellen von Webseiten. Wurde
von Tim Berners-Lee entwickelt und mit dem
Boom des Internets innerhalb weniger Jahre
zur Sprache des Web. Standard des W3C, RFC
1866, RFC 2854, W3C HTML 4.0, W3C XHTML
1.0. Siehe auch „Technische Standards“ im Ka-
pitel „Zusatzinformationen“.
HTTPDie Abkürzung für „Hypertext Transfer Proto-
col“, das Übertragungsprotokoll für HTML-
Dokumente im World Wide Web.
HyperlinkAuch „Link“: Technologie, mit der auf Elemente
in anderen Webseiten verwiesen werden
kann. Durch Hyperlinks können verschiedene
HTML-Dokumente verbunden werden, so
dass der Nutzer einem Interessenstrang über
verschiedene Dokumente und Server hinweg
folgen kann (Y Active Link, Y Focus Link,
YHover Link, Y Visited und Unvisited Links).
HypertextKurzform für „Hypertext Markup Language“.
Kennzeichnungssprache zum Erstellen von
Webseiten. Wurde von Tim Berners-Lee ent-
wickelt und mit dem Boom des Internets
innerhalb weniger Jahre zur Sprache des Web.
Standard des W3C, RFC 1866, RFC 2854, W3C
HTML 4.0, W3C XHTML 1.0.
I
IconEin Symbol eines Betriebssystems oder Pro-
gramms, das nach einem Mausklick ein An-
wendungsprogramm aufruft oder eine Funk-
tion aktiviert.
Image-MapEine sensitive Grafikdatei, die innerhalb eines
Bildes mit unterschiedlichen Aktionen, meist
Links, hinterlegt ist. Bei serverseitigen Image-
Maps wird die Grafikdatei an den Y Browser ge-
64 G l o s s a r
sandt; die Koordinaten des Mauszeigers veran-
lassen den Server, die entsprechenden Aktionen
im Browser auszuführen. Bei clientseitigen Ima-
ge Maps sendet der Server außer der sensitiven
Grafik noch Aktionsanweisungen und evtl. Dar-
stellungselemente zu den einzelnen Koordina-
tenbereichen der Grafikdatei mit.
InchIn angelsächsischen Ländern gebräuchliches
Längenmaß, das u. a. als Bemaßungsgrundla-
ge für Computer verwendet wird, zum Bei-
spiel Ausgangsmaß für die Auflösungsfein-
heit von Monitoren und Druckern, für die
Darstellung von Schriften (72 Point = 1 Inch);
1 inch = 25,4 mm.
InteraktivDie Möglichkeit, als Anwender in den vorge-
gebenen Programmablauf eines Computers
einzugreifen und ihn zu steuern.
Interaktives VerhaltenAktionen (wie Roll-over, Button-down oder
Pull-down), die durch das „Berühren“
und/oder „Anklicken“ von Bildschirmelemen-
ten durch den Nutzer ausgelöst werden.
InterfaceDie Schnittstelle zwischen zwei Teilen eines
Computersystems. Sie dient der Steuerung
des Informationsaustausches und dem Aus-
gleichen bauartbedingter Unterschiede.
InternetWeltweites Computer-Netzwerk, das ur-
sprünglich als ARPA Net zu militärischen
Zwecken aufgebaut wurde, aber über die in-
tensive Weiterentwicklung und Nutzung
durch Universitäten schnell an Beliebtheit
gewonnen hat. Mit der Entwicklung und Ein-
führung des World Wide Web wurde das
Internet in rasantem Tempo zu einer univer-
sellen, internationalen Plattform zur Informa-
tion und Kommunikation.
InternetadresseDie aufgrund ihrer Y URL eindeutige Identifi-
zierung eines Internetangebotes.
Internet ExplorerEin von der Firma Microsoft entwickelter
Y Browser für die Navigation und Darstellung
von Inhalten im Internet.
IntranetEin institutions- oder firmeninternes Daten-
netz, das auf den Internettechnologien ba-
siert. Ein Intranet kann mit oder ohne Inter-
netverbindung konzipiert sein.
J
JPEG/JPGDie Abkürzung für „Joint Photographic Ex-
perts Group“ (vereinigte Fotoexperten-Grup-
pe), ein Standard für die Kompression von di-
gitalen Bildern. Die Datenreduktion von JPEG
wird dadurch erreicht, dass sehr ähnliche Far-
ben als ein Farbton abgespeichert werden.
Dadurch bleibt der Qualitätsverlust bei Fotos
gering.
K/L
LauffähigkeitDie vom Betriebssystem abhängige Funk-
tionsfähigkeit von Programmen.
LaufweiteDer generelle Abstand aller Buchstaben einer
Schrift. Der Ausgleich von einzelnen Buchsta-
benpaaren wird als Kernen bezeichnet, das
Ändern der Laufweite als Spationieren. Siehe
auch Y Spationierung.
LayoutDer Seitenaufbau eines Dokumentes mit sei-
nen gestalterischen Basiselementen (Farben,
Bildwortmarke, Typografie etc.) und deren
grundsätzlicher Anordnung.
LinkEngl. für „Verknüpfung, Verweis“. Das Kurz-
wort für einen YHyperlink. Man unterschei-
det durch die visuelle Darstellung in Y Active,
YHover-/Focus-, Y Visited- und Unvisited-Links.
LoginDie Anmeldeprozedur auf einem Computer
oder einem Datennetz. Das Login benötigt
meist ein Kennwort zur Nutzungs-Legitima-
tion von Programmen, Datenbanken und On-
line-Angeboten.
LogoDas Kurzwort für ein Firmen- oder YMarken-
zeichen.
Look and FeelDie atmosphärische Wirkung einer Internet-
präsenz. Sie entsteht durch die Homogenität
von Design, Bedienung und Benutzerfüh-
rung, evtl. auch Klangkomponenten. Das
Look and Feel sollte einer stärkeren Wirkung
halber in engem visuellem Zusammenhang
mit dem Corporate Design stehen.
M
MarginalspalteEine Spalte, die Text- und Bildinformationen
enthält, die einen nebenstehenden Inhalt er-
gänzen. Dies kann eine Auflistung weiter-
führender Y Links, die direkte Verbindung zu
Sonderseiten und -themen oder auch die Ab-
bildung von Bannern sein.
MarkenzeichenEin gestaltetes Symbol, das als identitätsre-
flektierendes bzw. -stiftendes Zeichen für In-
stitutionen, Firmen, Marken oder Veranstal-
tungen dient. Es kann aus einer reinen Abbil-
dung (Bildmarke oder Signet), einem Schrift-
zug (Wortmarke oder Logotype) oder einer
Kombination von beidem (Y Bildwortmarke)
bestehen. Das Markenzeichen wird häufig als
Logo bezeichnet.
MaßeinheitenAngaben für die Benennungen von gemesse-
nen Werten, zum Beispiel Längen- oder Flä-
chendimensionen. Im Druck werden Raster-
feinheiten, Schriftgrößen und Zeilenabstän-
de in Millimetern (mm) oder Punkt/Point (pt)
angegeben. Für den Bildschirm stehen die
folgenden numerischen Angaben als Maß-
einheiten zur Verfügung: mm (Millimeter),
in (Inch), pt (Punkt/Point), px (Pixel), em (Em),
ex (Ex), % (Prozent). Dabei sind absolute Anga-
ben (zum Beispiel Millimeter) und relative
Angaben (zum Beispiel Prozent gegenüber
„normal“) möglich. Um Schriften durch den
Nutzer skalierbar darzustellen, werden % und
em für die Schriftformatierung verwendet.
Um das Layout an die Schriftgröße zu kop-
peln, wird für die meisten Breitenangaben
und Abstände em verwendet. Prozentuale
Breitenangaben oder Bereiche ohne Angabe
einer Breite sind von der Breite des Y Brow-
serfensters (außerdem: Y Viewport) bzw. des
Elternelements, abhängig.
Meta-TagsFür die Erkennung durch Suchmaschinen not-
wendige, aber nicht dargestellte Informatio-
nen über eine YHTML-Seite.
Mouse-downDas Auslösen einer Funktion durch das Drük-
ken einer Maustaste auf einen fest definierten
Bereich.
Mouse-overDas Auslösen einer Funktion durch das Eintre-
ten des Cursors (Mauszeigers) in einen fest
definierten Bereich.
Mouse-outDas Auslösen einer Funktion durch das Verlas-
sen des Cursors (Mauszeigers) aus einem fest
definierten Bereich.
MPEGDie Abkürzung für „Moving Picture Experts
Group“ ist einerseits die Bezeichnung für ein
Standardisierungskomitee, steht anderer-
seits als Sammelbegriff für eine Reihe von
Standards zur Kodierung und Komprimie-
rung audiovisueller Daten.
MusterdateiEine mustergültige Satzdatei, die als Basis
zur Erstellung von Entwürfen und Druckvorla-
gen dient. Sie enthält neben den Standanga-
ben in Form eines Layoutrasters alle typogra-
fischen und farblichen Definitionen in Form
von Stilvorlagen.
N
NavigationDie Bedienung und Benutzerführung einer
Internetpräsenz. Da die Benutzer mit der je-
weiligen Website nicht vertraut sind, führt
eine gute Navigation direkt und einfach zu
den angebotenen Inhalten. Dabei kann die
Navigation sowohl permanent sichtbare Ele-
mente (Home-Button, Hauptnavigation, Ser-
vicebereiche) als auch variable, dem verän-
dernden Inhalt angepasste Elemente auf-
weisen.
NavigationsbereichDer Bereich auf dem Screen innerhalb des
Y Browserfensters, der die Navigation bein-
haltet.
NavigationsebenenDie hierarchischen Ebenen einer Inhalts- bzw.
Navigationsstruktur einer Internetpräsenz.
Netscape NavigatorEin von der Firma Netscape entwickelter
Y Browser für die Navigation und Darstellung
von Inhalten im Internet.
NutzungsrechtDie von einem Urheber genehmigte Nutzung
eines Werks. Die vom Nutzer (in der Regel
dem Auftraggeber) zu zahlende Vergütung
ist vom Grad der Nutzung abhängig: Die Nut-
zung (in der Regel eine Veröffentlichung)
kann pauschal und ausschließlich eingeräumt
werden oder auf ein Medium, einen bestimm-
ten Zweck oder Zeitraum beschränkt sein.
NeuauftrittDie Gestaltung einer neuen Internetpräsenz.
NewsletterEin Mitteilungsblatt einer Institution oder ei-
nes Unternehmens, das über aktuelle Ent-
wicklungen und Produkte informiert. Der
elektronische Newsletter wird häufig als In-
strument des Web-Marketings per Y E-Mail
an die Empfänger versandt.
O
OfflineDie unterbrochene oder nicht existente Ver-
bindung zu einem Netzwerk oder einem an-
deren Computer.
OnlineDie bestehende Verbindung zu einem Netz-
werk oder einem anderen Computer.
Online-MedienZusammenfassender Begriff für Anwendun-
gen auf der Basis von Internettechnologien
(Internet, Intranet).
P/Q
PDA Die Abkürzung für „Personal Digital Assi-
stant“, der digitale, mobile Endgeräte im
„Westentaschenformat“ beschreibt. Neben
elektronischen Organizern gibt es mittler-
weile eine Vielzahl von Kombinationen digi-
taler Geräte, wie Handys mit erweiterten
Multimedia-Funktionen oder „Pocket PCs“,
die unter die Kategorie PDA fallen.
PDFDie Abkürzung für „Portable Document For-
mat“ , ein Dateiformat, das alle Eigenschaf-
ten eines gedruckten Dokumentes in elektro-
nischer Form beinhaltet. Zur Anzeige von
PDFs wird das Programm „Acrobat Reader“
benötigt, das für eine große Anzahl unter-
schiedlicher Betriebssysteme zur Verfügung
steht.
Pixel (px)Das Kurzwort von „Picture Element“. Ein Pixel,
häufig auch Bildpunkt genannt, ist das klein-
ste grafische Element bei der Darstellung von
Bitmap-Grafiken, zum Beispiel auf Monitoren
oder im Druck von Grafiken und Fotos.
Pixelorientierte GrafikEine aus Y Pixeln zusammengesetzte Grafik,
bei der im Gegensatz zu Y Vektorgrafiken alle
Bildpunkte nach einem festen Raster ange-
ordnet sind.
Plug-inEin Plug-in ist ein Software-Baustein, der in
bereits installierte Programme integriert
wird, um deren Funktionalität zu erweitern.
PNGDie Abkürzung für „Portable Network Gra-
phics“, ein lizenzfreies Grafikformat. Es unter-
stützt die Darstellung von 16 Mio. Farben, die
verlustfreie Kompression und eine inkremen-
telle Anzeige der Grafik (erst Grobstruktur, bis
Datei ganz übertragen ist). PNG ermöglicht
außerdem das Erkennen beschädigter Dateien.
PrimärfarbenIm YCorporate Design der Bundesregierung
werden als Primärfarben die aus der Staatsfah-
ne der Bundesrepublik Deutschland abgeleite-
ten Farben Schwarz, Rot und Gelb verstanden.
PrintmedienAlle gedruckten Medien, unabhängig vom
angewendeten Druckverfahren.
Point oder Punkt (pt)Das standardisierte typografische Maß für
Schriftgrößen und Zeilenabstände. 1 Point =
1/72 Inch = 0,353 mm.
Pull-downEine Variante der Präsentation von Naviga-
tionsmenüs, bei der eine Palette mit Menü-
punkten nach unten aus einem Navigations-
element im Identitätsbereich herausge-
klappt werden kann.
66 G l o s s a r
R
Rastereinheit (RE)Ein Element, Höhe x Breite, aus dem sich ein
Raster aufbaut.
Readme-DateiEine Textdatei mit wichtigen Informationen
über das Programm, seine Installation und
die Nutzungsrechte. Die Readme-Datei sollte
unbedingt vor dem ersten Programmstart
gelesen werden.
RecommendationsVon den Gremien des W3-Konsortiums veröf-
fentlichte technische Beschreibungen einzel-
ner Web-Technologien wie YHTML, Y CSS
oder XML. Diese Empfehlungen (Recommen-
dations) haben im Internet in Bezug auf ihre
Verbindlichkeit die höchste Priorität. Siehe
auch „Technische Standards“ im Kapitel „Zu-
satzinformationen“.
RGBDie Abkürzung für die Grundfarben Rot,
Grün, Blau zur Farbdarstellung auf Monito-
ren. Aus diesen Farben lassen sich alle weite-
ren, am Bildschirm sichtbaren Farben mi-
schen. Siehe auch Y Additives Farbsystem.
Röhrenmonitor Bildschirme, bei denen eine aus Subpixeln in
den drei Grundfarben Rot, Grün und Blau be-
stehende Phosphorschicht durch drei
Elektronenstrahlen zum Leuchten angeregt
wird. Um einen Bildpunkt (Y Pixel) einer be-
stimmten Farbe zu erzeugen, werden die
drei Strahlen auf benachbarte Subpixel ge-
lenkt, wobei die Farbmischung durch die In-
tensität der Strahlen bestimmt wird.
S
SäulenelementDas in den Farben der Staatsfahne oder in
Graustufen umgesetzte Bildelement der
Y Bildwortmarke der Bundesregierung.
SchriftartDie Summe der Gemeinsamkeiten einer
Schrift. Je nach Gruppierungsschema wird ei-
ne Schriftart nach Schriftgattung/-klassifika-
tion (Grotesk/serifenlos oder Antiqua/mit Se-
rifen), nach Schriftfamilie (Times New Roman
oder Verdana) oder nach Schriftauszeich-
nung (kursiv oder Kapitälchen) unterschie-
den. Um die Ladezeiten des Browsers zu ver-
kürzen, werden Internetseiten häufig mit Sy-
stemschriften gestaltet. Da nicht sicherge-
stellt ist, dass alle Systemschriften auf dem
Rechner des Nutzers installiert sind, müssen
alternative Schriften bei der Programmie-
rung einer Internetpräsenz berücksichtigt
werden. Sollen Texte in einer Groteskschrift,
zum Beispiel der Verdana, angezeigt werden,
so sollte der Wert der FONT-FAMILY-Anwei-
sung des Y CSS mehrere nachfolgende
Schriftarten berücksichtigen. Im Y Corporate
Design der Bundesregierung sind dies: Verda-
na, Helvetica, Arial, Tahoma, Sans Serif (neu-
trale Angabe für serifenlose Schriftarten). Ist
keine der definierten Schriftarten verfügbar,
wird die jeweils eingestellte Standard-
Schriftart in den Browservoreinstellungen
(Y Browser) angezeigt. Der Nutzer kann
durch eigene Einstellungen die dargestellte
Schriftart und -größe verändern.
SchriftgrößeDie in Point/Punkt (1 Point (pt) = 0,353 mm)
gemessene Darstellungsgröße einer Schrift.
Bei den Internetpräsenzen und Online-
Anwendungen der Bundesregierung sind
die Schriftgrößenangaben von Point und
Pixel identisch: 1 Point/pt = 1 Pixel/px.
SchriftlizenzDas durch einen Kauf erworbene Nutzungs-
recht an einer Schrift.
SchutzzoneEin definierter Freiraum um ein Markenzei-
chen, in dem weder Text noch weitere grafi-
sche Elemente (zum Beispiel Bilder oder
Fremdlogos) platziert werden dürfen. Die
Schutzzone ermöglicht damit die repräsen-
tative Wirkung eines Zeichens. Die Y Bild-
wortmarke der Bundesregierung ist von einer
Schutzzone umgeben, die in diesem Y Style-
guide näher festgelegt wird.
ScreenDer sichtbare, die Inhalte darstellende Be-
reich eines Monitors. Die Größe eines Screens
wird nach seiner in Inch gemessenen Bild-
schirmdiagonalen benannt (Y Bildschirmauf-
lösung).
ScrollbarEngl. für „Bildlaufleiste“. Bedienelement der
Benutzeroberfläche eines Computerpro-
gramms, das den sichtbaren Bereich eines
Fensters verschiebt. Besteht aus zwei Pfeilen
und einer so genannten Rollbox. Horizontale
und vertikale Bildlaufleisten werden nach Be-
darf eingeblendet, wenn die darzustellende
Seite die Größe des Y Viewports übersteigt.
Screen-AufteilungDie Raumaufteilung einer Website, zum Bei-
spiel in Bereiche.
SekundärfarbenIm Corporate Design der Bundesregierung
wird unter den Sekundärfarben ein Farbklima
verstanden, das die Y Primärfarben ergänzt.
Die Sekundärfarben bestehen aus einem
Hauptfarbton in unterschiedlichen Sättigun-
gen und Abstufungen.
ServerEin Computer, der Clients in einem Netzwerk
Daten zur Verfügung stellt. Im Internet wer-
den bestimmte Dienste durch spezielle Inter-
net-Server angeboten, zum Beispiel Web-Ser-
ver, Mail-Server (POP3-Server/SMTP-Server)
oder News-Server (NNTP-Server).
SidebarEngl. für „Seitenleiste“. In den meisten
Y Browsern verfügbare, optional neben dem
Y Viewport einblendbare Seitenleiste, in der
z. B. Favoriten, Verlauf, Downloads des Nut-
zers oder auch YHTML-Dokumente angezeigt
werden.
SiteDas Kurzwort für die Website, der Gesamt-
heit der Internetseiten eines Anbieters.
SitemapDer Aufbau und die Seitenstruktur einer
Internetpräsenz. Auf vielen Websites wird die
Sitemap durch einen eigenen Menüpunkt
dargestellt.
SpalteEin vertikal angeordneter Bereich zur Auf-
nahme von Texten oder Bildern. Im Content-
bereich der Internetpräsenzen und Online-
Anwendungen der Bundesregierung sind
unterschiedliche Spaltenanordnungen/Spal-
tenraster vorgesehen.
SpaltenbreiteBreite einer Text- oder Bildspalte.
Spationieren/SpationierungDas Erweitern der Y Laufweite einer Schrift.
SprungmarkenLinks, die die Navigation innerhalb einer
Website ermöglichen, zum Beispiel die Rück-
kehr von einem Textende zum Seitenanfang.
StilvorlagenIn einer Y Musterdatei gespeicherte Angaben
der benutzten Schriftschnitte und -größen
sowie zu definierten Farben. Bei der Gestal-
tung von Websites können Y CSS (Cascading
Style Sheets) als Stilvorlagen verwendet wer-
den.
StyleguideAuch: Corporate-Design-Manual. Ein Werk,
das alle Angaben zum Y Corporate Design
und dessen Umsetzung in allen relevanten
Printmedien und elektronischen Medien ver-
mittelt.
SubnavigationDie hierarchisch tieferen Ebenen der Naviga-
tion.
SuchmaschineAuch: Search-Engine. Ein Programm, das
nach Eingabe von Suchbegriffen oder -kateg-
orien das Internet nach relevanten Texten
und Bildern durchsucht.
SymbolleisteEine Leiste mit Symbolen (Y Icons), die nach
einem Mausklick fest definierte Funktionen in
einem Programm oder Betriebssystem aus-
führen. Einige Programme, zum Beispiel
Y Browser, verfügen über mehrere Symbol-
leisten, die nach Bedarf aktiviert oder ver-
deckt werden können.
SystemschriftEine im Betriebssystem installierte und von
ihm zur Darstellung benötigte Schrift, zum
Beispiel Times, Arial, Verdana (Windows) oder
Geneva, Chicago oder Monaco (Apple Macin-
tosh).
T
TagFormatierungsanweisungen in einem
YHTML-Dokument.
TemplateDas englische Wort für eine YMusterdatei.
TextversionEine Umsetzung einer gesonderten Textver-
sion wird durch den Einsatz von Y CSS und
unter Berücksichtigung der Anforderungen
der Y BITV in der Regel unnötig.
TFTDie Abkürzung für „Thin Film Transistor“, ei-
ner Technik zum Ansteuern von LCDs. Dazu
wird auf einer Glasscheibe des Displays für je-
den Pixel ein eigener, einzeln ansteuerbarer
Transistor aufgebracht. Die Technik erlaubt
eine hohe kontrastreiche Darstellung und ei-
ne geringere Trägheit der Anzeige.
TypografieDie Lehre von der funktionalen und ästheti-
schen Gestaltung von Schriften und ihrer An-
wendung in Printmedien und elektronischen
Medien. Im Y Corporate Design dient die
Wahl und einheitliche Anwendung eines spe-
zifischen Schrifttyps (der Hausschrift) der
Verbindung aller visuellen Auftritte. Daher
sollten auch die Internetauftritte der Bundes-
regierung in der Typografie einander ange-
glichen werden.
U
URLDie Abkürzung für „Uniform Resource Loca-
tor“. Eine URL bezeichnet die Adresse einer
Ressource im Internet eindeutig. Dabei ist es
gleichgültig, ob es sich um ein Bild, eine Home-
page, ein Video oder einen Sound handelt.
Um eine Ressource anzeigen zu lassen, wird
die URL in das Adressfeld des Y Browsers ein-
getragen. Die Adresse setzt sich aus mehre-
ren standardisierten Bestandteilen zusam-
men: Protokoll, Server-Name, Länderkürzel,
Verzeichnis und Dateiname. Die Reihenfolge
der Bestandteile ist verbindlich festgelegt.
V
Vektorgrafik Aus Pfaden, ihren Positionen, Anordnungen,
Füllungen und Farben erstellte Grafiken. Vek-
torgrafiken haben geringere Dateigrößen als
pixelorientierte Grafikformate und lassen
sich in ihren Größen verändern. Aufgrund des
geringen Speichervolumens werden Vektor-
grafiken auch im Internet, zum Beispiel für
Flash-Animationen, angewandt.
VersalienDie Großbuchstaben einer Schrift.
ViewportEngl. für „Darstellungsfeld“. Bereich eines
Y Browserfensters, in dem die aktuelle Seite
dargestellt wird. Die Größe des Viewports ist
von der Fenstergröße des Browsers, even-
tuell eingeblendeten Y Scrollbars und Y Side-
bars und Navigationsleisten des Browsers ab-
hängig. Durch Nutzung der Scrollbars kön-
nen beschnittene Bereiche in den Viewport
geschoben werden.
Visited und Unvisited LinksEngl. für „besuchte und unbesuchte Ver-
weise“. YHTML-Auszeichnung von Textlinks,
durch die bereits „besuchte“ Links eine ande-
re Farbe erhalten als „unbesuchte“ (YHyper-
link).
VisitsVisits ist das englische Wort für Besuche. Ein
Visit bezeichnet den Besuch auf einer Inter-
netseite. Im Unterschied zur „Page Impres-
sion“ wird hier nur der Besuch auf der Web-
seite gezählt und nicht das Anwählen der ein-
zelnen Seiten. Die Anzahl der Visits spielt ei-
ne große Rolle bei der kommerziellen Ver-
marktung von Online-Auftritten.
W/X/Y/Z
W3C oder W3-Konsortium –
World-Wide-Web-ConsortiumDas 1994 gegründete, internationale und un-
abhängige Industriekonsortium ist mit der
Weiterentwicklung von Standards und Nor-
mie-rungen im World Wide Web befasst. Vom
W3-Konsortium herausgegebene Recom-
mendations (Empfehlungen) sind Dokumen-
te mit der höchsten im Web gültigen Ver-
bindlichkeit, zum Beispiel Beschreibungen
einzelner Web-Technologien wie YHTML,
Y CSS oder XML. Die Empfehlungen haben
die Aufgabe, die jeweilige Technologie voll-
ständig und unmissverständlich darzustellen.
Die Zielgruppen dieser Beschreibungen sind
Web-Autoren und Software-Produzenten,
die gehalten sind, Standards so genau und
vollständig wie möglich in ihre Produkte zu
implementieren. Die Entwicklung einer Tech-
nologie ist mit der Veröffentlichung der Emp-
fehlungen noch nicht abgeschlossen, denn
es handelt sich um festgeschriebene Ent-
wicklungsstadien, um Entwicklern Fixpunkte
zu geben, an denen sie sich orientieren kön-
nen. Die Empfehlungen erhalten deshalb,
ähnlich den Software-Produkten, Versions-
nummern, zum Beispiel HTML 4.01, CSS 2.0
oder XML 1.0. Sämtliche Empfehlungen des
W3-Konsortiums sind über die Web-Adresse
http://www.w3.org/TR/ erreichbar (das „TR“
steht für Technical Report). Sämtliche Doku-
mente werden in englischer Sprache veröf-
fentlicht; die englischsprachige ist die nor-
mative Version. Viele der Dokumente sind in
68 G l o s s a r
andere Sprachen übersetzt worden. Überset-
zungen sind über die Adresse
http://www.w3.org/Consortium/Translation/
erreichbar.
Web-DesignDer Entwurf und die Erstellung von Internet-
seiten.
WortmarkeDas auf einem reinen Schriftzug basierende
Zeichen für eine Institution oder ein Unter-
nehmen.
WWWDie Abkürzung für „World Wide Web“, oft
auch als W3 oder Web bezeichnet. Das WWW
ist ein multimediales Hypertext-Informa-
tionssystem im Internet. Es wurde 1992 am
Europäischen Kernforschungszentrum in
Genf entwickelt.
ZeichensatzDie Gesamtheit der Buchstaben, Ziffern,
Interpunktions- und Sonderzeichen einer
Schrift.
ZeilenabstandDer von Schriftlinie zu Schriftlinie gemessene
Abstand zwischen zwei Textzeilen.
Alle Nutzungs- und Verwertungsrechte dieses Styleguides liegen
beim Presse- und Informationsamt der Bundesregierung (BPA). Der Ge-
brauch dieses Dokuments ist nur mit der Zustimmung des BPA zulässig.
© Presse- und Informationsamt der Bundesregierung, 2004
Presse- und Informationsamt der Bundesregierung
Corporate-Design-Beauftragter
E-Mail: [email protected]
Der Styleguide für Onlinemedien sowie alle weiteren Corporate-
Design-Manuals sind unter http://styleguide.bundesregierung.de verfügbar.
Die Manuals
- Basiselemente
- Druckschriften
- Geschäftsausstattung Standard
- Geschäftsausstattung Pressesachen
können beim Presse- und Informationsamt bestellt werden:
Presse- und Informationsamt der Bundesregierung
Dorotheenstraße 84
10117 Berlin
E-Mail: [email protected]
Der Styleguide wurde auf der Grundlage des Beschlusses des
Bundeskabinetts vom 2. Juni 1999 für das
- Bundeskanzleramt
- das Presse- und Informationsamt der Bundesregierung
- und die Bundesministerien
entwickelt.
Geltungsbeginn ist das Datum der Online-Stellung des Styleguides
(Dezember 2002). Seine Angaben sind spätestens bei der Realisierung eines
Neuauftritts bzw. dem Redesign einer Internetpräsenz zu berücksichtigen.
Impressum
70 I m p r e s s u m