Cookies
Diese Website verwendet Cookies und ähnliche Technologien für Analyse- und Marketingzwecke. Durch Auswahl von Akzeptieren stimmen Sie der Nutzung zu, alternativ können Sie die Nutzung auch ablehnen. Details zur Verwendung Ihrer Daten finden Sie in unseren Datenschutz­hinweisen, dort können Sie Ihre Einstellungen auch jederzeit anpassen.
Design

Webseiten-Optimierung für mobile Endgeräte

Minuten Lesezeit

Notice: This article is written in German.

Blog Post - Webseiten-Optimierung für mobile EndgeräteBlog Post - Webseiten-Optimierung für mobile Endgeräte
Oliver Liebsch

Je nach Endgerät sind bspw. das Nutzungsverhalten oder die technologischen Anforderungen sehr verschieden. Erfahren Sie im folgenden Beitrag mehr über verschiedene Lösungsansätze.

Für welche Webseiten ist eine Mobil-Optimierung erforderlich?

Pauschal lässt sich diese Frage nicht beantworten. Handelt es sich um eine kleine Webseite mit wenigen Seiten oder eine umfangreiche und komplexe Web-Anwendung, eine Optimierung kann in beiden Fällen notwendig sein. Nur mit einer Analyse der Nutzer, ihrem Verhalten und ihren Endgeräten kann man ableiten, wie wichtig eine Optimierung letztendlich ist.

Wenn man seine Zielgruppe eindeutig identifizieren kann, weil es sich z. B. um eine Anwendung handelt, die nur innerhalb der eigenen Firma von einem begrenzten Personenkreis mit dediziert festgelegten Endgeräten genutzt wird, lässt sich diese Frage schnell beantworten. Zumeist steht eine Webseite aber grundsätzlich einer großen Zahl an unbekannten Nutzern zur Verfügung. Dann spielen Analyse-Werkzeuge, wie bspw. Google Analytics, eine wichtige Rolle bei der Identifizierung der Nutzerbedürfnisse. Wenn es sich um eine neue, noch nicht verfügbare Web-Anwendung handelt, gibt es auch entsprechende Methodiken, um die Zielgruppe möglichst genau zu identifizieren.

Zusätzlich spielt die Optimierung für mobile Endgeräte bei der Suchmaschinenoptimierung (Search Engine Optimization [SEO]) eine wichtige Rolle. Suchmaschinen wie Google berücksichtigen beim Ranking für mobile Nutzer, wie gut die Webseite für mobiles Browsen geeignet ist (1, 2).

Für welche Endgeräte soll optimiert werden?

Eine Web-Anwendung für alle Endgeräte zu optimieren ist aufgrund der Heterogenität der Geräte und vor dem Hintergrund begrenzter Ressourcen in den meisten Fällen unmöglich. Daher ist es notwendig, dass man die Bedürfnisse der Nutzer analysiert und herausfindet, welche Geräte oder Gerätegruppen mit welchen Eigenschaften primär zum Einsatz kommen, um sich dann gezielt diesen bei der Optimierung zu widmen. Im Fokus dieser Betrachtung liegen häufig die klassischen Geräte: Desktop-Rechner, Notebooks, Tablets und Smartphones. Unter Umständen kommen auch neuartige Multimediaplattformen wie beispielsweise Fernsehgeräte oder Infoboards in Betracht.

Neben den eigentlichen Geräten spielt ebenfalls die jeweilig genutzte Software eine wichtige Rolle. Allen voran das Betriebssystem und die Web-Browser. Bei beiden kommt es auch auf die jeweilige Version an, denn hier kann es erhebliche Unterschiede geben.

Die eigenen Ziele berücksichtigen

Auch wenn die Nutzer, deren Endgeräte und Verhalten sicherlich maßgeblich für viele Entscheidungen sind, sollte man nie die eigenen Ziele außer Acht lassen.

Wie alle Maßnahmen müssen auch Mobil-Optimierungen im Kontext des eigenen Zielsystems betrachtet werden. Wenn die überwiegende Mehrheit der Kunden mit mobilen Endgeräten auf das eigene Angebot kommt, aber ein Großteil des Umsatzes mit Nutzern von Desktop-Rechnern gemacht wird, stellt sich die Frage, ob dies an der fehlenden Mobil-Optimierung liegt oder ob die umsatzstarke Zielgruppe sich typischerweise während der Nutzung am Arbeitsrechner befindet.

Dies herauszufinden ist keine einfache Aufgabe und bedarf einer gezielten Analyse.

Lösungsansätze

Lösungsansätze für die Mobil-Optimierung

Nachdem die Rahmenbedingungen identifiziert wurden, kann man sich mit den möglichen Problemlösungen beschäftigen.

Im Rahmen einer Mobil-Optimierung gibt es verschiedene Lösungsansätze, die sich zum Teil in Kombination anwenden lassen. Zentrale Methodiken sind

  • eine native App,
  • eine dedizierte Mobilseite,
  • ein adaptives Layout und
  • ein „Tweak“ der aktuellen Seite.

Native App

Beispiel einer nativen App

Eine native App wird speziell für ein Betriebssystem entwickelt. Bei mobilen Endgeräten ist das häufig gleichzusetzen mit der Entwicklung für ein spezielles Gerät. Im Smartphone-Markt bedeutet das bspw. die Entwicklung einer jeweils eigene Anwendung für die vier Branchengrößen:

  • Apple
  • Android
  • Windows
  • Blackberry

Dabei muss in der Regel auch zwischen verschiedenen Betriebssystem-Versionen unterschieden werden.

Einige Vorteile von nativen Apps:

  • Sehr gut auf das jeweilige System angepasst.
  • In der Regel im Vergleich die beste Geschwindigkeit.
  • Alle Funktionen des jeweiligen Endgeräts können genutzt werden.
  • App-Stores als Vermarktungsplätze nutzbar.

Einige Nachteile von nativen Apps:

  • Sehr hoher Erstellungs- und Wartungsaufwand.
  • Für jedes Betriebssystem, bzw. sogar für einzelne Versionen ist eine eigene Anwendung/Anwendungsversion erforderlich.
  • Kostenpflichtige Entwickleraccounts beim Hersteller notwendig.
  • Z. T. langwieriger Einreichungsprozess in den App-Stores, auch bei Updates.
  • Für jede App ist die Kenntnis einer speziellen, z. T. proprietären, Programmiersprache notwendig.
  • Weniger flexibel.

Dedizierte Mobilseite

Beispiel einer dedizierten Mobilseite

Im Hintergrund greifen die „normale“ Seite und die Mobilseite zwar auf den gleichen Datenbestand zu, aber zum Nutzer hin wird quasi eine zweite, eigenständige Version der Webseite erstellt.

Einige Vorteile von dedizierten Mobilseiten:

  • Gut abgestimmt auf den Einsatzzweck.
  • Gutes Nutzungserlebnis, bei entsprechender Umsetzung.
  • Technisch „saubere“ Lösung.

Einige Nachteile von dedizierten Mobilseiten:

  • Hoher Erstellungs- und Wartungsaufwand.
  • Eine Trennung von beiden Seiten ist nicht immer sinnvoll möglich. Ggf. müssen auch hier mehrere Versionen erstellt werden, um allen Zielgruppen gerecht zu werden.
  • Es lässt sich nicht immer klar abgrenzen, auf welche Version der Nutzer initial geleitet werden soll.
  • Häufig unterschiedliche URLs für gleiche Inhalte auf mobiler und normaler Version. SEO-Lösung notwendig. Das Teilen einer URL ist nicht optimal.
  • Es können nicht alle Features der Endgeräte genutzt werden.

Adaptives Layout (Responsive Design)

Beispiel eines Responsive Designs

Beim Responsive Design verfolgt man den Ansatz, dass eine Webseite nur einmal erstellt wird, diese aber flexibel auf geänderte Darstellungsanforderungen reagiert. So kann eine Webseite für große Auflösungen bspw. ein dreispaltiges Layout besitzen. Wenn die Auflösung (z. B. auf einem Smartphone) allerdings geringer ist, wird das Layout einspaltig. Die Darstellungsvarianten lassen sich beim Responsive Design sehr einfach testen: Einfach eine entsprechende Webseite im Browser öffnen und das Fenster in der Breite langsam kleiner ziehen. Die Seite verändert abhängig von der Breite nach und nach ihre Darstellung. Ein von Zweitag umgesetztes Projekt ist bspw. das Tourismus-Portal des Münsterland e.V.

Einige Vorteile von Responsive Design:

  • Niedriger bis mittlerer Erstellungs- und Wartungsaufwand.
  • Eine gemeinsame Webseite für verschiedenste Ansichten: Für viele Endgeräte und Auflösungen gemeinsam nutzbar.
  • Hoher Kompatibilitätsgrad.
  • Beim Öffnen wird immer die optimale Version gewählt.
  • Gleiche URL für Inhalte, egal welche Version angezeigt wird.

Einige Nachteile von Responsive Design:

  • Gewisse technische Einschränkungen im Nutzungserlebnis. Es können bspw. nicht alle nativen Funktionen des Endgerätes genutzt werden und auch die Speicherung von Daten, wenn kein Netz verfügbar ist, ist eingeschränkt.
  • Für einige der Techniken sind moderne Browser erforderlich.
  • Es können nicht alle Features der Endgeräte genutzt werden.
  • Ein „Umschalten“ zwischen verschiedenen Ansichten ist nur bedingt möglich.

Tweaks

Nur der Vollständigkeit halber sei dieser „Ansatz“ erwähnt, da er unter Umständen auch schon zielführend sein kann. Mit Tweaks ist gemeint, dass man an einer bestehenden Anwendung nur minimale Anpassungen vornimmt, damit die Webseite einigermaßen benutzbar auf mobilen Endgeräten ausgeliefert wird. Die Optimierung fällt dementsprechend schlecht aus, allerdings ist der Aufwand entsprechend niedrig.

Zusammenfassung

Es ist immens wichtig, sich mit der Optimierung der eigenen Webseite für unterschiedlichste Endgeräte zu beschäftigen, um das Potenzial voll ausschöpfen zu können und den Nutzern das bestmögliche Nutzungserlebnis anzubieten. Es gibt unterschiedlichste Optimierungsansätze und Herangehensweisen. Diese müssen individuell für jeden Anwendungsfall untersucht werden. Dem voran geht eine genaue Erörterung der Rahmenbedingungen. Allem voran steht eine Analyse der Zielgruppe und deren Anforderungen unter Berücksichtigung des eigenen Zielsystems.

Wenn Sie weitergehende Fragen zum Thema haben, können Sie sich gerne an uns wenden.

Partner für digitale Geschäftsmodelles

Are you looking for the right partner for your digital projects?

Let's talk!