Mit dem rasanten Anstieg der Mobilgeräte wird das browsen im Web auch mobil. Das stellt uns Webdesigner vor neue Schwierigkeiten: soll nun eine optimierte Website erstellt werden, investiert man in eine iPhone oder Android App oder ist das Responsive Web die Lösung aller Probleme?
Eine eindeutige Antwort diesbezüglich gibt es wohl nicht und es lohnt sich von Projekt zu Projekt zu entscheiden. Je nach Produkt, Dienstleistung, Zielgruppe und Budget. Aber der Vorteil eines Responsive Designs liegen auf der Hand. Nur 1 Seite welche alle Bildschirmauflösungen und Geräte abdeckt, zwar insgesammt aufwendiger zu erstellen ist, dafür erspart man sich die Probleme wenn weitere Bildschirmgrössen und Endgeräte auf den Markt kommen. Dazu sieht es einfach enorm gut aus wenn sich die Seite flüssig seinen Verhältnissen anpasst.
Wir haben euch nachfolgend eine Liste von Websites zusammengestellt, die uns besonders gefallen sowie einige Frameworks die wir für den Einstieg in das Responsive Webdesign empfehlen können. Was sind eure Erfahrungen? Erzählt es uns in den Kommentaren.
Responsive Webdesign
Design Made in Germany
Forefathers Group
Owltastic
The Boston Globe
Ethan Marcote
Teixido
Momentum
dConstruct
Bryan Connor
Simon Collison
Spigot Design
Pelican Fly
Responsive Webdesign Frameworks
1140 CSS Grid
Das 1140 CSS Grid wurde entwickelt um perfekt auf einem 1280px Screen angezeigt wird, bei kleineren Bildschirmen wird das ganze Fluid, bis zu einem gewissen Zeitpunkt an dem Media Queries genutzt werden um die Mobile Version darzustellen. Das Grid besteht aus 12 Spalten, wobei hier entweder zwei, drei, vier oder sechs verwendet werden können. Das ganze funktioniert mit allen gängigen Browsern, mit Ausnahme des IE6 welcher “max-width” nicht unterstützt.
Skeleton
Skeleton ist eine kleine Kollektion von CSS und JS Files welche auf einem 960 Raster basieren und runterskalieren zu kleineren Browserfenster, Tablets und Mobilgeräten (Landscape und Portrait).
320 and up
320 and Up verhindert, dass Mobilgeräte den ganzen Chunk der Desktop-Version laden, es liefert ein einfach Stylesheet zum Start welches nur ein Reset, Farbe und Typografie beinhaltet. Media Queries laden dann die entsprechenden Layoutstile schrittweise und nur wenn sie gebraucht werden.
inuit.css
inuit.css ist ein leicht und permanent weiterentwickeltes CSS-Framework welches dir einen pragmatische und funktionsreichen Start für alle deine Projekte liefert. Es ist vollgepackt mit nützlichen Snippets und bietet zusätzliche Plugins.
Less Framework
Das Less Framework bietet 4 adaptive Layouts und 3 3 Sets Typografie Voreinstellungen, alle auf der Basis eines Single-Grids, mit 64px Spalten und 24px Abständen. Die Idee dahinter ist, zuerst das Standard-Layout (992px) zu programmieren und dann CSS3 Media Queries zu benutzen um verschiedenen Layouts damit zu generieren: 768, 480 und 320.
Foundation
Das Foundation Framework ist ein Grid-Framework mit 12 Spalten welches dutzende von Stile und Elemente beinhalten um möglichst einfach und schnell einen klickbaren Prototypen zu erstellen welcher später dann in Produktions-Code adaptiert werden kann.
