Grafik: Tablet, Desktop, Smartphone

Was ist der Unterschied zwischen Mobile und Responsive Webdesign?

Den Besuchern einer Website ein übersichtliches, gut händelbares Webdesign anzubieten, das sich auf dem Desktop-PC, einem Tablet und auf dem Smartphone gleichermaßen gut macht, ist mittlerweile selbstverständlich geworden. Und so ist es selten geworden, dass man im Internet auf eine Website trifft, die keine mobile Lösung hat. Die verschiedenen Möglichkeiten, die es gibt, eine Website auch auf dem Smartphone attraktiv zu machen, sind unseren Kunden allerdings häufig unbekannt. Oft heißt es dann nur, man brauche auch eine Version für mobile Endgeräte.

Mobile Design

„Eine Version für mobile Endgeräte“ beschreibt dabei das sogenannte „Mobile Design“. Hierbei wird eine separate Version der Website erstellt, die speziell für mobile Nutzer optimiert ist.

Oft wird dieses mobile Design über eine Subdomain aufgerufen. Lautet die eigentliche Internetadresse also www.meineseite.de, gelangt man dann beispielsweise über m.meineseite.de zur mobilen Version. Seitenanbieter, die sich früh für eine separate mobile Version entschieden haben, haben oft einen Button oder Link auf der Website, mit dem der Wechsel zwischen Desktop-Seite und mobiler Version möglich ist. Bei neueren Umsetzungen wird das Endgerät meist automatisch erkannt. Inhalte können beim Mobile Design separat für Smartphone und Desktop-PC angepasst werden. Die Ladezeiten können für die mobile Nutzung optimiert werden.

Ein Nachteil des Mobile Designs ist, dass superschnelle Ladezeiten oft damit erkauft werden, dass Inhalte und/oder Funktionen der Desktop-Version weggelassen werden. Websiteanbieter, die darauf angewiesen sind, die Pflege ihrer Website in Auftrag zu geben, stoßen bei dieser Umsetzungsvariante zudem auf höhere Kosten, weil zwei separate Seiten zu pflegen sind. Und noch: Habe ich zwei verschiedene URLs wie z.B. www.meineseite.de und m.meineseite.de mit gleichen Inhalten erkennen Suchmaschinen das als so genannten Duplicate Content („doppelter Inhalt“). Das bezeichnet die Darstellung von gleichem Inhalt auf verschiedenen Webseiten. Suchmaschinen filtern Duplicate Content heraus und bewerten ihn zum Teil sogar negativ. Allerdings hat Google mittlerweile gelernt, zwischen böswillig und nicht böswillig dupliziertem Content zu unterscheiden.

Responsive Design

„Responsive Design“ reagiert auf die Bedürfnisse der verwendeten Endgeräte. Es ist also reaktionsfähig, d.h. dass Seitenlayout passt sich vollautomatisch an die unterschiedlichen Display-Größen an. Hier gibt es nur eine einzige Seite, bei der sich das Layout basierend auf der Größe und den Fähigkeiten des Endgerätes ändert. Auf einem Smartphone würden Nutzer beispielsweise Inhalte in einer einzelnen Spaltenansicht sehen. Ein Tablet zeigt möglicherweise denselben Inhalt in zwei Spalten an und der Desktop-PC in drei Spalten. Jede Display-Größe wird dabei optimal berücksichtigt und kein Platz verschenkt. Selbst zukünftige mobile Endgeräte mit anderen Display-Größen werden heute schon automatisch mit abgedeckt.

Im Allgemeinen werden beim „Responsive Design“ nahezu alle Inhalte und Funktionen vollständig auf allen Geräten angezeigt. Im Umkehrschluss bedeutet das allerdings auch, dass die Ladezeit der Seite auf dem Mobilgerät etwas länger ist als beim Mobile Design. Wenn alles mit übernommen wird, muss allerdings nicht entschieden werden, welche Funktionen auf Mobilgeräten wichtig sind und welche nicht. Man muss sich allerdings immer noch für eine Platzierung der Inhalte auf kleineren Bildschirmen entscheiden. So sollte beispielsweise bei einer Praxis-Hompage darauf geachtet werden, dass ein Startseiten-Block, der die Sprechzeiten der Praxis enthält, beim Aufruf via Smartphone nicht nach ganz unten in der Ansicht rutscht.