• Home
  • /
  • Mobile First Index – Webdesign neu definiert
Simone Sarodnick
veröffentlicht am: 23. März 2020

letztes Update:      5. Juni 2023


Mobile First – mit diesem Begriff bezeichnet Google die Tatsache, dass immer mehr Menschen bevorzugt mit ihrem Smartphone oder Tablet im Internet suchen. Seit März 2018 Google begünstigt Seiten, die für die mobile Nutzung, d.h. für die Nutzung auf einem Smartphone oder Tablet angepasst wurden.

Seiten, die nicht für die mobile Nutzung programmiert sind, verlieren Positionen. Seit März 2020 wird das Mobile First Kriterium komplett ausgerollt.

Mobile First Anspruch und Responsives Webdesign

Immer mehr Menschen sind mit dem Smartphone oder Tablet, d.h. mobil im Internet unterwegs. Damit eine Webseite für diese Nutzer auch lesbar ist, muss das Design der Webseite auf diese mobilen Geräte angepasst sein.

Mit dem Begriff „Mobile First“ bezeichnet man die Strategie, das Webdesign mit höchster Priorität für Smartphone & Co. anzupassen. Google schaut sich nicht mehr wie gewohnt Webseiten in der Desktop Version an, sondern wählt für die Einstufung im Index die mobile Variante der Website aus.

Den Mobile first Ansatz benötigst du, wenn die Zahl der mobilen Nutzer mehr als die Hälfte aller Besucher ausmacht. Da inzwischen mehr als 80% der Nutzer über das Smartphone oder Tablet im Internet surfen, bedeutet das, dass du die Gestaltung deiner Website so ändern solltest, das die Bedienung auf diesen Geräten einwandfrei möglich ist.

Der strategische Ansatz „Mobile First“ hat zur Folge, dass Webseiten auf ALLEN Geräte, also Desktop, Tablet und Smartphones in den verschiedensten Auflösungen darstellbar sein müssen. Außerdem müssen sie für den Nutzer auch gut lesbar sein. Wenn sich eine Webseite automatisch an die verschiedenen Displaygrößen anpasst, so spricht man von „responsive Webdesign“.

Das Wort „responsiv“ bedeutet laut Duden „antwortend; eine Reaktion zeigend oder darstellend“.

In diesem Sinne „antwortet“ das Design auf das anfragende Gerät, z.B. ein Tablet und spielt die entsprechende Variante aus.


Vorteile des responsiven Designs

1. Verbesserte Performance: Da sich responsives Designs zunächst auf die Optimierung für kleinere Bildschirme konzentriert, verbessert sich die Leistung der Website dank kürzerer Ladezeiten. Google setzt hohe Maßstäbe an die Seitenladezeit. Mobile First stellt somit Webentwickler vor die Herausforderung, die Anforderungen an den Page Speed der mobilen Version zu erreichen. 

2. Verbesserte Benutzerfreundlichkeit: Beim Mobile-First-Design müssen die Entwickler der mobilen Benutzererfahrung Vorrang einräumen, was ihnen ermöglicht, eine leichter zu navigierende Benutzeroberfläche und eine klare Inhaltsdarstellung zu schaffen. Dieses verbesserte Benutzererlebnis (UX) führt zu aktiveren Besuchern und zufriedeneren Kunden.

Allerdings verfolgt die Webentwicklung aus Gewohnheit den Desktop-First Ansatz. Webdesigner optimieren immer noch Webseiten zuerst für die Desktop-Version und nutzen dafür größere Monitore. Dabei ist es besser, wenn Webmaster von Beginn an die Website responsive gestalten. Mobilfreundliche Websites bieten ein besseres Benutzererlebnis als ihre Desktop-Pendants, da ihre Layouts für kleinere Flächen und Touch-Bedienung optimiert sind. 

Video über Mobile First

Diese Live wurde am 29.10.2021 aufgenommen.
Wenn du bei den Lives dabei sein willst, dann abonniere die Facebook-Seite "SEO Power mit Simone Sarodnick".

Du kannst dieses Video übrigens auch auf Facebook anschauen.

Mobile First Video
YouTube

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.
Mehr erfahren

Video laden

Um nichts zu verpassen, abonnieren am besten unseren YouTube Kanal.

Google und Mobile First

Google hat natürlich enorm viele Daten vorliegen und weiß genau, wann und wie wir mit einem bestimmten Gerät surfen. Da ist es einfach für Google zu ermitteln, welche Größe der Bildschirm des Gerätes hat. Daher ist es nicht verwunderlich, dass Google bereits vor längerer Zeit festgestellt hat, dass die mobile Internetnutzung rasant zugenommen hat. 

Im März 2020 erklärte Google, dass die meisten Websites, die in den Suchergebnissen angezeigt werden, für den Mobile-First-Ansatz gut geeignet sind.

Folgerichtig hat Google ab September 2020 für alle Webseiten auf die Mobile-First-Indexierung umgestellt. Google wird mit einem speziellen Smartphone-Crawler über die Webseiten gehen und die Indexierung durchführen. Das Ergebnis der Indexierung hat logischerweise einen großen Einfluss auf deine Suchmaschinen-Platzierung.


Wie implementiere ich eine mobile Website?

Im Prinzip ist die Umsetzung einer mobilen Website sehr einfach.

Webdesigner/innen bieten schon seit Jahren sogenannte "Responsive Design"-Lösungen an - das ist eine Möglichkeit, das gewünschte Ergebnis zu erzielen. Responsive Design arbeitet mit fließenden Rastern und flexiblen Bildern oder Videos, die sich an unterschiedliche Displaygrößen anpassen, wodurch ein intelligentes Gesamterlebnis für alle Geräte entsteht. Der Nutzer kann somit den Content auf allen Geräten gut lesen.

Zusätzlich gibt es bei dieser Lösung eine "mobile Weiterleitung" in Form eines sogenannten "Universal-Links": Wenn du auf einen solchen Link klickst, wirst du automatisch zur mobilen oder Desktop-Version der Website weitergeleitet.

Das bedeutet, dass du mit einer einzigen URL jedes Gerät erreichen und entsprechend anpassen kannst.

Einige (wenige) Designer/innen arbeiten immer noch mit getrennten Versionen für Smartphones und Desktops. Die "getrennte Version" ist vor allem für Probleme verantwortlich, die bei der Querverlinkung entstehen.

Wohin sollen die Links zeigen? Welche Seite soll per QR-Code aufgerufen werden? Ist es überhaupt möglich, externe Seiten aus der App heraus aufzurufen? Mit der "separaten Version" ist es leider nicht möglich, diese Probleme zu lösen. 

Eine separate Domain bzw. Subdomain (zum Beispiel „m.alsa-digital.de“) ist nicht mehr notwendig und wird von Google nicht empfohlen. Die separaten mobilen Domains haben in der Vergangenheit zu Verwirrungen bei den Crawlern der Suchmaschinen und bei den Nutzern geführt.

Am besten ist es, gleich von Anfang an ein System zu wählen, welches das responsive Design beherrscht. Laut Google ist es egal, wie und mit welchem Programm du deine Webseite erstellst.

Wichtig ist, dass deine Webseite für den Nutzer gut zu bedienen ist und die Usability (nutzerfreundliche Anwendung) berücksichtigt wird. Beispielsweise ist WordPress mit dem Gutenberg Editor hervorragend auf diese Anforderungen ausgerichtet. Achte bei der Auswahl deines Pagebuilders und Themes darauf, dass das Theme ebenfalls die responsive Darstellung sauber unterstützt. Diese Frage solltest du bereits zu Beginn im Zuge der Konzeption deines Webauftritts lösen.


Mobile First in der Google Search Console

Die Google Search Console ist ein kostenloses Tool des Suchmaschinenriesen Google.

Die Google Search Console (GSC) bietet eine Reihe von Diensten für Websites, die von der Google-Suchmaschine indiziert werden. Dazu gehören umfangreiche Diagnosetools, mit denen Webmaster/innen besser verstehen können, wie ihre Website funktioniert und wie sie auf den Suchergebnisseiten angezeigt wird.

Wenn du die Google Search Console für deine Website nutzt, kannst du damit auch sehen, wie gut deine Website auf den unterschiedlichen Geräten funktioniert.

Du kannst in der GSC direkt prüfen, ob deine Webseite bereits von Google indexiert wurde. Gehe dazu in deine Search Console und suche den Menüpunkt „Nutzerfreundlichkeit auf Mobilgeräten“:

Auf der rechten Seite siehst du, ob deine Seite Fehler bei der Indexierung für mobile Endgeräte aufweist. Wenn ja, solltest du die Fehler schnellstmöglich beheben.


Mobile first


Worauf du aus SEO-Sicht achten musst

Es gibt eine Reihe von Punkten, auf die du achten musst, wenn du deine Webseite gerade erstellst. Auch wenn du mit deiner Webseite einen Relaunch planst, solltest du sicherstellen, dass die folgenden Elemente in allen Versionen gleich sind:

  • Texte
  • Audios
  • Beschreibungen
  • Bilder
  • Links
  • Meta-Tags
  • Videos
  • Titel
  • strukturierte Daten


3 SEO Tipps für die mobile Optimierung

Du hast 3 wichtige Stellschrauben für die mobile Optimierung Deiner Website.

  • Bilder
  • Textinhalte
  • Seitenelemente

Bilder auf mobilen Webseiten

Versuche, die Anzahl der Bilder zumindest für die mobile Version etwas einzuschränken.

Wenn du WordPress benutzt, kannst du in Abhängigkeit vom Theme die Bilder für die verschiedenen Geräte an- oder abschalten. Es ist auch klar, dass die vermeintlich tollen Slider, die man in Desktopversionen oft sieht, für die mobilen Geräte kaum sinnvoll sind. Sie nehmen wichtigen Platz weg und fressen Ladezeit. Hier musst du einen gesunden Kompromiss zwischen Design und Lesbarkeit deiner Webseite finden.

Surfe einfach mal auf deiner eigenen Webseite mit deinem Smartphone und beobachte dich selbst dabei. Schaust du dir die Slider wirklich an?

Textinhalte an die mobilen Nutzer anpassen

Besucher von Webseiten, die mobil unterwegs sind haben weniger Zeit und Geduld. Aus diesem Grund sollten deine Inhalte leicht zugänglich und präzise sein. Vermeide Worthülsen, sondern komme auf den Punkt. Ein gut strukturierter Text mit Fettdruck und Aufzählungen ist einfacher lesbar. Die Augen des Betrachters erhalten Ankerpunkte, die der besseren Orientierung und Erfassung dienen.

Erforderliche Elemente für das mobile Design

Google hat eine Liste mit allen Elementen erstellt, die es in seinem Ranking-Algorithmus berücksichtigt. Diese Liste richtet sich an Entwickler und enthält eine vollständige Übersicht darüber, worauf Google beim Crawlen einer Website achtet. Es lohnt sich, diese Informationen zur Hand zu haben, besonders wenn du mit WordPress arbeitest - viele Themes führen hier oft zu Fehlern. Die folgenden Dinge sind wichtig:

  • Wie sieht dein Inhalt aus?
  • Inline-Links und Weiterleitungen
  • Größe des Inhalts
  • Text
  • Buttons
  • Scrollbarkeit

Schenke besonders den Elementen zum Anklicken, wie Buttons Beachtung. Diese Elemente sollten ausreichend groß sein und nicht zu dicht beieinander liegen. So stellst Du sicher, dass besonders Personen mit breiten Fingerkuppen das Element bequem und ohne Fehlerquote anklicken können. Damit leistest du einen Beitrag zur Benutzerfreundlichkeit Deiner Webseite.

Kontrolle mit YOAST SEO 

Du benutzt WordPress zur Erstellung deiner Webseiten? Wenn du das Plugin Yoast SEO installiert hast, kannst du sehr schnell prüfen, wie deine Webseite in der mobilen Darstellung angezeigt wird:

mobile Ansicht

Du siehst, dass die mobile Ansicht etwas anders aussieht, als die Desktop-Version. In einigen Fällen liest Google sogar das Beitragsbild aus. In diesem Fall hat sich ein quadratisches Bild als Beitragsbild bewährt.
Speziell für WordPress-Fans empfehle ich den Beitrag zu „Yoast SEO“.

Fazit

Smartphones und Tablets bestimmen immer mehr unser Leben. Optimiere deine Webseite unbedingt für die mobile Internetnutzung, denn Google bevorzugt Webseiten, die nach „Mobile First“ erstellt sind, schnell laden und die beste Antwort auf die Intention der Nutzer liefern.

0 of 500

Autor

Simone Sarodnick

Simone Sarodnick unterstützt seit 2017 Unternehmen erfolgreich dabei, bei Google in den Top 10 sichtbar zu sein.
Sie ist von der IHK zertifizierte SEO/SEA-Managerin. Ihr Wissen teilt sie außerdem in SEO-Workshops und als Speakerin zum Thema SEO.