Der Blog zu Webdesign, Homepageerstellung, Online-Marketing und Social Media Marketing

Responsive Webdesign und Website-Optimierung für Mobilgeräte

responsive-design-190x103Als Apple 2007 die erste Generation des iPhones vorstellte, war dieser Boom noch nicht abzusehen: Schon 2012 lag der Anteil mobiler Geräte bei Seitenaufrufen laut Statista, einem führenden Statistik-Portal, bei über 10%. Das heißt, dass schon im vergangenen Jahr mehr als jeder zehnte Besucher einer Internetseite mit einem mobilen Gerät unterwegs war.

Die weiter steigenden Absatzzahlen bei Smartphones und Tablets lassen vermuten, dass dieser Anteil in Zukunft stetig wachsen wird. In einzelnen Branchen sind über 20% der Besuche über mobile Geräte bereits heute keine Seltenheit mehr.

Doch trotz dieser Zahlen sind nur die wenigsten Webseiten und Online-Shops für die mobile Nutzung optimiert.

Das Problem: Die meisten Internetseiten sind für die Bedienung mit Maus + Tastatur und einem großen Bildschirm ausgelegt. Oder es werden große Bilder verwendet, die zwar am heimischen PC schön aussehen und die Homepage aufwerten, am Handy aber dazu führen, dass vor lauter Scrollen der eigentliche Inhalt nicht mehr zu finden ist und die Ladezeiten steigen.

Um eine Internetseite fit für den mobilen Markt zu machen, gibt es verschiedene Lösungen:

 

Reponsive Webdesign

Responsive Design, was übersetzt etwa „reagierendes Design“ bedeutet, passt sich automatisch an die Bildschirmgröße an. Ist die Auflösung kleiner als die festgelegte Seitenbreite, „schrumpft“ die Seite automatisch und passt sich dem Bildschirm an. Weitergehende Informationen finden Sie z. B. hier: http://de.wikipedia.org/wiki/Responsive_Webdesign

Diese Lösung hat den Vorteil, dass sich der Inhalt allen Endgeräten und Auflösungen flexibel anpasst – Bilder haben dabei beispielsweise eine Maximalgröße und schrumpfen bei kleinen Bildschirmen automatisch mit. Ein Beispiel dafür ist unsere eigene Seite, auf der Sie sich gerade befinden. Wenn Sie die Seite an einem „normalen“ PC aufrufen, ziehen Sie einmal das Fenster kleiner und beobachten, was passiert.

responsive-design-600x325

 

Für mobile Geräte optimierte Homepage

Die Alternative zum Responsive Design ist eine eigens für mobile Geräte erstellte Internetseite. Beim Aufruf wird erkannt, welches Gerät der Benutzer verwendet und entschieden, ob die normale oder die mobile Homepage geladen wird.

Bei dieser Variante werden die Inhalte – oder Teile davon – in einem eigenen Design mit reduzierten Maßen dargestellt.

Für eine eigene, für mobile Endgeräte optimierte Seite spricht, dass sich diese voll auf mobile Geräte anpassen lässt. Während auf der klassischen Homepage oft viel „Ballast“ zu finden ist, z.B. die aufwendige Slideshow mit großen Bildern, lässt sich der mobile Part auf das Wesentliche konzentrieren. So könnte z.B. ein Restaurant lediglich Kontaktdaten, Öffnungszeiten, Routenplaner und die Speisekarte präsentieren und den Interessenten die gewünschten Informationen kompakt und übersichtlich zur Verfügung stellen.

Im Gegensatz zum Resonsive Design werden also nicht zwangsweise nur die bestehenden Inhalte angepasst, sondern es lässt sich für mobile Besucher auch eine eigenständige Homepage erstellen. Das erkauft man allerdings mit einer Kompromisslösung: Es gibt eine Seite A für klassische PCs und Notebooks und eine Seite B für mobile Geräte – und was vielleicht auf dem iPhone perfekt aussieht, passt nicht zwangsläufig auch auf jedem Modell von Samsung oder HTC.

 

Fazit

Wer in Zukunft keine Besucher – und damit Umsatz – verlieren will, kommt nicht umhin, die Marktentwicklung zu berücksichtigen. Und der Trend geht eindeutig in Richtung Smartphones und Tablets.

Auch Google trifft Vorbereitungen und hat bereits angekündigt, dass Webseiten, die mobile Suchanfragen nicht zufriedenstellend berücksichtigen, im Ranking der Suchmaschine nach unten rutschen werden: http://t3n.de/news/seo-google-macht-ernst-472817

Empfehlung: Lassen Sie sich beraten um die richtige Entscheidung zu treffen. Wenn Sie möchten, sehen wir uns Ihre Homepage oder Ihren Online-Shop gerne an und unterbreiten Ihnen einen Optimierungsvorschlag. Kostenlos und unverbindlich. Verwenden Sie zur Kontaktaufnahme einfach unser Kontaktformular.

Viel Erfolg mit Ihrer Website – auch auf Smartphones und Tablets!

Veröffentlicht in: Allgemein, Webdesign und Homepageerstellung


Schlagworte:

2 Kommentare

  1. Benjamin 28. Juni 2013

    Einfacher zu bedienen und deutschprachig (außerdem im Wikipedia-Artikel genannt) kann ich das Tool http://www.active-value.de/responsive-design-viewer/ empfehlen. Gerade für Einsteiger.

    Antworten
    • Erich Weber 28. Juni 2013

      Danke für den Tipp. Ich kenne den Link auch, habe mich aber trotzdem für http://www.screenqueri.es entschieden, weil es dort mehr Auswahlmöglichkeiten gibt. iPhone ist eben nicht Samsung und umgekehrt, wer mag, kann ja auf beiden Seiten testen.

      Antworten

Beitrag kommentieren