Responsives Design ohne Schmerz
Zuerst klein
Ein Design, das am Desktop beginnt und schrumpft, erzeugt stets Kompromisse; eines, das am Handy beginnt und wächst, erzeugt eine klare Wichtigkeitshierarchie. Auf einem schmalen Bildschirm ist kein Platz für Unwesentliches, und genau das ist die Übung, die jede Oberfläche braucht.
In der Praxis: eine Spalte, lesbare Typografie und Berührungsflächen, groß genug für den Daumen.
Umbruchpunkte nach Inhalt
Wählen Sie Umbruchpunkte nicht nach Gerätemodellen — die Liste ändert sich jedes Jahr. Verbreitern Sie das Fenster, bis das Layout schlecht auszusehen beginnt, und setzen Sie den Punkt dort.
Die meisten modernen Layouts brauchen zwei oder drei Umbruchpunkte insgesamt. Haben Sie sieben, zeichnen Sie höchstwahrscheinlich Bildschirme, statt Verhalten zu definieren.
Was tatsächlich bricht
Breite Tabellen, Bilder mit festem Verhältnis, lange hebräische Überschriften, die unschön umbrechen, und Menüs, die verschwinden. Jedes hat eine einfache Lösung: erklärtes horizontales Scrollen für eine Tabelle, ein definiertes Seitenverhältnis und kontrollierter Wortumbruch.
Im Detail
Prüfen Sie auch die vergessenen Achsen: einen sehr breiten Bildschirm mit zu langen Zeilen, 200 Prozent Zoom und Querformat am Handy. Alle drei sind häufiger als gedacht, und alle drei brechen auf Seiten, die nur bei zwei Breiten getestet wurden.