Progressive Enhancement: eine neue Art zu Denken
Kommentare

Seit dem Aufkommen des Internets gab es unzählige Veränderungen bei der Gestaltung von Websites – kein Wunder, angesichts der kontinuierlichen Weiterentwicklung von Web-Technologien. Für Webentwickler und Webdesigner heißt das nicht nur, sich in neue Tools einzuarbeiten und sich mit den neuen Technologien vertraut zu machen. Genauso ist ein Umdenken gefragt, was die grundsätzliche Gestaltung von Websites angeht.

Statt nur über das Aussehen einer Website auf einem Widescreen-Device in einem modernen Browser nachzudenken, erlaubt das sogenannte progressive Enhancement, sich auf abstraktere Art und Weise mit der Kernfunktionalität einer Website zu beschäftigen. Doch wie kann progressive Enhancement umgesetzt werden? Das erklärt Jeremy Keith in seinem Artikel zum Thema Responsive Enhancement.

Erst die Kernfunktionalität, dann die Aufwertung

Progressive Enhancement regt dazu an, über die Kernfunktionalität einer Website nachzudenken und wie diese möglichst einfach zur Verfügung gestellt werden kann. Dafür reicht meist einfaches HTML, das mit anderen Technologien angereichert werden kann, um Nutzern mit moderneren Browsern eine bessere User Experience zu bieten.

Damit wird einerseits sichergestellt, dass die Seite in älteren Browsern zumindest rudimentär funktioniert, ohne einen enormen Zeitaufwand aufzubringen zu müssen, um dies zu erreichen. Andererseits sorgt diese Arbeitsweise dafür, dass selbst bei auftretenden Fehlern in modernen Browsern die Seite nicht komplett unbenutzbar wird.

Zwar führt dies dazu, dass die Website in unterschiedlichen Browsern verschiedene Interfaces hat, allerdings ist der Schlüssel zum progressive-Enhancement-Denken, zu akzeptieren, dass Websites nicht in jedem Browser gleich aussehen müssen. Dazu erklärt Jeremy Keith:

Instead of spending your time trying to make websites look the same in wildly varying browsers, you can spend your time making sure that the core functionality of what you build works everywhere, while providing the best possible experience for more capable browsers.

Es kommt also zunächst auf die Kernfunktionalität und erst im zweiten Schritt auf die Aufwertung an. Doch wie lässt sich dieser Ansatz bei der Gestaltung einer Website umsetzen?

Progressive Enhancement im Einsatz

Ein einfaches Beispiel, wie sich progressive Enhancement bei der Website-Gestaltung umsetzen lässt, ist das Einfügen einer Website-Navigation für eine mehrteilige Reihe. Es bietet sich an, die Navigationsliste als Hyperlink einzufügen, um die Kernfunktionalität – hier also das Wechseln zwischen den einzelnen Teilen – sicherzustellen.

Anschließend kann das Layout als erster Schritt zur Aufwertung gestaltet werden, etwa indem es als Responsive Design für die Nutzung auf unterschiedlichen Devices optimiert wird. Progressive Enhancement endet allerdings nicht hier. Mit JavaScript oder dem Einsatz von modernen CSS-Spezifikationen lässt sich die Website für User von modernen Browsern weiter aufwerten. So kann ihnen eine bessere User Experience geboten werden, ohne sich gleichzeitig um eine Fallback-Lösung für Nutzer von Legacy-Browsern sorgen zu müssen.

Natürlich ist dies nur ein kurzer Einblick in die Umsetzung von progressive Enhancement. Jeremy Keith erklärt dies mit Code-Beispielen ausführlicher in seinem Artikel. Dabei zeigt sich vor allem eines: dass progressive Enhancement eine neue Art zu Denken ist, die sowohl für Webdesigner als auch für User viele Vorteile mit sich bringt.

Aufmacherbild: evolution of lighting, with candle, tungsten, fluorescent and LED bulb von Shutterstock / Urheberrecht: Vladimir Gjorgiev

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -