Woran erkennt man einen Webpfuscher? (Teil 1)

Eine typische Horrorgeschichte aus dem Bereich der Webbetreuung:

  1. Jemand von einer Agentur bekommt ein barrierearmes Markup in der Design und Inhalt schön getrennt sind als Vorlage und soll lediglich die Ausgaben einer Anwendung (PHP) im definierten Contentteil ausgeben lassen.
  2. Statt das Markup zu nehmen, welches aus div-Bereichen (und zwar keine DIV-Wüsten) besteht, baut er das um und macht daraus ein Tablelayout mit fest vorgegebenen Pixelbreiten. Dabei werden auch alle Sprungmarken gelöscht und die Struktur des Dokuments um den Haufen geworfen. Vorhandene Print- und Handheld-CSS-Dateien werden aus unwichtig erachtet und weggeworfen.
  3. Was rauskommt ist natürlich nicht valide (weder das HTML, noch das CSS).
  4. Dort wo er nicht in der Lage ist, die selbe Optik zu bringen nutzt er dann doch div-Bereiche (innerhalb der Tablecells.); Zu allen Überfluss aber auch mit Inline-Styles!
  5. Damit der Auftraggeber nichts merkt, wird die Arbeit von einem Laptop gezeigt, bei dem der Webserver lokal installiert ist. Die Auflösung des Laptops ist auf 1024px Breite eingestellt und es wird nur der IE (V6) verwendet.

  6. Damit niemand sonst was merkt wird dem Auftraggeber geraten, keine anderen Leute hinzuzuziehen – die würden nur Unruhe bringen.. Ach ja, und da die Vorlage ja barrierearm war und die Optik ja mit dem Ergebnis die selbe ist, wird behauptet es sei jetzt alles auch 100% Barrierefrei.

Zum Vergleich ein Codesnipplet:

Vorher (laut Vorlage):

Das ist zwar auch etwas umfangreicher vom Code als notwendig, aber das hat den Grund das man vor hat, später das Design allein durch ändern des CSS ändern zu können, ohne das man nochmal in den HTMLCode muss.

Nun, daraus hat unser Profi dann folgendes gemacht:

Und dies ganze ist dann der Inhalt einer Tablecell.

Flattr this!