Skip to main content

Stell dir mal vor, du bist Inhaber einer Autowerkstatt. Ein potentieller Kunde ist mit seinem Auto liegen geblieben und möchte schnell erfahren, wie lange deine Werkstatt offen hat oder wie die Kontaktdaten lauten. Er besucht deine Website und stellt fest, dass die Website überhaupt nicht für sein Smartphone geeignet ist. Alles ist zu klein, Buttons oder Links können nicht geklickt werden und die Bilder brauchen verdammt lange zu laden.

Adieu Datenvolumen und tschüss potentieller Kunde!

Die Optimierung von Webdesigns für die verschiedenen Endgeräte ist mittlerweile schon eine Pflicht. Man mag davon halten, was man will: Schaut man sich mal in einem Café um, sitzen nahezu alle mit einem Smartphone oder Tablet an ihrem Tisch. Oder es liegt ein Smartphone in greifbarer Nähe.

Immer mehr Menschen surfen nicht mehr mit dem klassischen PC im Internet. Man kennt es ja selbst: Das Tablet oder das Smartphone ist immer griffbereit – der ständige Begleiter in der Hosentasche kann ja auch alles. Warum also extra an den Schreibtisch setzen?

Deshalb wird es für Betreiber von Websites immer wichtiger, diesen Nutzern den Inhalt der Seite ordentlich zu präsentieren. Also muss bereits in der Entwicklung die Seite für diese Endgeräte optimiert werden. In der Webentwicklung spricht man hier von einem „responsive Webdesign“. Angefangen hat alles mit der Auslagerung von eigenständigen „mobilen Versionen“ von Websites.

Diese – zugegen ziemlich hässlichen – mobilen Seiten boten nur ausgesuchte, sehr abgespeckte Infos. Heutzutage gibt es unzählig viele unterschiedliche Geräte mit unterschiedlichen Auflösungen und Displaygrößen. Der nächste Schritt in der Entwicklung war die Einführung des responsiven Webdesigns.

Richtig eingesetzt passt sich die Website zur Laufzeit, also ohne Neuladen, an die unterschiedlichen Bildschirmgrößen an – und überall sieht es gut aus!

Was ist „Mobile First“?

Mobile First bezeichnet ein Konzept im Webdesign, bei dem die Darstellung auf mobilen Endgeräten die höchste Priorität bei der Webentwicklung einer Website besitzen soll. Die für die mobilen Endgeräte optimierte Version wird zuerst programmiert und anschließend sukzessiv erweitert. Man arbeitet sich also von der kleinsten Layout Version (Smartphone) hin zur größten (Desktop PC).

Da auf dem kleinen Bildschirm des Smartphones nur wenige Informationen auf einmal angezeigt werden können und Bereiche mitunter wegfallen oder anders platziert werden, muss man sich bei der Gestaltung auf das Wesentliche konzentrieren.

Welche Elemente und Informationen sind also wichtig für den Besucher?

Wie schnell sollen sie ihn erreichen? Idealerweise kommt man bei diesem Vorgehen zu einem simplen und schlichten Webdesign – ganz nach dem Motto „weniger ist mehr“. Diese minimalistische Designlösung kann anschließend für größere Bildschirme verwendet werden.

Das Konzept „Mobile First“ schlägt also vor, den Platzmangel auf kleinen Bildschirmen zum Vorteil zu machen und auf unwichtige Informationen und Bedienelemente zu verzichten. Eine reduzierte Designlösung, die außerdem benutzerfreundlich und übersichtlich ist, ist das Ziel!

Hilfe, meine Seite ist nicht responsive!

Keine Sorge! Es ist möglich, bestehende Seiten für mobile Endgeräte aufzubereiten. Allerdings ist damit auch viel Aufwand verbunden. Oft und vor Allem bei kleineren Webprojekten lohnt es sich eher, einen kompletter Relaunch der vorzunehmen. Alte und verstaubte Seiten gehören ins Museum!

Kleiner Tipp: Mit Hilfe dieses Google Tools kannst du deine Website auf die Optimierung für mobile Geräte checken!

https://search.google.com/test/mobile-friendly

Lust zu schnacken?

Komm rum!

Schreib uns was schönes

    Slide in unser Postfach!

    Mit einem Stern * gekennzeichnete Felder sind Pflichtfelder.

    Mit dem Absenden des Formulars akzeptierst Du die Datenschutzerklärung.

    Sie sehen gerade einen Platzhalterinhalt von Google reCAPTCHA. Um auf den eigentlichen Inhalt zuzugreifen, klicken Sie auf den Button unten. Bitte beachten Sie, dass dabei Daten an Drittanbieter weitergegeben werden.

    Weitere Informationen '
    '