Mobile First vs. Desktop First: Die verschiedenen Herangehensweisen im Webdesign

Veröffentlicht am: 14. November 2023

Beitragsabschnitte

Ein entscheidender Schritt beim Designen einer neuen Webpräsenz ist die Entscheidung, ob der Fokus des Designs auf mobilen Endgeräten oder auf Desktop-Monitoren liegt. Natürlich wird die jeweils andere Option nicht vernachlässigt und die neue Website wird für alle Größen optimiert, allerdings muss es einen Fokus geben, auf den das Layout im ersten Schritt zugeschnitten wird.

Die Grundlagen verstehen

Bevor wir uns in die Tiefe stürzen, ist es wichtig, die Grundprinzipien beider Ansätze zu verstehen. “Mobile First” bedeutet, dass die Website von Anfang an für mobile Geräte optimiert wird und sich dann auf größere Bildschirme ausdehnt. Im Gegensatz dazu steht “Desktop First”, bei dem die Website für Desktop-Geräte entwickelt wird und dann für kleinere Bildschirme angepasst wird.

Icons die Mobile vs Desktop darstellen

Mobile First: Usability im Fokus

Der “Mobile First”-Ansatz konzentriert sich auf die Optimierung einer Website von Beginn an für mobile Geräte. Diese Ausrichtung bringt verschiedene Vorteile mit sich, insbesondere im Hinblick auf die Nutzerfreundlichkeit. Die Benutzeroberfläche wird speziell auf die begrenzten Bildschirmgrößen und die Touch-Navigation von Smartphones zugeschnitten, was eine angenehme Erfahrung für Besucher auf mobilen Geräten gewährleistet.

Unnötiger Schnickschnack hat meist kein Platz auf einer mobilen Darstellung einer Website. Daher muss man sich beim Mobile First-Gedanken schon ganz am Anfang damit auseinandersetzen, welche Inhalte wirklich relevant sind und auf welche Weise man sie auf dem kleinen Display darstellt.

Zudem trägt die mobile Optimierung dazu bei, die Ladezeiten zu verkürzen, was in der heutigen schnelllebigen Online-Welt von entscheidender Bedeutung ist.

Icons die einen Mobile First Ansatz darstellen

Das Vorgehen:

Sobald man herausgearbeitet hat, welche Inhalte wirklich von Bedeutung sind, erstellt man das Layout. Hierbei fokussiert man sich rein auf die Darstellung der kleinen Smartphone Displays. Nachdem die Seite und das Layout steht, erweitert man dann Schrittweise die Größe des Displays. Man macht sich also danach Gedanken, wie die Inhalte auf einem Tablet und folgend dann auf einer großen Desktop-Darstellung angezeigt werden. Dadurch versucht man sicherzustellen, dass später auch auf dem Desktop keine unnötigen Inhalte oder Elemente genutzt werden.

Desktop First: Komplexität und mehr Platz zum Austoben

Die größeren Bildschirme eröffnen Raum für detaillierte Gestaltung und ermöglichen eine übersichtliche Präsentation von umfangreichen Informationen. Dies ist insbesondere in Branchen oder Unternehmen mit komplexen Dienstleistungen oder Produkten von Vorteil. Zudem kann die Desktop-Optimierung die Nutzung spezifischer Desktop-Funktionen und -technologien ermöglichen, die auf mobilen Geräten möglicherweise eingeschränkt sind.

Icons die einen Desktop First Ansatz darstellen

Das Vorgehen:

Das Layout und die Inhalte werden für die Größe von PC Monitoren erstellt. Der Fokus kann hier neben der komplexeren Darstellung der Inhalte vor allem auch auf verschiedensten Designelementen liegen. Diese Elemente transportieren dann nicht zwingend erforderlichen Content, können aber maßgeblich die Ästhetik unterstreichen und bieten mehr Optionen, das Branding deines Unternehmens auszuleben und zu transportieren.

Umgekehrt als beim Mobile First-Gedanken, wird nun die Displaydarstellung schrittweise verringert. Jetzt muss geschaut werden, dass sich der Content auch richtig auf die immer kleiner werdenden Displays umbricht und darstellt. Es kann vorkommen, dass man einige Elemente, die man in der Desktop-Darstellung verwendet, für die Darstellung auf Smartphones ausblendet. Grund dafür kann die Performance der Seite oder schlichtweg Platzmangel sein.

Fazit: Nutzererfahrung als oberstes Ziel

Egal für welchen Ansatz du dich entscheidest, das ultimative Ziel sollte immer die Verbesserung der Nutzererfahrung sein. Eine positive und reibungslose Online-Erfahrung ist entscheidend, um Besucher zu binden, unabhängig von der Plattform, die sie verwenden.

In einer sich ständig weiterentwickelnden digitalen Welt ist es wichtig, flexibel zu bleiben und sich kontinuierlich an die Bedürfnisse der Zielgruppe anzupassen. Ob Mobile First oder Desktop First – letztendlich geht es darum, Nutzer zu begeistern und ihnen eine unvergessliche Online-Erfahrung zu bieten.

Wir selbst haben schon beide Varianten gesehen und umgesetzt. So wie beide Herangehensweisen ihre Vorteile aufweisen, gibt es beim Erstellen von beiden Varianten allerdings auch ihre individuellen Stolpersteine. Die meisten Seiten, die wir erstellen, gehen nach dem Desktop-First-Modell. Wir arbeiten aktuell lieber mit dem Workflow, am Ende überschüssige Elemente herauszustreichen, als umgekehrt zu überlegen, wie wir den Mobile-Content für eine schönere Desktop-Darstellung aufbauschen können.

Natürlich nehmen wir uns am Ende auch noch mal die Zeit, die Seiten dann auch auf Smartphones bestmöglich darzustellen und performen zu lassen. Das ist sicherlich ein Punkt, der weniger Zeit in Anspruch nehmen würde, wenn wir uns für den Mobile-First-Ansatz entscheiden würden, allerdings kommen wir mit dem Workflow super zurecht und unseren Kunden fällt es leichter, ein Verständnis ihrer neuen Seite zu bekommen.

 
 
 
Dein Warenkorb
0
Rabattcode hinzufügen
Gesamtsumme
Total Installment Payments
Gesamtrabatt