Refactoring von graff-ff.de

Der Filmemacher Norleon Graff kam mit der Bitte auf digital:cube zu, seine aktuelle Website zu analysieren. Nach einer umfangreichen Analyse wurde relativ schnell klar, dass die Website eine Entschlackungskur benötigte. Eine standardkonforme Webseite musste entstehen. Kein Problem…

Der HTML Code, den wir vorfanden, basierte auf dem Editor iWeb von Mac OS X. Eigentlich ist iWeb ein Porgramm für private Benutzer, die sich laienhaft mit Webseiten beschäftigen möchten. Das Prinzip funktioniert stark nach dem Schema  „What You See Is What You Get“ – das funktioniert zwar oberflächlich ganz gut, ist aber für den produktiven und professionellen Einsatz nicht zu empfehlen. Es gibt sehr viele Verschachtelungen im HTML und CSS gepaart mit CSS Anweisungen „Inline“ im HTML Body, exotische Javascript Anweisungen für Browserkompatibilität. Ca. 80% des technischen Potentials der Website gingen dadurch verloren.

Die IST-Situation war nicht förderlich für das schnelle und überschaubare Editieren. Wenn also mal ein Text geändert werden sollte gab es direkt probleme mit der Formatierung. Nicht desto trotz versuchten wir eine Lösung zu finden, die für GRAFF.FF zu vertreten wäre. Folgendes sprach für ein Refactoring:

  • Zu viele Verschachtelte DIV Elemente als Gerüst für die visuelle Struktur der Webseite
  • Formatierung nicht getrennt vom HTML Markup
  • CSS Anweisungen nicht ausgelagert
  • Einbettung von Videoinhalten nach altem Prinzip – Videos wurden dadurch doppelt geladen
  • Unnötig geladene Javascript Befehle, die gar keine Auswirkungen hatten
  • Keine SEO Anweisungen

Wir empfahlen den Code sauber und übersichtlich neu zu schreiben.

  • Erstellung XHTML 1.0 Strict nach W3C Standard
  • Erstellung von CSS 2.1 Formatierung
  • Optimierung von Titel, Beschreibungen und Schlüsselwörter
  • Korrekte Einbettung von Quicktime Filmen
  • Optimierung von Grafiken
  • Einhaltung von Semantik

Das Ergebnis kann sich durchaus sehen lassen wie wir finden.

Was hier nicht sichtbar gemacht wird, ist dass durch die Neuprogrammierung der Webseite, die Ladegeschwindigkeit um ca. 55% gestiegen ist und wir uns gleichzeitig knapp 1,2 MB beim Seitenaufruf an unnötigen Code gespart haben.

Tagged with:

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

fünf × 3 =