joerghuelsermann.de Austausch von CSS

Bitte geben sie eine URL an.

Austausch von CSS

Dieses Tool wird bei der zu prüfenden Webseite einen Austausch der CSS Datei vornehmen. Genauer gesagt der gesamte head Bereich wird ersetzt durch einen head Bereich basierend auf HTML5.

Diese optische Fehlersuche funktioniert rein mit CSS. Die zu prüfende Webseite bekommt bei diesem Test eine speziell für diesen Zweck zugeschnittene CSS Datei. Diese Datei stellt unter Beweis wie leistungsstark CSS rein bei Verwendung von Typ Selektoren, Attributabhängigen Selektoren und Pseudoklassen derzeit schon ist. Alle aktuellen Browser unterstützen bereits die Funktionen.

Prüfpunkte

Momentan sind folgende Prüfpunkte vorhanden. Die ersten 6 Punkte wurden zusammengefasst in der Option Fehler.

  • Links ohne title Attribute aus Gründen der Barrierefreiheit
  • Bilder ohne alt Attribute fördern die Barrierefreiheit nicht.
  • Leere Elemente tragen nicht zur Struktur bei und sollten vermieden werden falls sie nicht durch das Design modifiziert werden.
  • Ersetzbare Elemente sind meistens austauschbar durch andere Elemente oder CSS Anweisungen
  • Ersetzbare Attribute können in der Regel durch Anweisungen in der CSS Datei angegeben werden.
  • Die Verwendung von style Attributen erhöht stark die Spezifität und wirkt sich auf die Wartbarkeit einer Webseite aus.
  • Div Container die eine Div Tiefe größer als 3 aufweisen sollte dazu anregen das man seine Struktur nochmal überdenkt.
  • Kennzeichnung von Links mit nofollow
  • Tabellen die ineinander verschachtelt sind basieren meistens auf einem Design basierend auf Tabellen
  • Für Formulare existiert das Element fieldset, welches leider zu wenig benutzt wird
  • Anzeige aller verwendeten id und class Attribute
  • Kennzeichnung der Elemente die in HTML5 erstmal definiert worden sind
  • Einsatz von Attributen für Mikrodaten
  • Die Ebenen der Elemente unterhalb des body Elementes werden aufgeführt

Elemente und Attribute

Die beiden folgenden Listen berücksichtigen die Elemente und Attribute die durch CSS und andere Möglichkeiten ersetzbar sind oder mit HTML5 entfallen. Die Elemente bei denen der Einsatz von Attributen in der Liste möglich ist sollten gesondert bewertet werden.

Liste der Elemente
  • acronym
  • applet
  • b
  • basefont
  • bdo
  • big
  • center
  • col
  • colgroup
  • dir
  • font
  • frame
  • frameset
  • i
  • iframe
  • isindex
  • listing
  • noframes
  • plaintext
  • rb
  • rbc
  • rtc
  • s
  • small
  • strike
  • tt
  • u
  • xmp
Liste der Attribute
  • abbr
  • align
  • alink
  • archive
  • axis
  • background
  • bgcolor
  • bgproperties
  • border
  • cellpadding
  • cellspacing
  • char
  • charoff
  • charset
  • classid
  • clear
  • codebase
  • codetype
  • compact
  • coords
  • declare
  • frame
  • frameborder
  • height
  • hspace
  • left
  • leftmargin
  • link
  • longdesc
  • marginheight
  • marginwidth
  • name
  • nohref
  • noshade
  • nowrap
  • rev
  • right
  • rules
  • scope
  • shape
  • scrolling
  • standby
  • summary
  • target
  • type
  • text
  • topmargin
  • valign
  • valuetype
  • vlink
  • vspace
  • width

Prinzip der Fehlersuche

Das Prinzip der Fehlersuche baut darauf auf unterschiedliche Fehler durch Anwendung von CSS unterschiedlich einzufärben oder mit einem Rand zu versehen. Im Grunde wird der Inhalt der geprüften Webseite übernommen und vom ursprünglichen Design getrennt und mit einem neuen Design versehen.

Prüfung auf Mikrodaten

Bei der Prüfung auf Mikrodaten werden folgende Attribute überprüft.

  • item
  • itemid
  • itemprop
  • itemref
  • itemscope
  • itemtype

Angaben zu Mikrodaten die sich im nicht sichtbaren Bereich für einen Benutzer auf der Webseite befinden können mit dieser Methodik nicht hervorgehoben werden.