Graceful degradation

Graceful degradation is a design philosophy that centers around trying to build a modern web site/application that will work in the newest browsers, but falls back to an experience that while not as good still delivers essential content and functionality in older browsers.

See https://developer.mozilla.org/en-US/docs/Glossary/Graceful_degradation

A gracefully degrading swan
Source: The Dying Swan - 2014


To give a clear example of how gracefully degrading websites could work, I'll be switching Javascript on and off for the homepage of this website. On the first screenshot Javascript is enabled as is the default setting nowadays.

The second screenshot shows the same page, but with Javascript disabled. Although the latter doesn't show the information as was intended, i.e. a 5 page slideshow of recommended pages, it does show all these pages in an alternative and acceptable layout. So the page degraded gracefully.

This website's homepage - Javascript is enabled

This website's homepage - Javascript is disabled


I didn't know this, but graceful degradation is actually a term that is used more widely than in software development alone. This is another definition I found.

Graceful degradation is the ability of a machine, system, process or procedure to offer limited functionality after being damaged or losing access to critical resources. It is a central concept to safety engineering that ensures that equipment such as aircraft can be operated after experiencing a failure. https://simplicable.com/new/graceful-degradation

The next image from that same page shows some examples of graceful degradation in various environments.

  • content/graceful_degradation.txt
  • Last modified: 2021/05/24 13:26