Mobile First

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Mobile First bezeichnet ein Vorgehen bei der Erstellung eines Layouts per CSS. Dabei wird das Layout zuerst für Mobilgeräte (bzw. Geräte mit einem kleinen Bildschirm) entworfen und erst danach die Veränderungen des Ausgangslayouts für Geräte mit größerem Bildschirm als letztes im CSS in einer Media Query notiert.

Der Begriff „kleiner Bildschirm“ ist dabei relativ zu betrachten. Ein 30" Bolide, auf dem eine Webseite mit Zoomstufe 600% dargestellt wird, braucht die gleiche Darstellung wie ein 5" Handy. Ein gewöhnliches Handy im Querformat kann schon ausreichen, um nicht alles untereinander darstellen zu müssen[1].

Angesichts der Tatsache, dass es auch Media Queries für andere Geräteeigenschaften gibt (z. B. pointer oder color-gamut), sollte man besser von Simple First sprechen. Bauen Sie Ihre Seite so, dass sie auf kleinen, einfachen Geräten gut aussieht, und verwenden Sie Media Queries, um sie für größere oder bessere Geräte zu erweitern. Das kann die kleine Smartwatch sein mit vielen Farben und hoher Pixeldichte, aber kleinem Sichtfeld, oder ein riesiges E-Ink Display, dass nur Graustufen kennt.

Mobile First kann allerdings auch die Bevorzugung von mobilen Geräten bezeichnen, was jedoch zu vermeiden ist.

Siehe auch

Referenzen

  1. "Desktop vs schmal", Gunnar Bittersmann zu Rolf B im Self-Forum am 26.03.2021