Wer jetzt schon CSS3 und HTML5 Eigenschaften und Funktionen verwenden möchte, sollte die JavaScript Bibliothek Modernizr verwenden. Mit Modernizr lässt sich sehr genau prüfen welche der neuen Eigenschaften im Browser zur Verfügung stehen und man kann dementsprechend Fallbacks (polyfills) definieren.
Der Vorteil gegenüber der alten Browser Conditions die praktisch mit jedem Update angepasst werden mussten ist, dass mit Modernizr die Verfügbarkeit geprüft wird und wenn dementsprechend neue Browserversionen neue Eigenschaften implementieren braucht dies kein Update der Conditions.
Funktionsweise:
Ist die Modernizr Bibliothek einmal eingebunden werden im Header der HTML Dokuments die zur Verfügung stehenden Eigenschaften erwähnt.
html lang=”de js flexbox canvas canvastext postmessage no-websqldatabas….
Modernizr ist eine reine Test-Bibliothek, diese Tests müssen wie folgend ausgeführt werden und dementsprechend können Polyfills, andere CSS oder JS Dateien geladen werden.
Konfiguration:
Beispiel mit Box-Shadow und CSS Gradients
Modernizr 2
Bei der Version 2 steht nun eine solide Testbibliothek zur Verfügung die über ein Builder zusammen gestellt werden kann.
Neu wurde ein Mediaquery-Test und der yepnope Loader integriert mit diesen Funktionen wird für Crossbrowser und Crossmedia Webdesign mit neuen CSS3 und HTML5 Eigenschaften nichts mehr zusätzlich benötigt.