Mobile First: Die mobile Optimierung von Webseiten

Was ist "Mobile First"?

Mobile First Indexing heißt, dass Google den Fokus bei der Indexierung von Webseiten auf die mobile Version einer Seite legt. Die Suchmaschine bewertet Webseiten also danach, ob sie für mobile Geräte optimiert sind. Sind sie es nicht, wirkt sich das negativ auf Relevanz und Ranking in der Google-Suche aus.

Das Unternehmen hat den Mobile First Index 2018 als Reaktion auf die hohe Smartphone-Nutzung eingeführt. Seitdem steht die mobile Optimierung in der Bewertung über der Desktop-Variante einer Website.

Warum? Etwa 95 % der Deutschen besitzen ein Smartphone. Statista hat zum Ende des Jahres 2022 von 62,6 Millionen Smartphone-Nutzerinnen und -Nutzern gesprochen. Und die Prognose für 2023 sagt weiter steigende Zahlen voraus.

Deshalb geht ohne die mobile Optimierung von Websites und somit ohne Mobile First gar nichts mehr! Wer für Smartphone und Tablet keine gute Webseite hat, bleibt in den Suchmaschinen unsichtbar.

Warum ist mobile Optimierung wichtig?

Der Hauptgrund ist bereits genannt worden: ohne mobile Optimierung keine Sichtbarkeit im Internet. Zumindest keine Gute. Wenn eine Webseite Mobile First-SEO nicht berücksichtigt, wird das Ranking in den Suchmaschinen nicht gut sein.

𝗗𝗶𝗲 𝗞𝗼𝗻𝘀𝗲𝗾𝘂𝗲𝗻𝘇: Wer mit seinem Unternehmen in den Ergebnissen der Suchmaschinen nicht möglichst weit oben erscheint, hat kaum eine Chance, geklickt zu werden. Deshalb peilen Unternehmer:innen natürlich Seite 1 der Suchergebnisse an. Sichtbarkeit, Traffic und letztendlich Conversions sind die Hauptziele jeder Firma, weil der Umsatz davon abhängt.

Conversions heißt, dass aus Besucher:innen einer Website Kundinnen und Kunden werden, die etwas kaufen. Oder die zumindest eine gewünschte Aktion ausführen, wie das Anmelden für einen Newsletter oder das Hinterlegen von Kontaktdaten für bestimmte Informationen.

Die Conversion Rate ist dabei das Verhältnis von der Anzahl der Conversions zur Anzahl der Besucher:innen. Das heißt, dass eine hohe Conversion Rate ein Indikator dafür ist, dass die Website oder die Anwendung attraktiv und benutzerfreundlich ist. Sonst würde niemand konvertieren.

Je besser eine Website auf allen Geräten funktioniert, desto zufriedener sind die Menschen damit. Und je zufriedener (potenzielle) Kund:innen sind, desto größer ist die Chance, höhere Umsätze zu generieren.

Die Gründe im Überblick

Es geht bei der Optimierung von Websites für mobile Geräte um Dinge wie die Benutzererfahrung und darum, dass Besucherinnen und Besucher nicht sofort wieder von der Seite abspringen. Was mit hoher Wahrscheinlichkeit passiert, wenn eine Seite nicht im Sinne von Mobile First optimiert ist. Es frustriert, wenn eine Website auf dem Handy nicht funktioniert oder das Layout komplett verschoben ist und ich nichts erkennen kann.

Eine solche Frustration kann heutzutage sehr viele Menschen betreffen, weil in unserer Gesellschaft so gut wie jede:r über mobile Geräte ins Internet geht. Die mobile Revolution ist schon weit fortgeschritten und wird auch nicht allzu bald wieder rückläufig sein. Wenn eine Website also nicht mobil optimiert ist, verpassen Unternehmen womöglich ihre Zielgruppe.

Damit geht einher, dass die Menschen bestimmte Erwartungen an Unternehmen und Dienstleister haben. Einerseits, dass sie überhaupt im Netz präsent sind, andererseits, dass Leistung und Benutzererfahrung von Webseiten gut sind. Wer nicht mithalten kann, riskiert, dass Kundinnen und Kunden zur Konkurrenz wechseln.

Ein weiterer Grund ist die Suchmaschinenoptimierung (SEO). Mobile First ist ein Teilaspekt einer guten SEO-Strategie, die letztendlich für gute Rankings verantwortlich ist.

Techniken zur Umsetzung des MFI

Es gibt nicht nur eine mobile Optimierungstechnik. Verschiedene Methoden können sicherstellen, dass eine Webseite auf mobilen Geräten funktioniert. Am bekanntesten ist wohl das Responsive Webdesign. Zumindest ist es das, was man am häufigsten liest, wenn man sich mit dem Thema beschäftigt.

Responsive Webdesign

Responsive Webdesign ist ein Designansatz, bei dem sich eine Webseite automatisch an Größe und Format des Bildschirms anpasst, auf dem sie angezeigt wird. Das heißt, dass die Webseite auf allen Geräten, egal ob Desktop, Tablet oder Smartphone, gut aussieht und leicht zu bedienen ist. Responsiv bedeutet reagierend und ist somit das Gegenteil einer statischen Website.

Um ein responsives Design zu implementieren, nutzen Webentwickler flexible Layouts und Grids, die sich an die Größe des jeweiligen Bildschirms anpassen. Mithilfe von HTML5 und CSS-Media Queries werden verschiedene Stile für verschiedene Bildschirmgrößen und -auflösungen definiert.

Responsive Webdesign hat sich zu einer der beliebtesten Techniken für die Entwicklung von mobil optimierten Webseiten gemausert. Das liegt daran, dass es sicherstellt, dass Nutzer:innen unabhängig vom Gerät eine optimale Benutzererfahrung haben.

Dynamic Serving

Dynamic Serving (dynamische Bereitstellung) ist eine Technik, bei der immer eine andere Version der Webseite beziehungsweise ihres Inhalts angezeigt wird. Je nachdem, welches Gerät zum Aufrufen genutzt wird.

Das wird erreicht, indem der Webserver die User-Agent-Zeichenfolge des Nutzers prüft und entsprechende HTML- und CSS-Dateien an den Browser sendet. Dynamic Serving kann eine gute Wahl sein, wenn sich die Inhalte oder Layouts auf Desktop-Geräten von denen auf Mobilgeräten unterscheiden sollen.

Hier ist der technische Aufwand höher als beim Responsive Webdesign, weil der Webserver die Inhalte dynamisch anpassen muss. Wegen des Mobile First Indexing muss man außerdem penibel darauf achten, dass die mobile Version mit Dynamic Serving vollständig und qualitativ einwandfrei ist, um in den Suchergebnissen gut abzuschneiden.

Separate URL für Desktop und Mobile

In der Regel empfiehlt es sich, eine einzige URL für Desktop- und Mobile-Geräte zu verwenden. Das macht die Verwaltung der Webseite einfacher und kann dabei helfen, dass sie in den Suchergebnissen besser gefunden wird.

Wenn Sie unterschiedliche Inhalte oder Layouts für Desktop und mobile Geräte bereitstellen, kann es aber sinnvoll sein, unterschiedliche URLs zu verwenden. So gäbe es zwei Versionen der Webseite und die Suchmaschinen können die spezifischen Versionen für jedes Gerät crawlen und indexieren. Im Unterschied zum Dynamic Serving sind die Seiten hier technisch ganz klar voneinander getrennt, was eine bessere Performance und Usability verspricht.

Bei unterschiedlichen URLs sollte sichergestellt werden, dass die "Vary: User-Agent"-HTTP-Header-Zeichenfolge verwendet wird, um den Suchmaschinen mitzuteilen, dass es sich um unterschiedliche Versionen der gleichen Webseite handelt. Auch sollten die "rel=canonical"- und "rel=alternate"-Meta-Tags verwendet werden, um die Beziehungen zwischen den verschiedenen URLs klarzustellen.

Accelerated Mobile Pages

Accelerated Mobile Pages (AMP) ist ein offener Standard, der die Ladezeit von Webseiten auf mobilen Geräten beschleunigen soll. Ein OpenSource Framework, an dem Google federführend beteiligt gewesen ist.

Mithilfe von AMP können Webentwickler speziell optimierte Versionen von Webseiten erstellen, die schneller laden und besser auf mobilen Geräten funktionieren. AMP verwendet dafür eine eigene HTML-Variante, die auf Schnelligkeit und Leistung hin optimiert ist. Sie verbietet bestimmte Funktionen und Technologien, die die Ladezeit verlangsamen könnten. Wie bereits erwähnt sorgt die Schnelligkeit einer Website dafür, dass Menschen länger auf der Seite bleiben und die Absprungrate nicht so hoch ist.

Aber: Auch die Implementierung von AMP erfordert einen höheren technischen Aufwand. Außerdem gibt es Einschränkungen hinsichtlich der Funktionen und Technologien.

Weitere To-dos für mobile Optimierung

Es gibt einige Dinge, die man beachten sollte, um Webseiten für mobile Geräte zu optimieren. Dabei geht es nicht nur um das, was man auf den ersten Blick sieht. Auch technisch muss im Hintergrund einiges rund laufen, damit Mobile First funktioniert.

1. Schnelle Ladezeiten: Die Ladegeschwindigkeit ist extrem wichtig für eine gute Nutzererfahrung. Lädt eine Seite zu langsam, klickt man schnell weiter. Deshalb sollte sie so schnell wie möglich laden, sowohl mobil als auch am Computer.
2. Klare Hierarchie und gut lesbarer Text: Stellen Sie sicher, dass der Text auf der Webseite gut lesbar ist und dass die Hierarchie der Inhalte klar ist, damit Nutzer:innen schnell finden, wonach sie suchen.
3. Gute Navigation: Achten Sie darauf, dass die Navigation auf der Webseite auf mobilen Geräten leicht zu bedienen ist. Indem Sie zum Beispiel eine Dropdown-Navigation oder bekannte beziehungsweise eindeutige Symbole für die wichtigsten Links verwenden.
4. Optimierte Bilder: Verkleinern Sie die Größe von Bildern, um sicherzustellen, dass sie schnell geladen werden. Verwenden Sie am besten Bildformate wie JPEG oder PNG.
5. Keine Pop-ups: Pop-ups sind auf mobilen Geräten oft lästig und können die Benutzererfahrung negativ beeinflussen. Vermeiden Sie deshalb wenn möglich Pop-ups, die sich automatisch öffnen. Geht das nicht, beschränken Sie sie zumindest auf ein Minimum.

Wer sorgt für die Optimierung einer Website?

Die mobile Optimierung passiert nicht automatisch, sondern muss extra programmiert werden. Wird das nicht gemacht, kann eine Website am Computerbildschirm zwar gut aussehen - auf dem Smartphone aber verschoben, unlesbar und nicht funktional sein.

Die mobile Website sollte exakt dieselben Inhalte und Metadaten haben, wie die Version für den Computer. Außerdem muss auf die verschiedenen Bildschirmgrößen geachtet werden, denn auch da gibt es Unterschiede.

Es ist nicht so, dass ein Entwickler ein paar Dinge anpasst und schon funktioniert eine Seite ausnahmslos auf allen Tablet- und Smartphone-Bildschirmen. Es kann durchaus sein, dass die Website auf dem einen Handy gut aussieht und auf dem nächsten Bildschirm, der womöglich etwas kleiner oder größer ist, noch nicht. Oft sind mehrere Anpassungsschritte und Prüfungen notwendig, damit alles passt. Dabei sollte übrigens auch mit verschiedenen Browsern getestet werden.

Deshalb wird die mobile Optimierung einer Website in der Regel von Webentwicklern oder Webdesignern übernommen. Auch bei FKT42 sorgen unsere Expert:innen dafür, dass die Webseiten unserer Kundinnen und Kunden auf mobilen Geräten optimal angezeigt werden. Und auch dafür, dass die Nutzerfreundlichkeit gewährleistet ist.

Fazit

Mobile First bedeutet, dass Google zuerst die mobile Version einer Webseite crawlt und indexiert. Erst danach wird die Desktop-Variante der Seite verarbeitet.

Deshalb sollten Sie sicherstellen, dass Ihre Webseite für mobile Geräte optimiert ist. Nur so wird sie von Google beim Mobile First Indexing berücksichtigt. Dazu gehört, dass die Webseite schnell lädt, auch auf kleinen Bildschirmen gut lesbar und auf Touch-Geräten leicht zu bedienen ist.

Das ist wichtig, weil schon jetzt die meisten Menschen über mobile Geräte wie Smartphones und Tablets ins Internet gehen und es werden stetig mehr. Mobile First sorgt dafür, dass die Suchergebnisse für diese Nutzer:innen relevant und qualitativ hochwertig sind. Denn vor allem der Suchmaschinenriese Google hat seinen Fokus in den letzten Jahren deutlich auf mobile friendliness gelegt.

Mehr Informationen?

Sie brauchen eine Website und möchten mehr darüber wissen? Fragen Sie uns! Als Webdesign-Agentur informieren wir Sie über alles, was Sie wissen müssen und konzeptionieren und programmieren Ihre Website - selbstverständlich mobil optimiert!

Schreiben Sie uns eine Mail, nutzen Sie unser Kontaktformular oder rufen Sie uns einfach an, um einen Termin zu vereinbaren. Wir erstellen Ihnen gerne ein Angebot – selbstverständlich kostenlos und unverbindlich!