Was sind responsive Logos und warum Sie eines brauchen

Das Responsive Design ist nicht nur etwas für Websites – dieser Ansatz zur Gestaltung kann auch auf Firmenlogos angewendet werden. Das ist zwar nicht grundsätzlich neu, aber immer mehr Unternehmen führen inzwischen responsive Logos in ihr Branding ein.

Und warum?

Responsive Logos lösen eines der größten digitalen Designprobleme: Klarheit und Lesbarkeit bei unterschiedlichen Größen. So bleibt Ihr Markenerlebnis sowohl bei Print-, Werbe- und Webmedien als auch bei verschiedenen Darstellungsgrößen erhalten.

Bei der Gestaltung von Webseiten steht der Designer vor der Herausforderung, dass diese später mit unterschiedlichen Geräten betrachtet werden können und auch sollen. Die Unterschiede in der Auflösung sind dabei zwischen einem Smartphone, einem Tablet und einer hochauflösenden Grafikarte für den Computer so groß, dass eine einfache Skalierung der Webseiteninhalte auf die entsprechende Auflösung nicht funktioniert – insbesondere, weil mobile Endgeräte auch noch zwischen Hoch- und Querformat wechseln können.

Zur Lösung dieses Problems wurde daher das "Responsive Design" eingeführt. Es handelt sich hierbei um einen modernen Ansatz zur Gestaltung von Webseiten, bei dem der Designer die Elemente je nach Platzangebot so flexibel skaliert, positioniert und ein- bzw. ausblendet, dass das Layout den zur Verfügung stehenden Raum auf funktionale und ansprechende Weise ausfüllt.

Das vom Designer erstellte Layout reagiert somit auf den tatsächlich zur Verfügung stehenden Raum und passt sich bei Änderungen sofort an, z.B. wenn sich die Ausrichtung vom Smartphone oder Tablet ändert – weshalb man hier auch von „responsive“ im Sinne von „schnell auf Änderungen reagieren“ spricht.

Grundsätzlich stehen dem Designer folgende Optionen zur Verfügung, um auf eine Änderung im Platzangebot zu reagieren:

• Skalierung
• Positionierung
• Sichtbarkeit

Artikel und Bilder sind nicht die einzigen Elemente die vor der Herausforderung stehen, sich an Änderungen im Platzangebot anpassen zu müssen – auch Logodesigns haben mit diesem Problem zu kämpfen.

Betrachter können eine Marke nicht erkennen, wenn das Logo so schlecht skaliert, dass es unleserlich wird. Ebenso sollten Logodesigns nicht auf das Markenerlebnis eines Favicons* reduziert werden, wenn ausreichend Fläche zur Verfügung steht.

*Ein Favicon ist ein kleines, Icon, Symbol oder Logo, das von Webbrowsern verwendet wird, um eine Website auf wiedererkennbare Weise zu kennzeichnen.

Häufig wird empfohlen, dass Logos nicht kleiner als 2,5 x 2,5 cm gedruckt werden sollten. Andernfalls können Betrachter den Namen oder den Slogan nicht mehr lesen und dann scheitert die Markenerkennung.

Im Web hingegen gehört zu den üblichen Größen für ein Logo auch ein 16x16 Pixel kleines Favicon. Ein Standard-Logo können Sie bei dieser Größe in der Regel nicht mehr erkennen. Als Designer könnte man hier zwar grundsätzlich auch ein anderes Bild einsetzen, jedoch würde man damit eine große Branding-Möglichkeit ignorieren.

Genau wie Responsive Web Design Elemente neu anordnet und skaliert, um sie an eine Vielzahl digitaler Räume anzupassen, funktioniert auch Responsive Logo Design.

Responsive Logos werden mit zunehmender Größe der Fläche immer komplexer, bzw. mit abnehmender Größe der Fläche immer stärker reduziert. Auf diese Weise behält das Logo in jedem Maßstab seine Klarheit.

Große Logos können Slogans, komplizierte Grafiken, abgestufte Farben und Elemente enthalten, die der Betrachter aus dem Gesamtbild der Marke kennt. Details werden die Klarheit in großen Logos nicht verringern. Daher können große Logos mehrere verschiedene Berührungspunkte der Marke hervorheben. Betrachter sehen mehr und erinnern sich an mehr.

Mittlere Logos entfernen einige dieser Elemente für ein einfacheres Aussehen. Genau wie beim responsiven Webdesign wird auch beim responsiven Logodesign die Sichtbarkeit der Klarheit angepasst. Einige Logos können bei dieser Größe vielleicht einen lesbaren Slogan beibehalten. Andere könnten den Slogan abkürzen oder ganz entfernen. Farbverläufe und komplizierte Details können für den Betrachter ebenfalls schwer zu erkennen und zu formen sein, daher werden sie möglicherweise ebenfalls abgeflacht oder vereinfacht.

Kleine Logos würden sicherlich alle außer den einfachsten Elementen entfernen. Die kleinsten Logos, wie z. B. ein Favicon, könnten die Marke auf den Symbolteil des Logos im Gegensatz zum gesamten Schriftzug reduzieren, oder vielleicht nur auf eine Initiale.

Das Logo für das Projekt "CheckPhilippines" besteht aus einer graphischen Komponente und der vollständigen Url der Website. Als graphische Komponente wurde eine Lupe und die Landkarte der Philippinen verwendet - damit soll die Adresse und das Thema der Website visualisiert werden. Das Flugzeug um die Lupe herum soll außerdem einen visuellen Hinweis darauf geben, dass es sich bei der Website vorrangig um ein Reiseportal handelt. Für das Design wurden die drei Farben blau, rot und gelb gewählt - in Anspielung auf die Nationalfarben der Philippinen.

Durch eine Änderung in der Anordnung funktioniert das Logo auch dann, wenn sich der Platz horizontal verringert. In diesem Fall kann vorerst auf eine Reduktion der Elemente verzichtet werden.

Häufig soll ein Logo auch im 1:1 Format funktionieren, z.B. wenn es als Profilfoto in den Sozialen Medien genutzt werden soll. Um das Logo hierfür verwenden zu können, muss jetzt reduziert werden - dafür wird der Schriftzug entfernt. Das Logo konzentriert sich damit auf das wesentliche Designelement.

In den Sozialen Medien wird oftmals ein rundes Profilphoto verwendet. Das bereits auf das 1:1 Format optimierte Logo kann hierfür verwendet werden, indem einfach ein Abschnitt vom Griff der Lupe toleriert wird. Das fehlende Stück ist für die Wiedererkennung nicht relevant und durch diesen Kompromiss kann das Logo ansonsten unverändert verwendet werden.

Wenn aufgrund von technischen Anforderungen mit einer deutlichen geringeren Auflösung gearbeitet werden muss, ist eine weitere Reduktion unvermeidbar. Das Flugzeug ist in diesem Fall nicht mehr gut erkennbar und wird samt der gestrichelten Linie entfernt, um mehr Klarheit zu schaffen.

Damit das Logo, bei einer Größe von 16x16 Pixel – wie es für Favicons üblich ist – überhaupt noch erkennbar bleibt, muss jetzt noch stärker reduziert werden. Die Andeutung der philippinischen Inseln ist viel zu filigran und entfällt in dieser Version. Übrig bleibt daher nur noch die Lupe als markantestes Designelement.