Progressive Enhancement vs. Graceful Degradation

Wir sind ständig online und surfen auf unseren Smartphones auf Websites und Social Media Kanälen. Die mobile Nutzung des Internets hat zudem die Konzeption und Entwicklung von Websites verändert: Graceful Degradation (desktop first) war gestern, heute steht Progressive Enhancement (mobil first) im Fokus. Wir haben die Vor- und Nachteile für Sie in unserem Überblick zusammengestellt.

Graceful Degradation

Leistungsstarke Systeme und große Displays stehen bei dem Entwicklungsprinzip „Graceful Degradation“ im Mittelpunkt. Smartphones, Tablets, schwache Internetverbindungen oder auch veraltete Browser werden im Verlauf des Projekts kaum berücksichtigt. Das ist heute alles andere als zeitgemäß! Doch wie sieht die Vorgehensweise genau aus?
Das Prinzip „Graceful Degradation“ steht für viel Performance und viel Platz. Konkret heißt das, dass man zum Beispiel die Website mit einem aufwändigen Layout sowie neusten Technologien und Effekten entwickelt. Zu Beginn wird die Startseite gecodet und in einem modernen Browser getestet. Funktioniert alles wird das Testing in älteren Browsern fortgeführt – und hier kann es zu Kompatibilitätsproblemen mit den verwendeten Technologien kommen. Die vermeintliche Lösung: eine verschlankte Website für schwächere Systeme. Dabei werden die schlimmsten Fehler behoben, jedoch im Anschluss nur für bestimmte Browser getestet und korrigiert.
Auch der Platzbedarf des Layouts kann zu Problemen führen: Die Website wird für große Bildschirme entwickelt und erst im nächsten Schritt an Smartphones angepasst. Oft können aus Platzmangel nicht alle Informationen auch auf mobilen Endgeräten abgebildet werden.

Vorteile

• Wir sind „Gewohnheitstiere“ und wenden gerne bewährte Prinzipien an.
• Der Einsatz von neusten Technologien in Kombination mit modernen Systemen ist möglich.

Nachteile

• Schwache Systeme werden stiefmütterlich behandelt und haben mit Performance-Problemen zu kämpfen.
• Die Informationen sind nicht für alle gleich zugänglich, da schwache Systeme bzw. kleine Displays in der Entwicklung nicht fokussiert werden.
• Die Website kann nur unter schwierigen Bedingungen erweitert werden – und die Änderungen müssen erneut in schwächeren Systemen getestet und ggf. korrigiert werden.

Progressive Enhancement

Die modernere Herangehensweise „Progressive Enhancement“ stellt den Inhalt der Website in den Vordergrund, wohingegen die Darstellung der Seite, die Browserkompatibilität und die Anpassung an verschiedene Displaygrößen erst später berücksichtigt werden.
Der Workflow beginnt mit dem Sammeln und Strukturieren der Website-Inhalte. Im Anschluss kann die Entwicklung der Website umgesetzt werden – den Anfang macht im Gegensatz zum Prinzip „Graceful Degradation“ das schwächste anzunehmende System. Sobald alle Informationen dargestellt werden und die Website in ihrer elementaren Version benutzbar ist, wird die Entwicklung auf leistungsstarke Browser mit komplexeren Technologien und umfangreicheren Layouts ausgeweitet.

Vorteile

• Die Inhalte bilden den Mittelpunkt der Website.
• Alle Informationen sind für alle Besucher zugänglich.
• Die Website performt sehr gut ¬– auf allen Systemen – und kann leicht erweitert werden.

Nachteile

• Es sind viele Test für das gewünschte Ergebnis notwendig.

Ein Schritt weiter: Mobile First plus Progressive Enhancement

Nicht nur schwache Systeme, sondern auch Geräte mit kleinem Display und geringer Bandbreite werden im ersten Entwicklungsschritt berücksichtigt. Dadurch bedingt werden die Inhalte der Website relevanter und präziser sowie die Anzahl der Unterseiten und die Navigationstiefe auf das Nötigste minimiert, in der Folge wird die Website also übersichtlicher und leichter verständlich. Sind alle Inhalte der Website definiert? Dann kann das Coden der Website starten – und zwar mit dem kleinsten Bildschirm und dem schwächsten Browser.

Vorteile

• Die Website-Inhalte sind präzise, klar strukturiert und werden auf allen Geräten optimal dargestellt.
• Die Website kann ganz unkompliziert auf größere Displays und für modernere Systeme erweitert werden.

Nachteile

• Die Konzeption sowie die technische Umsetzung sind eher aufwändig.

Sie möchten noch mehr zum Thema Webentwicklung erfahren oder die Performance Ihrer Website überprüfen und optimieren lassen? Dann kontaktieren Sie uns gerne!