nicht angemeldet
Hallo,
Ich stell mir das eher so vor, dass ich an ein Smartphone oder Tablet eine GUI ausgebe, die mit ihrem Verhalten dem Look&Feel des Gerätes entspricht. Da reichen Media-Queries einfach nicht aus (und ich rede jetzt nicht von einer Standard-Webseite vom Malermeister Maier ;-)). Aber um das zu tun, müsste man wissen, was das Gerät ist oder kann. Und sicher liefere ich an einen schönen großen Bildschirm andere Bilder aus, als an einen kleinen. Also, wenn ich könnte.
Ich verstehe nicht, an welchen technischen Merkmalen du das festmachen willst, wenn nicht an Viewport-Größe, Device-Pixel-Ratio usw.
Manche UIs lassen sich nur mit Maus oder Touch sinnvoll bedienen, das kann ich noch nachvollziehen. Viele Spiele erfordern eine Maus, andere erfordern Multi-Touch. Allerdings haben heutige Geräte wie gesagt beide Möglichkeiten, sodass der Browser keine eindeutige Aussage treffen kann. Es muss vor allem dem Nutzer mitgeteilt werden muss, falls Maus oder Touch erforderlich sind.
Die Welt wäre auch einfacher, wenn es technische Element gäbe, z.B.
<dialog onclose="refresh-opener" src="..."></dialog>
<wizard></wizard>
etc.
Die entsprechende Logik könnte im Browser implementiert sein und gut ist, Gestaltung über CSS.
Da werden aber die Puristen Sagen: Nein! HTML darf nur semantisch sein und Inhalt haben!
1. Solche Logik lässt sich bereits mit WAI-ARIA ausdrücken, aber die Gestaltung und die Bedienung ist letztlich noch deinem CSS und JavaScript überlassen.
2. HTML5 führt mit details/summary, menu, @contextmenu und dialog bereits generischen UI-Controls ein. Es ist nur noch nicht auf breite Unterstützung gestoßen.
3. Viele JavaScript-Frameworks, inbesondere für Mobilgeräte, bieten solche UI-Komponenten von Haus aus. Die funktionieren mit vielen Eingabemethoden und Viewport-Größen. In Frameworks wie Angular lassen sich die Komponenten auch so verwenden, wie du es oben demonstrierst.
Mathias
Matthias Apsel