Mobile First: Dein Weg zur responsiven Website
Laut einer großen SISTRIX-Erhebung aus dem März 2021 werden auf dem Handy mit 64 Prozent deutlich mehr Suchen durchgeführt als auf dem Desktop (35%). Content, der nicht mobil dargestellt wird, ist kaum noch denkbar – und sollte deshalb nie das Produkt einer Webentwicklung sein, die sich „state of the art“ zum Ziel setzt. In unserem Blog erfährst du, worauf du bei einem Mobile First-Design achten solltest.
Viele Unternehmen bieten keine responsive Website an
Wenn es um die mobile Darstellung der Website geht, hinken viele Unternehmen hinterher: Entweder, es gibt noch keine responsive Website und am Smartphone-Bildschirm wird die normale Website unansehnlich dargestellt. Oder, in der mobilen Version werden Elemente einfach ausgeblendet, um beispielsweise die Menüführung übersichtlicher zu gestalten. Beide Varianten sind mittlerweile alles andere als „state of the art“. Zwar ist die angepasste Version mobil nutzbar, doch warum soll der Smartphone-User auf Elemente verzichten oder: Warum sind diese überhaupt wichtig, wenn sie auf dem stärker genutzten Endgerät nicht angezeigt werden sollen?
Deshalb ist es wichtig, Mobile First zu denken!
Wenn sich eine moderne Webentwicklung mit dem Design einer neuen Website beschäftigt, wird diese zunächst ausschließlich für mobile Geräte angelegt und konzipiert. Dabei wird das Ziel verfolgt, bereits in der mobilen Ansicht alle Elemente gut zu platzieren. Der Gedanke dahinter: Mobile First!
Das hat zum einen Vorteile hinsichtlich der oben geschilderten User-Gewohnheiten, zum anderen bevorzugt Google „Mobile First“: Bei der Mobile First-Indexierung nutzt Google vor allem die mobile Version der Inhalte für die Indexierung und das Ranking. Wer seine Seite also nicht für mobile Endgeräte optimiert, wird in den Suchergebnissen schlecht bis gar nicht ausgespielt.
![](https://www.web-netz.de/wp-content/uploads/01-smartphone-mobile-nutzung-1.jpg)
So solltest du dein Webdesign gestalten
Frei nach dem Motto „function leads design“ sollte bei der Platzierung der Elemente ein besonderes Augenmerk auf die Nutzbarkeit gelegt werden. Versetze dich bei der Konzeptionierung in die Eigenschaften der Nutzer. Am Smartphone kann z.B. nicht mit Interaktion bei Mauskontakten gearbeitet werden. Die Darstellung von langen Inhalten ist mit vielen „Swipes“ verbunden, was - anders als das Scrollen am Mausrad - bei langen Artikeln eine hohe Ausdauer und Aufmerksamkeitsspanne erfordert.
Drei Vorteile eines mobilen Webdesigns
Aus diesen Erkenntnissen, kannst du drei Vorteile für dein mobiles Webdesign ziehen:
- Weniger ist mehr. Die Konzentration auf wesentliche Elemente resultiert in einer nutzerfreundlichen, übersichtlichen Website, auf der sich deine Zielgruppe schnell zurechtfindet. Ein funktionelles Design zahlt außerdem auf die Performance deiner Website ein: Je weniger diese überladen ist, desto schneller lädt sie und lädt User zum Verweilen ein.
- Not macht erfinderisch. Die Herausforderungen, die zweifelsfrei mit einem Konzeptions- und Designansatz auftreten, lassen sich häufig nur mit dem Einsatz moderner Webtechnologien effizient umsetzen. Somit ist zwangsläufig die Umsetzung der Webseite auf einer nachhaltigen und modernen Technologie unausweichlich, was die spätere Wartung dafür stark verschlankt.
- Mobiler Zugang bedeutet mehr Reichweite. Da der Anteil der mobilen Internetnutzer stetig zunimmt, lohnt es sich absolut, Zeit in die mobile Optimierung der Website zu stecken.
„Kann ich Mobile First allein umsetzen?“
Wer kann, der kann, aber: Die technischen Anforderungen an ein responsives Design setzen ein grundlegendes Know-how voraus. In der Webentwicklung arbeiten Designer immer auf der Grundlage eines speziellen Design-Rasters, das sich Grid nennt. Dieses kann für größere Formate entsprechend skaliert werden. Für die optimale Darstellung bei größeren Ausgabegeräten ist zudem die Verwendung und Kenntnis von modernen Technologien ein sehr entscheidender Faktor. Nur so können Inhalte immer optimal dargestellt werden.
Fazit
Es ist wichtig, das Thema Mobil First reflektiert und ruhig zu betrachten. Bei einer geplanten Umsetzung ist stets darauf zu achten, diesen Ansatz zu verfolgen, aber hier kommen bei einem System auf älterer Basis große Aufwände auf Webbetreiber zu. Du solltest dich aber nicht abschrecken lassen, sondern mit einem starken Partner an deiner Seite einen Plan schmieden, wie das Ziel effizient und nachhaltig zu erreichen ist.
Falls
es nicht gleich die große Lösung sein soll: Es lassen sich oft Lösungen eines
“Mobile First Zweitsystems” konzeptionieren, welches als mobile Webseite der
Hauptseite vorgelagert wird, um die Nutzer abzuholen und Schritt für Schritt
das alte System ablöst. Letztlich ist es immer das Ziel, auf allen Endgeräten
eine übersichtliche und leicht bedienbare Webseite an den Start zu bringen,
damit du deine Zielgruppe gut abholst und erreichst.
Viele Grüße,
Alex
Kostenlose Online-Marketing-Webinare
Wir bieten jede Woche kostenlos zwei Webinare an. Alle Themen und die nächsten Termine findet ihr auf: web-netz.de/webinare.
![](https://www.web-netz.de/wp-content/uploads/webnetz-webinare-moderation-750x330-1.png)
Bildnachweis Titelbild: milindri | istockphoto.com
Weiteres Bild: Tatsiana Volkava | istockphoto.com
Autor
webnetz GmbH
Online-Marketing-News direkt ins Postfach
Melden Sie sich jetzt für unseren Newsletter an.
Kommentare