Margot Dum

Am 21. September 2004 wurde im Blog themaninblue.com ein Experiment mit dem Titel "resolution dependent layout" veröffentlicht. Dieses Experiment basierte auf CSS und Java Scipt und schuf die Grundlage für die Idee der heutigen CSS-Media Queries. Diese ermöglichen es dem Webdesigner, das Layout einer Seite, basierend auf der zur Verfügung stehenden Anzeigefläche anzupassen. Da diese Methode aber auf Java-Scipt basierte, war sie nicht standartgemäß und daher nicht breit auf die Maße der Internetseiten anwendbar. Mit der Einführung von CSS3 wurden die bisher schon vorhandenen Media Queries um das Konzept des "resolution dependet layouts" erweitert.

Mittlerweile unterstützen die meisten modernen Browser Media Queries. Dazu zählen Internet Explorer ab Version 9, Firefox >= 3.5, Safari ab Version 4, Chrome, Opera, und so gut wie alle aktuellen mobilen Browser. Da ältere Browser wie beispielsweise IE 6 - 8 diese Technik, wie auch die meisten anderen HTML5 features nicht unterstützen, gibt es für CSS3 Media Queries zahlreiche "work arounds", die auf Java Sript basieren. Diese lesen die Media Queries aus der CSS-Datei aus und wenden die dort definierten styles auch in ältere Browsern richtig an.

Eine ausführlichere Erläuterung zu Media Queries und ihren Anwendungen werden in der nächsten Einheit von Liesa Herbst und mir näher erläutert.

Quellen:

http://www.themaninblue.com/experiment/ResolutionLayout/ (27.03.2011).

http://caniuse.com/css-mediaqueries (27.03.2011).

http://code.google.com/p/css3-mediaqueries-js/ (27.03.2011).

https://github.com/scottjehl/Respond(27.03.2011).