Reset-Stylesheet

aus Wikipedia, der freien Enzyklopädie
Zur Navigation springen Zur Suche springen

Ein Reset-Stylesheet (oder auch: CSS Reset) ist eine Sammlung von Stylesheet-Definitionen, die Formatierungen für HTML-Elemente vereinheitlichen oder zurücksetzen.

Problematik[Bearbeiten | Quelltext bearbeiten]

Jeder Browser hat unterschiedliche Standardeinstellungen für verschiedene HTML-Elemente. So sind etwa die Farbe für Linktexte und Abstandsdefinitionen für bestimmte Elemente von vielen Browsern standardmäßig unterschiedlich definiert. Diese Basisangaben unterscheiden sich mitunter stark von Browser zu Browser, teilweise sogar innerhalb verschiedener Versionen eines Browsers.[1] Diese Standardstile können insbesondere in Kombination mit vom Autor definierten Vorgaben unvorhergesehene Auswirkungen auf das Erscheinungsbild der Website zur Folge haben.

Mit der Hilfe eines Stylesheet-Resets können diese Basisangaben der Browser zurückgesetzt werden. Die dann vom Entwickler eingesetzten Stilangaben werden im Idealfall konsistent von allen Browsern interpretiert.

Das Zurücksetzen der Stylesheet-Definitionen[Bearbeiten | Quelltext bearbeiten]

Etwa 2004 wurden erste sogenannte Stylesheet-Resets veröffentlicht,[2] welche sich auf das Zurücksetzen der Abstandsangaben beschränkten:

* {
    padding:0;
    margin:0;
}

Dieses Verfahren wurde von verschiedenen Entwicklern nach und nach verfeinert, so dass nur ausgewählte und sinnvolle Elemente auf grundlegende Angaben zurückgesetzt wurden.

Bekannte Stylesheet-Resets[Bearbeiten | Quelltext bearbeiten]

  • Ein bekanntes CSS-Reset ist Teil von Yahoo User Interface (YUI)[3]
  • Eric Meyers CSS Reset ist ebenfalls sehr bekannt und setzt nahezu jedes Element auf einen unformatierten Zustand[4]

Nachteile[Bearbeiten | Quelltext bearbeiten]

  • Viele CSS-Resets entfernen jede Formatierung eines HTML-Elements. So hat beispielsweise selbst das strong-Element, welches hervorgehobenen bzw. fettgedruckten Text auszeichnet, in Form und Farbe oft keinen Unterschied mehr zum Rest des Textes. Der Entwickler muss sich also um jeden designrelevanten Parameter seines HTML-Codes kümmern.
  • Je nach Umfang eines Resets entsteht eine höhere Ladezeit, da die bestehende Stylesheet-Datei entweder erweitert oder die Ressource zusätzlich geladen werden muss.

Abgrenzung zum CSS-Framework[Bearbeiten | Quelltext bearbeiten]

Ein CSS-Reset ist von einem CSS-Framework abzugrenzen. Ein Reset-Stylesheet hat lediglich die Aufgabe, Basisformatierungen zurückzusetzen. Im Gegensatz dazu versucht ein CSS-Framework, beispielsweise mithilfe vorgefertigter Stil-Definitionen für oft benötigte Elemente der Benutzeroberfläche oder einem Rastersystem den Entwicklungsprozess einer Website zu beschleunigen. Oftmals ist ein CSS-Reset jedoch Teil des CSS-Frameworks.

Weblinks[Bearbeiten | Quelltext bearbeiten]

Einzelnachweise[Bearbeiten | Quelltext bearbeiten]

  1. iecss.com
  2. sixrevisions.com
  3. yuilibrary.com
  4. perishablepress.com