Mobile-First-Indexierung: Optimierung für kleine Bildschirme

Jahrelang behandelte Google die Desktop-Version einer Website als die "primäre" Version und die mobile Version als eine "Alternative". Diese Ära ist vorbei.

Mit Mobile-First-Indexierung verwendet Google überwiegend die mobile Version Ihres Inhalts für die Indexierung und das Ranking. Wenn Ihre Website exzellenten Desktop-Inhalt hat, aber eine abgespeckte oder fehlerhafte mobile Version, werden Ihre Rankings leiden – sogar für Nutzer, die auf dem Desktop suchen.

Dieser Leitfaden erklärt, wie Sie sicherstellen, dass Ihre Website in einer Mobile-First-Welt überlebt und gedeiht.

1. Was ist Mobile-First-Indexierung?

Es ist wichtig, ein häufiges Missverständnis zu klären: Es gibt keinen separaten "Mobile Index". Es gibt nur einen Google Index.

• Der alte Weg: Googlebot (Desktop) crawle Ihre Website. Er entschied Ihr Ranking basierend auf dem, was er auf einem großen Bildschirm sah.
• Der aktuelle Weg: Googlebot (Smartphone) crawlt Ihre Website. Er entscheidet Ihr Ranking basierend auf dem, was er auf einem mobilen Bildschirm sieht.

Die Implikation: Wenn Sie Inhalte auf Mobilgeräten verstecken, um "Platz zu sparen" (z. B. durch Entfernen von Text oder Tabs), kann Google diesen Inhalt effektiv nicht mehr sehen. Er wird nicht indexiert.

2. Die Lösung: Responsive Web Design

Während Sie eine separate mobile Website haben können (m.beispiel.de), empfiehlt Google dringend Responsive Web Design.

Responsive Design bedeutet, dass Ihre Website denselben HTML-Code und dieselbe URL für alle Geräte verwendet, aber CSS nutzt, um das Layout basierend auf der Bildschirmgröße zu ändern.

Das entscheidende Tag: Der Viewport

Damit Responsive Design funktioniert, muss jede Seite auf Ihrer Website das folgende Meta-Tag im <head>-Bereich enthalten:

<meta name="viewport" content="width=device-width, initial-scale=1">

Diese Zeile sagt dem Browser: "Skaliere diesen Inhalt, damit er zur Breite des spezifischen, verwendeten Geräts passt." Ohne dies versuchen mobile Browser, die Desktop-Version zu rendern und zu verkleinern, was Nutzer zum Zoomen zwingt (ein großer Fehler in der Benutzerfreundlichkeit).

3. Die Regel der "Content Parity" (Inhaltsgleichheit)

Um bei der Mobile-First-Indexierung erfolgreich zu sein, müssen Sie Parität (Gleichheit) zwischen Ihren Desktop- und Mobilversionen sicherstellen.

• Gleicher Inhalt: Text, Bilder und Videos müssen identisch sein. Fassen Sie Ihre Artikel für mobile Nutzer nicht zusammen.
• Gleiche strukturierte Daten: Schema-Markup (JSON-LD) muss auf der mobilen Version vorhanden sein.
• Gleiche Metadaten: Titel und Meta-Beschreibungen müssen gleich sein.
• Visueller Check: Achten Sie darauf, dass Anzeigen oder Pop-ups (Interstitials) den Inhalt auf Mobilgeräten nicht verdecken. Google rät von aufdringlichen Interstitials ab, weil sie den Zugang zum Inhalt erschweren.

4. Mobile Probleme finden

Google hat den Bericht „Nutzerfreundlichkeit auf Mobilgeräten“ in der Search Console und den Test auf Optimierung für Mobilgeräte im Dezember 2023 eingestellt. Prüfen Sie Seiten heute mit Lighthouse in den Chrome DevTools oder mit PageSpeed Insights und testen Sie auf einem echten Smartphone.

Hier sind drei häufige Mobilprobleme (die Namen stammen aus dem alten Bericht) und wie Sie sie beheben:

Fehler A: "Text ist zu klein zum Lesen"

• Das Problem: Die Schriftgröße ist so klein, dass Nutzer zoomen müssen, um zu lesen.
• Die Lösung: Google empfiehlt eine Basisschriftgröße von mindestens 16px für Fließtext. Überprüfen Sie Ihr CSS, um sicherzustellen, dass Sie Schriftarten nicht auf feste kleine Größen (z. B. 10px) einstellen.

Fehler B: "Anklickbare Elemente liegen zu dicht beieinander"

• Das Problem: "Wurstfinger-Syndrom." Buttons oder Links sind so nah beieinander, dass ein Nutzer, der versucht, auf "Abbrechen" zu tippen, versehentlich auf "Senden" tippt.
• Die Lösung: Stellen Sie sicher, dass Touch-Ziele mindestens 48x48 Pixel groß sind und ungefähr 8 Pixel Abstand zwischen ihnen haben.

Fehler C: "Inhalt ist breiter als der Bildschirm"

• Das Problem: Der Nutzer muss horizontal scollen (von links nach rechts), um die ganze Seite zu sehen. Das ist ein striktes "No-Go" in der UX.
• Die Lösung: Dies wird normalerweise durch ein Bild oder eine Tabelle mit fester Breite verursacht (z. B. width: 800px). Ändern Sie feste Breiten in relative Breiten (z. B. max-width: 100%) in Ihrem CSS, damit Elemente automatisch schrumpfen.

Fazit

Mobile-First-Indexierung ist keine Einstellung, die man abschalten kann; sie ist der Normalzustand des Webs. Mit Responsive Design, gleichwertigen Inhalten und Tests auf echten Smartphones und mit Lighthouse sorgen Sie dafür, dass Ihre Website für alle funktioniert, die auf kleinen Bildschirmen surfen.