Responsive Icons – Geniestreich oder überflüssig?
Kommentare

„Responsive Icons” – so nennt sich ein Projekt von Grafikdesigner Joe Harris. Ziel ist es Icons zu kreieren, die nicht nur das perfekte Maß an Schlichtheit aufweisen, sondern sich auch auf die jeweilige Bildschirmgröße anpassen. Skalierbare Icons sozusagen.

Das Schlichtheit im Fokus des Projekts steht, unterstreicht auch die minimalistische Homepage des Projekts. Auf schwarzem Hintergrund lassen sich nur ein Twitter- und ein Informationsbutton anklicken. Detailliert wird lediglich ein Icon in der Mitte der Website dargestellt: Ein helloranges Haus mit Schornstein, Haustür, Fenstern und etwas dunklerem Dach. Unter den Buttons oben rechts auf der Seite, wird dazu aufgefordert, die Größe des Browserfensters zu verändern. Und siehe da, je kleiner man das Fenster mach, desto mehr wird das Icon zum Piktogramm. Es wird einfarbig, die Tür verschwindet, dann die Fenster und der Schornstein. Bis am Ende lediglich ein oranges Quadrat, mit einem orangen Dreieck darauf, übrig bleibt. 

Die Reduzierung setzt sich auch in der Überschrift fort. Aus „Responsive Icons“ wird am Ende „Rspnsve Icns“.

Das grundsätzliche Prinzip hinter den Responsive Icons: Wie bei Responsive Images bekommt man also entsprechend der verschiedenen Viewport-Größen unterschiedliche Icons angezeigt. Diese können mit CSS-Klassen im Dokument eingebunden werden. Bei Harris steckt aber noch mehr dahinter. Hier werden die Icons mithilfe von Scalable Vector Graphics (SVG) eingebunden. Das Framework Snap.svg bietet hierzu verschiedene Ansätze. So lassen sich Icons individuell anpassen (auch in der Farbe) und mann muss nicht mehr diverse Grafiken anlegen. Editieren lassen sich die Icons via CSS.

Harris gibt an, sein Projekt befinde sich noch im Anfangsstadium, in Kürze solle es aber weitere Icons auf der Website zu finden geben. Was haltet Ihr von den Responsive Icons? Ist das Konzept ein Geniestreich, der Webdesign in die Zukunft führt, oder nur ein überflüssiger Ansatz?

Responsive Icons

Screenshot: http://www.responsiveicons.co.uk/

Das Thema Responsive Webdesign steht auch bei der webinale 2014 wieder im Fokus. Die Responsive Desgin Days der webinale präsentieren im kommenden Jahr an drei Tagen Expertenwissen – Code, Design, Typografie – für die Realisierung zeitgemäßer Websites. 

Frühbucher, die sich bis Donnerstag in einer Woche (19. Dezember 2013) für eine Teilnahme an der webinale entscheiden, können nicht nur bis zu 250 Euro sparen – bei Anmeldung für 3 Tage bekommt Ihr das Intellibook-Tablet mit Android-OS, hochauflösendem 8-Zoll-HD Touch-Display, Dual-Core 1,5GHz Prozessor, 1 GB RAM und 8 GB internem Speicher gratis. Weitere Frühbucherkondition zeigt der folgende Überblick:

webinale 2014

Hier geht es zur Anmeldung.

Zeitgleich zur webinale findet übrigens die International PHP Conference 2014 statt, für die es ebenfalls attraktive Frühbucherkonditionen gibt.

Einen Eindruck davon, was Euch auf der webinale erwartet, vermittelt das folgende Video:

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -