Progressive Enhancement

TL;DR

Progressive Enhancement baut Websites von einer funktionierenden Basiserfahrung auf. Erweiterte Features werden hinzugefügt, wenn der Browser sie unterstützt – garantiert Zugang für alle.

Was ist Progressive Enhancement?

Progressive Enhancement ist eine Strategie: Zuerst wird eine funktionierende Basiserfahrung erstellt (HTML), dann werden Verbesserungen hinzugefügt (CSS, JavaScript). Wenn erweiterte Features nicht unterstützt werden, funktioniert die Seite trotzdem.

Die Schichten

• HTML: Semantischer Inhalt, der überall funktioniert
• CSS: Styling und Layout
• JavaScript: Interaktivität und erweiterte Features

Progressive Enhancement vs. Graceful Degradation

• Progressive Enhancement: Von einfach nach komplex aufbauen
• Graceful Degradation: Komplexes bauen, dann für alte Browser abbauen

Progressive Enhancement ist die nachhaltigere Denkweise.

Vorteile

• Barrierefreiheit: Basisinhalt ist für alle zugänglich
• Robustheit: Funktioniert auch bei JavaScript-Fehlern
• Performance: HTML lädt zuerst, JS später
• Langlebigkeit: Funktioniert auf alten und neuen Geräten

Progressive Enhancement und Nachhaltigkeit

Perfekte Verbindung:

• Basis-HTML braucht minimale Ressourcen
• Ältere Geräte werden nicht ausgeschlossen
• Weniger JavaScript-Abhängigkeit
• Längere Geräte-Lebensdauer

In der Praxis

• Formulare funktionieren ohne JavaScript
• Navigation braucht kein JS zum Öffnen
• Content ist ohne CSS lesbar
• Animationen sind Bonus, nicht Voraussetzung

Fazit

Progressive Enhancement ist die solideste Art, Websites zu bauen. Es garantiert Zugang für alle und produziert nebenbei robustere, nachhaltigere Websites.