Logostreifen und Designsystem
Unser Designsystem ist selbstbewusst, vielfältig wandelbar und einfach anzuwenden. Mit dem Logostreifen definieren wir einen klaren Absender: wir setzen damit einen grossen gemeinsamen visuellen Nenner und stärken die Marke «Stadt Zürich». Durch ein horizontales Raster bleibt das System flexibel und einfach in der Anwendung. Die zur Verfügung gestellten Vorlagen sind bereits entsprechend aufgebaut.
- Der Logostreifen
- Logostreifen Print
- Standardformate Print
- Logostreifen im dynamischen digitalen Raum
- Logostreifen auf dreidimensionalen Objekten
- Anpassung des Logostreifens bei abweichenden Formaten
- Spezialformate
- Ausdruck am Bürodrucker
- Stanzungen, Aufhängungen, grosser Beschnitt
- Der 5er-Raster
- Textausrichtung am Logo
Der Logostreifen
Zentrales Element des Erscheinungsbildes ist der Logostreifen: er bildet sozusagen die visuelle Klammer. Er ist so ausgelegt, dass er sich jeder Kommunikationsanwendung flexibel anpasst, egal welches Medium oder Format umgesetzt wird. So schafft er die nötige Wiedererkennung für einen einheitlichen Auftritt.
Der Logostreifen ist in zwei Bereiche eingeteilt: in die weisse Logozone mit dem Logo, und in den Farbfläche. Für die Proportionen des Logostreifens gibt es genaue Regeln, diese finden Sie weiter unten.

Logozone
Bei Farbanwendungen kommt immer das blaue Logo auf weissem Hintergrund zur Anwendung. Die Grösse und Platzierung des Logos entnehmen Sie bitte der passenden Vorlage bzw. der Tabelle Standardformate Print. Ausser dem städtischen Logo darf kein Inhalt (Text oder andere Logos) in der Logozone stehen.
Farbfläche
Der zweite Teil besteht aus einer einfarbigen Farbfläche. Die Farbe ist zielgruppenspezifisch oder je nach Kommunikationsbedürfnis frei wählbar aus der Farbpalette. In die Farbfläche dürfen keine Elemente integriert werden – weder Bild noch Text.





Abgrenzung
Die weisse Logozone muss sich optisch als solche abgrenzen. Stellen Sie deshalb sicher, dass der Inhalt Ihres Layouts einen ausreichenden Kontrast bietet (sonst verschwindet die Form).





Logostreifen Print
Gestaltung
Der Logostreifen hat in den jeweiligen Hoch- und Querformaten eine klar definierte Höhe und Breite. Bei Hochformaten ist das Verhältnis zwischen Logozone und Farbfläche 1:1, bei Querformaten (ab DIN A6 und grösser) wird die Breite der Farbfläche erweitert und dem Format angepasst.


Ein Quadrat zählt noch als Hochformat und hat einen Logostreifen im Verhältnis 1:1. Alle Formate, die breiter als hoch sind, zählen als Querformat, die Farbfläche ist entsprechend breiter als die Logozone.


Positionierung
Der Logostreifen wird standardmässig oben positioniert. Dies gilt hauptsächlich für redaktionell, umfassendere Printprodukte wie Broschüren und Factsheets. Bei kommunikativeren Anwendungen wie Plakaten und Flyern kann der Logostreifen passend zu Ihrem Layout oben oder unten positioniert werden.
Für den Logostreifen im Fussbereich gelten die gleichen Regeln wie in der Anwendung im Kopfbereich. Bitte entnehmen Sie die Positionierung des Logostreifens den entsprechenden Musterseiten der Indesign-Vorlagen.


Standardformate Print
Für die gängigen Printformate sind die korrekte Position, Höhe und Breite des Logostreifens definiert und in den Vorlagen hinterlegt. Diese Werte sind zwingend beizubehalten.

Vorlagen für Standardformate:
- DIN A0, A1, A2, A3, A4, A5, A5 quer, A6, A6/5
- F4, F12, F200
- Kreditkarte / Pocketflyer
Vorlagen für Formate mit produktionsbedingten Abweichungen:
- A4-Broschüre mit Rand (für Büro-Ausdruck)
- Tramplakat
- Metallaufsteller (1000 x 1200 mm)
Vorlagen für Sonderformate:
- Blache (3000 x 1800 mm)
Logostreifen im dynamischen digitalen Raum
Gestaltung
Digital kann der Logostreifen auch animiert werden. Erscheint das Logo als Absender zum Schluss eines animierten Kommunikationsmittels, so wird das gesamte Format genutzt. Es sind also keine festen Höhen und Breiten definiert, sondern es gilt die Flächenaufteilung von Logozone und Farbstreifen basierend auf einem 5er- (bzw. 10er-) Raster.
Für Angaben zur Animation des Logostreifens siehe Kapitel Bewegtbild. Für Social Media kommen Icons mit einer definierten Sonderform des Logostreifens zum Einsatz.


Für statische Umsetzungen oder einfache gif-Animationen, deren Layout aus dem Printbereich abgeleitet sind, können auch die Vorgaben zu Logostreifen Print angewandt werden.
Positionierung
Der Logostreifen nutzt standardmässig das gesamte Format. Bei Querformaten wird der Farbstreifen zwingend seitlich platziert – niemals unterhalb des Logos. Bei Hochformaten wird der Farbstreifen verbindlich unterhalb des Logos platziert und nicht daneben.




Logostreifen auf dreidimensionalen Objekten
Hinweise auf den möglichen Umgang mit dem Logostreifen bei dreidimensionalen Objekten finden sich unter Anpassung des Logostreifens bei abweichenden Formaten bzw. Spezialformate sowie im Kapitel Anwendungen.
Anpassung des Logostreifens bei abweichenden Formaten
Weicht Ihr Format von den Standardformaten ab, ist allenfalls eine Anpassung des Logostreifens nötig. Massgeblich ist die Formatbreite. Entscheidend ist auch, ob es sich um ein Hoch- oder ein Querformat handelt.
Einige Beispiele von Umsetzungen in abweichenden Formaten finden Sie in der Galerie in den Einzelelementen bzw. bei den Inseraten.
Die Breite Ihres Formats entspricht einem Standardformat, aber die Höhe weicht ab?
Verwenden Sie den Logostreifen des Standardformats ohne Änderungen. Der 5-er Raster wird auf die neue Höhe angepasst.
Die Breite Ihres Formats liegt sehr nahe an einem Standardformat?
Weicht die Breite Ihres Formats höchstens 10% von der Breite eines Standardformats ab, wird nur die Breite des Logostreifens angepasst. Behalten Sie dabei die Position des Logos sowie das 1:1-Verhältnis von Logozone und Farbfläche bei.
Spezialformate
Wenn Ihr verfügbares Format extrem klein oder schmal ist – beispielsweise bei Inseraten oder Bannern – wird der Logostreifen nicht funktionieren. Je mehr Fläche Sie für Ihre Komposition zur Verfügung haben, desto erfolgreicher kann der Logostreifen eingesetzt werden. Wir empfehlen daher den Einsatz grosszügigerer Formate, die der Kommunikation den nötigen Raum verschaffen und mehr Aufmerksamkeit erreichen.

Grundlagen
Können speziell kleine oder schmale Formate nicht verhindert werden, gibt es alternative Anwendungsmöglichkeiten des Logoeinsatzes.

Ihr Format ist sehr klein?
Behalten Sie die Logozone in ihrer originalen Höhe und Breite bei. Passen Sie die Breite des Farbstreifens an.

Ihr Format ist sehr schmal?
Ist das Format so schmal, dass kein Platz mehr für den Farbstreifen besteht – oder er als solcher nicht mehr erkennbar ist – wird er weggelassen. Behalten Sie jedoch die Logozone in ihrer dem Format entsprechenden Höhe und Breite bei.

Ihr Format ist sehr breit?
Sofern das Format nur eine geringe Höhe aufweist, können Inhalte links im Format platziert werden und der Logostreifen rechts. Diese Anwendung orientiert sich am animierten Umgang mit dem Logostreifen und ist nur in absoluten Ausnahmefällen zu verwenden. Achten Sie darauf, dass der Inhalt den Logostreifen nicht konkurriert.

Ihr Format ist rund?
Bei runden Formaten, zum Beispiel einem Kleber, wird der Farbstreifen weggelassen. Das Logo steht auf weissem Grund.
Für runde Social-Media-Icons gibt es Vorlagen.
Extreme Hochformate
Bei Rollups, Windflags und Stelen sind sehr grosse, schmale Hochformate häufig. Prüfen Sie immer, ob der gesamte Logostreifen platziert werden kann. Es kann aber sein, dass auf diese Weise das Logo nicht prägnant genug erscheint, auch weil der Betrachtungsabstand gross ist. Es gibt mehrere Möglichkeiten, mit dem Logostreifen umzugehen.

Das Format ist zwar hoch, bietet aber genug Raum für den Logostreifen.
Der Logostreifen wird wie für ein normales Hochformat angewendet. Orientieren Sie sich für die Grösse der Logostreifens an dem Standardformat, das Ihrem Format am nächsten ist und gehen Sie allenfalls gemäss Anpassung des Logostreifens bei abweichenden Formaten vor.

Der Farbbereich wird weggelassen.
Behalten Sie jedoch die Logozone in ihrer dem Format entsprechenden Höhe und Breite bei. Orientieren Sie sich für die Grösse der Logozone an dem Standardformat, das Ihrem Format am nächsten ist.

Werden mehrere Hochformate miteinander platziert, können sie sich mit dem Logostreifen ergänzen. Beispielsweise kann die Farbfläche über das zweite und dritte Format gezogen werden. Auf diese Art ist beispielsweise die Vorlage für das Standardformat F12 angelegt.

Der Logostreifen wird am unteren Formatrand «gestapelt».
Diese Anwendung orientiert sich am dynamischen Umgang mit dem Logostreifen und ist nur in Ausnahmefällen zu verwenden. Achten Sie darauf, dass der Inhalt den Logostreifen nicht konkurriert. Die Flächenaufteilung basiert auf einem 5-er (bzw. 10er-) Raster.
Extreme Querformate
Bei Fensterklebern und Bannern sind sehr breite Querformate häufig. Der Umgang mit dem Logostreifen hängt davon ab, wie hoch das Format ist, also ob sich ein sinnvoller Raum für den Inhalt ergibt, wenn Logostreifen und Inhalt übereinander stehen.

Die Höhe des Formats bietet genügend Raum für den Inhalt.
Der Logostreifen wird wie für ein normales Querformat angewendet. Orientieren Sie sich für die Grösse der Logozone an dem Standardformat, das Ihrem Format am nächsten ist.

Die Höhe des Formats lässt keinen Raum für den Inhalt.
Der Inhalt kann links im Format platziert werden und der Logostreifen rechts. Diese Anwendung orientiert sich am dynamischen Umgang mit dem Logostreifen und ist nur in Ausnahmefällen zu verwenden. Achten Sie darauf, dass der Inhalt den Logostreifen nicht konkurriert. Die Flächenaufteilung basiert auf einem 10er-Raster.
Ausdruck am Bürodrucker
Wenn Sie einen Standard-Bürodrucker verwenden und den endgültigen Druck nicht zuschneiden können, verwenden Sie die speziellen Vorlagen mit definiertem Druckrand. Es gibt Office-Vorlagen (Word und Powerpoint) und Indesign-Vorlagen.


Stanzungen, Aufhängungen, grosser Beschnitt
Der Logostreifen erfordert eine randabfallende Platzierung und die Möglichkeit zum Beschnitt. In manchen Fällen gerät der Logostreifen jedoch in Konflikt mit Vorgaben aus der Produktion, seien es Stanzungen oder Ösen für die Aufhängung oder ein vergrösserter Beschnitt.
- Prüfen Sie, ob der Logostreifen unten (bzw. oben) positioniert werden kann, wo er nicht betroffen ist. (Dies wurde beispielsweise bei der Vorlage zum Standardformat Tramplakat berücksichtigt.)
- Die Höhe des Logostreifens ist fix und wird nicht verändert.
- In absoluten Ausnahmefällen ist eine minime manuelle Veränderung des Stands des Logos nötig, um zu vermeiden, dass beispielsweise Aufhängungsösen zu nahe am Logo stehen. (Die Vorlage für Metallaufsteller wurde entsprechend optimiert.) Kontaktieren Sie bei Unsicherheiten gerne die CD-Fachstelle.


Der 5er-Raster
Die horizontale Einteilung des Formats in Farb- beziehungsweise Bildbereiche ist ein zusätzliches charaktergebendes Element unseres Auftritts. Der 5er-Raster gibt dem Layout von Titelseiten, Plakaten, Banner Ads und weiteren kommunikativ ausgerichteten Publikationen gerade genug Struktur und Führung, damit Sie sich auf Ihre kreative Idee konzentrieren können. Der 5er-Raster kann zudem auf die meisten Oberflächen, 3-D-Objekte und Architektur angewandt werden.
Konstruktion des 5er-Rasters
Der 5er-Raster teilt Ihr Format in fünf gleich grosse Bereiche ein. Dabei ist der Bereich des Logostreifens von der verfügbaren Fläche ausgeschlossen.


Feinere Einteilung
Die horizontale Einteilung in fünf Bereiche ist für die meisten Layouts ausreichend. Bei Bedarf kann das Format jedoch noch weiter in 10 Einheiten unterteilt werden.


Textausrichtung am Logo
Für eine klare Struktur im Layout wird der Text immer linksbündig am Logo ausgerichtet. Hierbei stehen drei Varianten zur Verfügung: die Ausrichtung an der Bildmarke links, an der Bildmarke mittig oder an der Wortmarke «Stadt Zürich».