Digitale Medien

Hier finden Sie medienspezifische Regeln und Vorgaben für Webanwendungen, Social Media, Email-Signaturen und Apps.

Musterbeispiel Website.

Webanwendungen

Das visuelle Erscheinungsbild der Bundesregierung beruht auf einem einheitlichen Gestaltungsprinzip, welches in allen Webanwendungen für einen hohen Wiedererkennungswert sorgt.

2 Ansichten Smartphone-Screen mit Musterbeispiel Social Media.

Social Media

Der Social-Media-Auftritt ist ein probates Kommunikationsmittel für den schnellen Austausch im Internet.

2 Ansichten Desktop mit Musterbeispiel Emailabsender.

E-Mail

Das homogene Layout des meistgenutzten Kommunikationsmediums sorgt für die bestmögliche Rezeption und eine eindeutige Übermittlung des Absenders. 

2 Ansichten Smartphone-Screen mit Musterbeispiel App.

Apps

Eine konsistente und nutzerzentrierte Gestaltung hebt die Nutzerfreundlichkeit und damit die Akzeptanz aller Software-Applikationen der Bundesregierung.

2 Ansichten der Kennzeichnung digitaler Produkte: Webanwendung und mobile Webanwendung

Kennzeichnung digitaler Produkte

Um die Wiedererkennbarkeit bei digitalen Produkten und Portalen zu gewährleisten, liegen zwei unterschiedliche Darstellungsformen zur Kennzeichnung vor: die Option "Wortmarke" und die Option "Register", welche stets in Verbindung mit der Bildwortmarke verwendet werden.

Aufbau

Bei der Option „Register“ wird die Produktkennzeichnung auf einer Trägerfläche mit abgerundeten Ecken platziert. Die Rundung der Ecken beträgt 30 px. Es ist darauf zu achten, dass die Bildwortmarke und die Trägerfläche mit der Produktkennzeichnung untereinander platziert werden. Bei ausreichender verfügbarer Breite können beide Elemente nebeneinander stehen.  Die Farbe der Trägerfläche kann aus dem Farbspetkrum der Bundesregierung frei gewählt werden. Hierbei ist auf die Barrierefreiheit zu achten. Die Zeichenfarbe wird, je nach Hintergrund, in Weiß oder Schwarz gehalten und steht immer zentriert zur Gesamtfläche.

Die Produktkennzeichnung wird in der BundesSans Bold in Versalien gesetzt, mit einer Laufweite von 50. Diese steht immer zentriert innerhalb der Trägerfläche, es sei denn, die Trägerfläche wird interaktiv genutzt. Durch die Skalierbarkeit der Trägerfläche finden ebenso lange Kennzeichnungsnamen ihren Platz. Bei der optionalen, interaktiven Nutzung der Trägerfläche, werden mehrere Reiter nebeneinander platziert. Diese können unterschiedlich farbig hervorgehoben werden (siehe Anwendungsbeispiele).

Je nach Anwendung, Platzierung und verfügbarer Fläche kann die Trägerfläche in ihrer Darstellung verändert werden. Wird die Trägerfläche unter der Bildwortmarke positioniert, befinden sich die abgerundeten Ecken oben an der Trägerfläche. Innerhalb der Portalanwendung kann die Trägerfläche neben der Bildwortmarke stehen. In diesem Fall befinden sich die abgerundeten Ecken oben. Ebenfalls innerhalb der Portalanwendung kann die Produktkennzeichnung zusammen mit der Minimalversion der Bildwortmarke genutzt werden oder, im Falle von sehr wenig Platz, kann die Produktkennzeichnung ausnahmsweise ohne Bildwortmarke verwendet werden. So kann die Produktkennzeichnung flexibel eingesetzt werden. 


Positionierung der Produktkennzeichnung innerhalb der Trägerfläche

Positionierung der Produktkennzeichnung innerhalb der Trägerfläche


Skalierbarkeit der Trägerfläche

Skalierbarkeit der Trägerfläche



Positionierung der Produktkennzeichnung neben der Bildwortmarke (nur innerhalb der Portalanwendung)

Positionierung der Produktkennzeichnung neben der Bildwortmarke (nur innerhalb der Portalanwendung)



Positionierung der Produktkennzeichnung innerhalb der Trägerfläche (Platzsparende Version, diese Versionen sind nur für interne Ansichten der Portale vorgesehen.)

Positionierung der Produktkennzeichnung innerhalb der Trägerfläche (Platzsparende Version, diese Versionen sind nur für interne Ansichten der Portale vorgesehen.)



Positionierung der Produktkennzeichnung neben der Bildwortmarke (Platzsparende Version, diese Versionen sind nur für interne Ansichten der Portale vorgesehen.)

Positionierung der Produktkennzeichnung neben der Bildwortmarke (Platzsparende Version, diese Versionen sind nur für interne Ansichten der Portale vorgesehen.)


Anwendungsbeispiele

Im Folgenden werden verschiedene Anwendungen der Produktkennzeichnung zur Veranschaulichung der Flexibilität dargestellt.

Bookmark-Icon mit Produktkennzeichnung

Bei der Darstellung des Bookmark-Icons für die Option „Register“ wird die Produktkennzeichnung unten in eine farbige Trägerfläche gesetzt. Die Farbe kann unter Berücksichtigung der Barrierefreiheit beliebig gewählt werden. Die Höhe der Trägerfläche kann je nach Länge der Produktkennzeichnung angepasst werden. Sie sollte jedoch nicht über die Hälfte der Höhe des Bookmark-Icons einnehmen. Der Behördenname oder das amtliche Kürzel werden oberhalb platziert. 

Umsetzungsbeispiele


Bookmark-Icon „Register“

Bookmark-Icon „Register“

Exemplarische Darstellung der Bookmark-Icons auf dem Screen

Exemplarische Darstellung  der Bookmark-Icons auf dem Screen