Mobile First

Auf dem Handy zäh und unübersichtlich?

Wir sehen uns die mobile Fassung auf echten Geräten an — Bedienbarkeit, Ladezeit und was dort tatsächlich ankommt.

Mobile First ist ein Gestaltungs- und Entwicklungsansatz, bei dem eine Website zuerst für kleine Bildschirme entworfen und gebaut wird — und erst danach für größere erweitert. Der Grund ist nicht Ideologie, sondern Zwang zur Reduktion: Auf einem schmalen Bildschirm muss man entscheiden, was wirklich wichtig ist. Nicht zu verwechseln mit Responsive Design, das beschreibt, dass sich ein Layout anpasst.

Kurz zusammengefasst:

• Reihenfolge, kein Ergebnis: erst klein, dann groß.
• Der eigentliche Nutzen ist der Zwang zur Priorisierung.
• Google bewertet Websites anhand der mobilen Fassung.
• Mobil ist bei Core Web Vitals fast immer der kritische Wert.
• Häufigster Fehler: mobil weglassen, statt neu ordnen.

Warum die Reihenfolge zählt

Beim umgekehrten Weg — erst Desktop, dann verkleinern — entsteht ein absehbares Muster: Der Entwurf ist fertig, alles ist untergebracht, und für Mobilgeräte wird gequetscht, gestapelt und eingeklappt. Was übrig bleibt, ist eine Notlösung.

Beginnt man klein, muss man von Anfang an entscheiden: Was ist die eine Sache, die diese Seite leisten soll? Was gehört nach oben? Was kann weg? Diese Entscheidungen verbessern auch die Desktop-Fassung — sie werden nur meist nie getroffen, weil dort genug Platz ist.

Was das praktisch heißt

• Inhalt zuerst. Reihenfolge und Wichtigkeit festlegen, bevor gestaltet wird.
• Von unten aufbauen. Grundlayout für kleine Bildschirme, Erweiterungen für größere — nicht umgekehrt.
• Touch-Ziele groß genug und mit Abstand. Ein Finger ist ungenauer als ein Mauszeiger.
• Keine Mausabhängigkeit. Was nur bei Mauskontakt erscheint, gibt es auf dem Handy nicht.
• Formulare kürzen. Jedes Feld kostet mobil deutlich mehr als am Schreibtisch. Passende Tastaturtypen einstellen.
• Bilder in der passenden Größe ausliefern — nicht das Desktop-Bild herunterskalieren.
• Auf echten Geräten testen. Der Simulator im Browser zeigt das Layout, nicht die Geschwindigkeit und nicht die Bedienung.

Der letzte Punkt macht in der Praxis den größten Unterschied. Ein Mittelklasse-Telefon in einem durchschnittlichen Mobilfunknetz ist ein anderes Gerät als ein Laptop mit Glasfaser.

Der häufigste Fehler

Inhalte mobil ausblenden. Weil der Platz knapp ist, wird ein Abschnitt per CSS versteckt — der Text ist dann zwar nicht sichtbar, wird aber trotzdem geladen und bleibt Teil der Seite.

Zwei Probleme entstehen: Google bewertet die mobile Fassung; was dort für Nutzer nicht erreichbar ist, zählt entsprechend weniger. Und die Ladezeit verbessert sich nicht, weil der Inhalt trotzdem übertragen wird.

Die bessere Lösung ist fast immer, den Inhalt anders anzuordnen statt ihn zu verstecken — oder ihn zugänglich einzuklappen, sodass er auf Wunsch erscheint.

Mobile First und Ladezeit

Beide Themen hängen enger zusammen, als es scheint. Wer mobil zuerst denkt, lädt weniger: kleinere Bilder, weniger Skripte, weniger dekorative Elemente. Genau das verbessert die Werte, die Google in den Core Web Vitals misst — und dort ist der mobile Wert praktisch immer der schlechtere.

Häufige Fragen

Ist Mobile First dasselbe wie Responsive Design?

Nein. Responsive beschreibt, dass sich das Layout an die Bildschirmgröße anpasst. Mobile First beschreibt die Reihenfolge beim Entwerfen und Bauen — man kann responsiv arbeiten und trotzdem beim Desktop anfangen.

Was bedeutet Mobile-First-Indexierung?

Google bewertet Websites anhand ihrer mobilen Fassung. Was dort fehlt, wird entsprechend berücksichtigt — auch wenn es auf dem Desktop vorhanden ist.

Darf ich Inhalte mobil ausblenden?

Besser nicht. Was für mobile Nutzer nicht erreichbar ist, zählt weniger, und die Ladezeit verbessert sich nicht, weil der Inhalt trotzdem übertragen wird. Umsortieren oder zugänglich einklappen ist die bessere Lösung.

Wie teste ich richtig?

Auf echten Geräten, nicht nur im Simulator — und nicht nur im WLAN. Ein Mittelklasse-Telefon in einem durchschnittlichen Netz zeigt die Realität deutlich besser.

Was ist mit Tablets?

Sie liegen dazwischen und werden häufig übersehen. Ein Layout, das zwischen Handy und Desktop springt, ohne die mittlere Breite zu berücksichtigen, wirkt dort oft unfertig.

Lohnt sich der Aufwand bei geringem mobilem Anteil?

Der Anteil ist meist höher als angenommen — und die Bewertung durch Google erfolgt ohnehin anhand der mobilen Fassung. Ein Blick in die eigenen Zahlen lohnt vor der Entscheidung.