Responsive Design

Unter Responsive Design versteht man die Möglichkeit, eine Website für verschiedene Endgeräte entsprechend angepasst anzuzeigen.

Die Problematik, das sich eine Website an verschiedenen Bildschirmgrößen anpassen sollte, gab es schon vor Smartphone und Co. Allerdings waren die Bildschirmgrößen früher überschaubar und die Lösungen recht simpel. Entweder war die Website auf eine feste Breite fixiert oder komplett „fluid“, also passte sich der Breite des Bildschirms an. Die Bildschirme wurden immer breiter, insbesondere durch die 16:9 Geräte. Dadurch kamen Mischlösungen zustande, so dass eine Website nur bis zu einer bestimmten Breite fluid war und sich dann nicht weiter verbreiterte.

Warum Responsive Design?

In den letzten Jahren haben die neuen Endgeräte wie iPad’s/Tablets sowie iPhone‘s/Smartphones die bisherigen Lösungen unbrauchbar gemacht. Bei fixen Breiten muss der Nutzer die ganze Website hin und herschieben oder diese ist schlecht lesbar oder aufgrund der zu kleinen Bedienelemente wie Buttons oder Navigation schlichtweg nicht nutzbar. Bei fluiden Websites schob sich alles zusammen, was nicht besonders schön aussieht oder gar zu Darstellungsproblemen führt. Verschärfend kommt hinzu, dass man die mobilen Geräte auch in beiden Ausrichtungen (hoch/quer) nutzen kann.

Responsive Design löst dies dadurch, dass man auf Basis des immer gleichen HTML-Grundgerüstes, je nach Bildschirmbreite die Formatierung via CSS/Stylesheets ändert. Dazu werden „Breakpoints“ definiert, an deren Stellen eine andere Darstellung für die Elemente erzeugt wird. Typische Methoden sind die Auslagerung der Navigation, so dass diese über einen Button aufgeklappt oder eingeblendet werden kann. Ein mehrspaltiges Design wird zu einer einspaltigen Darstellung und die einzelnen Bereiche werden entweder untereinander angezeigt oder können von den Seiten her eingeblendet werden.

Ist Responsive Design teuer?

Nein. Die rein technische Umsetzung ist zwar aufwendiger als ein herkömmliches Design aber ist je nach Design/Konzept auch für ein kleines Budget problemlos machbar. Wenn man es unter dem Aspekt betrachtet, dass man damit alle Nutzer bedient, sogar günstiger als eine Website die nicht anpassbar aufbereitet ist. Nutzer die Ihre Website nicht mit mobilen Endgeräten nutzen können, suchen sich alternative Websites und werden eventuell nicht wiederkehren, selbst wenn Sie zu Hause über einen Computer/Laptop verfügen.

Kann man eine bestehende Website „responsive“ machen?

Theoretisch schon aber es ist weder sinnvoll, noch kostengünstiger als Struktur und Design neu zu erstellen. In der Regel setzt man in dem Zuge auch weitere technische Aspekte um, z. B. die Einführung eines tabellenlosen HTML-Aufbaus oder die Nutzung von HTML5.

Gibt es Alternativen zum Responsive Design?

Ja, die gibt es. Entweder wird die gesamte Website oder Teile davon unter einer gesonderten Domain bereitgestellt, mit einem eigenständigen Design und Funktionen. Oder man stellt einen Teil der Inhalte und Funktionen in einer (zusätzlichen) speziellen App bereit. Beide Lösungen führen aber zu höheren Kosten in der Entwicklung als ein Responsive Design. Für kleinere bis mittlere Websites ist eine Trennung in unterschiedliche Lösungen zu kostenintensiv. Dabei sollte auch bedacht werden, das eine inhaltliche Unterscheidung, für Nutzer die dann beide Versionen nutzen, verwirrend sein kann.