normalize.css statt CSS-Reset

normalize-css-file

Webbrowser haben ja bekanntlich die Eigenschaft CSS-Stile unterschiedlich zu rendern. Damit eine Website trotzdem in allen Browsern gleich - oder zumindest sehr ähnlich - aussieht, verwenden wir daher in der Regel einen so genannten CSS-Reset. Das Projekt Normalize.css geht einen etwas anderen Weg und bietet eine solide Ausgangsbasis für Webprojekte.

Web Design mit Sass

Eine Einführung in moderne Stylesheets.

In unserem Shop kaufen
ePub, Mobi + PDF

Bei Amazon kaufen
Kindle-Version

Was ist der Unterschied zum CSS-Reset?

Ein gewöhnlicher CSS-Reset wird an den Anfang des CSS-Dokuments gesetzt und dient dazu generell alle HTML-Eigenschaften auf Null zu setzen. Somit gelten für alle Browser erstmal die selben Grundvoraussetzungen. Anschließend müssen jedoch sehr viele Eigenschaften erneut vergeben werden, was Zeit kostet und den Quellcode aufbläst.

Normalize.css verfolgt eine etwas andere Philosophie. Es werden nicht pauschal alle Eigenschaften resettet, sondern die Eigenschaften werden genormt. Die Browser verhalten sich also nach dem Einbau eines Normalizers alle gleich – aber sinnvolle Voreinstellungen wie Abstände vor und nach Absätzen, Listenpunkte, fette und kursive Textauszeichnungen etc. gehen nicht verloren.

Update: Normalizer als Standard-Lösung

Normalize.css ist mittlerweile zur Standard-Lösung geworden. Viele Open Source Projekte wie Foundation, die HTML5 Boilerplate oder HTML Bones verwenden das Stylesheet. Auch kommerzielle Software wie Dreamweaver setzt den Normalizer ein.