Veraltete Browser

[Camping_RIDER]

Aloha ;)

In einem der ungezählten Tutorials zu Responsive Design hab ich gelesen, dass im Default das Design fürs Mobile sein sollte (mobiles first). Das hab ich gemacht und dann gesehen dass der IE8, der keine Media-Queries kennt, die Seite stets im mobile-Modus darstellt.

Da hab ich mir gedacht, dass mobiles first irgendwie blödsinnig ist, wo doch Browser, die CSS3 nicht kennen, gar nicht auf mobilen Geräten installiert sind. Also hab ich meine Media-Queries rumgedreht und dafür gesorgt, dass auch ohne MediaQueries ein paar definierte Styles vorliegen.

Nein, mobiles first ist nicht blödsinnig. Tatsächlich hast du das wahrscheinlich sogar angewendet, obwohl du dachtest, es zu missachten. Mobiles first muss nicht unbedingt bedeuten, dass die MediaQueries in dieser Reihenfolge aufeinander aufbauen, sondern dass beim Designvorgang dein Augenmerk erst auf mobiles liegt - weil es im Allgemeinen immer einfacher ist, zunächst für kleine Bildschirme zu bauen und dann für große Bildschirme mit mehr Platz entsprechend umzustellen und auseinanderzuziehen, als zunächst für große Bildschirme zu bauen und dann nicht zu wissen, wo du das auf kleinen Bildschirmen um Himmels willen alles anzeigen sollst.

So zeigen Browser, die keine MediaQueries können, also nicht auf Mobilgeräten installiert sind, die Desktop-Variante (irgendwie logisch).

Es bleibt eine Abwägungsfrage. Die Argumentation ist dann so sinnvoll, wenn du sicher sein kannst, dass es keine veralteten Mobilbrowser gibt. Kann man mit gewisser Vorsicht annehmen, wenn man das möchte. Es gibt aber auch Gründe, anders ran zu gehen: Ein mobiles Design auf dem Desktop-Browser mag nicht das Gelbe vom Ei sein, ist aber benutz- und bedienbar. Ein Desktop-Design auf dem veralteten Mobil-Browser hingegen ist nicht benutzbar.

Du musst also schon sehr sicher sein, dass es keine veralteten Mobilbrowser gibt - und das heist, dass du nichts im Vergleich zu früher gewonnen hast, denn du musst weiterhin mit Argusaugen verfolgen, ob alle Mobilbrowser auch alle wichtigen Features unterstützen.

Wenn du deine Media-Queries auch "von klein nach groß" aufbaust, hast du etwas gewonnen: du musst dir keine Gedanken machen, dass deine Seite auf irgendeinem (egal welchem) Browser nicht bedienbar sein könnte, egal was passiert und was du einsetzt. Progressive Enhancement eben.

Das einzige, was dir daran dann vielleicht Kopfzerbrechen bereitet ist, dass die Seite nicht für den veralteten Desktop-Browser optimiert ist. Aber warum auch? Es ist besser, sagen zu können "ich habe nicht für dich optimiert" (dem veralteten Desktopbrowser) als sagen zu müssen "du kannst mich leider nicht bedienen" (dem veralteten Mobilbrowser, den du gerade nicht auf dem Schirm hast^[1]).

Grüße,

RIDER

---

1. Und glaub mir, da gibts immer mindestens einen. Schon allein deshalb, weil die Android-/iOS-Inkarnationen der "großen Browser" auch gelegentlich andere Bugs und Unterstützung bieten als ihre Desktop-Pendants, und genau diese mobil-spezifischen Problemchen verschwinden oft unter dem Radar. ↩︎