Professionelles „Responsive Webdesign“ (kurz: RWD) bedeutet, dass Ihre Seite auf jedem Gerät perfekt funktioniert, erstklassig aussieht und die Besucher zum Ziel führt – unabhängig von der Displaygröße, der Art der Bedienung oder der verwendeten Software.


RWD berücksichtig mehr als nur Displaygrößen

Jede Seite wird mit einem flexiblen Layout gestaltet, sodass sie sich stufenlos an den verfügbaren Platz im Browser anpasst. Dadurch werden sowohl unterschiedlich große Displays, als auch Split Screen-Funktionen berücksichtigt.

Durch die verschiedenen Geräte wie Smartphones, Tablets, Notebooks wird auch Ihre Seite über verschiedene Geräte aufgerufen und sehr unterschiedlich bedient werden. Zum Beispiel mit der Maus, über einen Touchscreen, mittels digitalen Stifts oder Sprache. Und darüber hinaus laufen auf den Geräten auch noch unterschiedliche Betriebssysteme und verschiedene Browser oder Apps mit denen Webseiten betrachtet werden können. Ganz zu schweigen von individuellen Einstellungen, die im Betriebssystem vorgenommen wurden.

Ich sorge dafür, dass Ihre Webpräsenz perfekt funktioniert, toll aussieht und den Besucher zum Ziel führt – unabhängig davon mit welchem Gerät Ihre Kunden die Seite besuchen und wie sie ihr Gerät konfiguriert haben.


100% Responsive – vom Kennenlernen bis zur Veröffentlichung

Responsive Webdesign ist längst Standard. Was anfangs noch als „Layout für Smartphone, Tablet und Computer“ bekannt war, ist heute deutlich flexibler und komplexer. Die Firma hat sich von Beginn an auf diese Technologie spezialisiert. Der Workflow sorgt dafür, dass Projekte von Beginn an auf allen Geräten getestet werden und alle am Projekt beteiligten Personen in Form von interaktiven Prototypen die Entwicklung verfolgen und beeinflussen können. Beim Thema Responsive Webdesign bin ich daher mit allen Wassern gewaschen.

Perfekte Layouts – auf allen Geräten

Viele Kunden und Designer kritisieren, dass sich im Responsive Webdesign viele Webpräsenzen ähnlich sehen. Ich verfolge die Entwicklungen im Webdesign sehr genau, weiß warum sich ein Trend entwickelt hat und wie er zustande kommt. Ich lasse mich nicht durch Tools und Technologien steuern, sondern ich kontrolliere die Technologie. Daher bin ich in der Lage einzigartige Layouts zu entwerfen und auch solche die bewusst die Zielgruppen bedienen.

Perfekte Suchmaschinenoptimierung

Die Internet-Adresse Ihrer Webseite als auch die Inhalte bleiben identisch – unabhängig davon, über welches Gerät ein Anwender die Seite besucht. Diese Tatsache macht es Suchmaschinen leicht, Inhalte auszulesen und zu bewerten. Google empfiehlt den Einsatz von Responsive Webdesign ausdrücklich und informiert darüber, dass schlecht optimierte Webseiten abgestraft werden.

Häufige Fragen zum Thema

Was heißt Mobile First?

Mit „Mobile First“ wird ein Konzept im Responsive Webdesign bezeichnet bei dem die Seite als erstes für mobile Endgeräte entwickelt wird. Für größere Displays wird die Seite anschließend erweitert und angepasst.
Bei Mobile First muss unterschieden werden zwischen konzeptionellem Mobile First und auf Mobile First aufgebautem CSS-Code (dem technischem Mobile First). Beim konzeptionellen Ansatz muss sich der Konzepter rechtzeitig über Priorisierung und Positionierung von Elementen Gedanken machen. Da sich dieser Ansatz größtenteils auf die Inhalte einer Seite bezieht, spricht man auch vom „Content First“.
Mobile First aufgebauter CSS-Code wird so bezeichnet, da der Code für die mobile Ansicht im Dokument ganz oben steht. Das führt unterm Strich zu weniger und besser strukturiertem Code und somit zu schnelleren Seiten.
Alternative Modelle sind Desktop First und Tablet First.

Was ist ein Breakpoint?

Ein „Breakpoint“ ist ein Begriff aus dem Gebiet des Responsive Webdesign. Beim Responsive Webdesign werden Seiten so entwickelt, dass sie optimal auf jeder Größe und Ausrichtung des Displays dargestellt werden. Dazu ist es notwendig, dass das Layout ab einer bestimmten Displaygröße umstrukturiert wird. Die Navigation rutscht beispielsweise unter das Logo, sobald zu wenig Platz zur Verfügung steht. Diesen Punkt nennt man Breakpoint. Ein Breakpoint wird im CSS-Code meist über einen sog. Media Query erreicht. Breakpoints müssen sich nicht zwangsläufig nur auf das Layout einer Seite beziehen. Auch das Austauschen von Grafiken für hochauflösende Displays, die Unterstützung von Touch-Screens usw. ist möglich.

Was ist Rapid-Prototyping?

Das „Rapid Prototyping“ bezeichnet einen konzeptionellen Ansatz bzw. Arbeitsablauf im Webdesign. Da sich moderne Webanwendungen und Webpräsenzen nicht gut mit statischen Grafiken planen lassen, wird stattdessen ein interaktiver Prototyp bzw. ein Clickdummy erstellt. Dieser Prototyp zeigt sowohl die Funktionalität, als auch die Flexibilität der Seite, ist aber oft nicht visuell perfekt. Entwickelt wird der Prototyp entweder direkt in HTML und CSS – z.B. unter Zuhilfenahme eines CSS Frameworks, mit Hilfe spezieller Prototyping-Tools (z.B. Adobe XD) oder mit einer Kombination von statischen Design-Tools (z.B. Photoshop) und Plugins (z.B. Craft, Invision).