Amélioration progressive - Définition

Introduction

L' amélioration progressive est une manière de concevoir un site web qui prend très largement en compte l'accessibilité, la sémantique et le référencement. En séparant strictement le fond (le contenu proposé à l'utilisateur) et la forme (l'enjolivement et les interactions avancées), cette technique permet de présenter un contenu simple et de rendre un service minimum à tous les utilisateurs, quel que soit le débit de leur connexion ou leur navigateur, tout en améliorant progressivement l'affichage proposé en fonction de l'équipement de l'internaute.

Historique

La dégradation élégante dans le domaine de la conception web correspond au début des années 2000 découlant de l'adoption massive à deux nouveaux concepts tels que la séparation du fond (sémantique XHTML) et de la forme (CSS), l'adoption des standards du W3C grâce à l'émergence de nouveaux navigateurs sur le marché (Firefox, Opera). Cette idée de régression était soutenue par l'amélioration rapide et continue des technologies du moment, les développeurs visant d'abord les navigateurs les plus récent et considérant ensuite les anciennes versions. Cette vision supposait que les utilisateurs suivaient la tendance et les technologies, ce qui n'est pas forcément le cas, que ce soit pour des raisons personnelles ou dû à des politiques d'entreprise. La mise en pratique de la dégradation élégante implique également un temps et un coût important : tester différentes versions, navigateurs, OS, etc. Un autre facteur entrainant ce changement de paradigme fut l'expansion du marché des appareils « mobiles » tel que les PDA, téléphones portables, etc. Ceci contredisait la logique d'amélioration continue des navigateurs de par leurs performances limitées. C'est dans ce contexte que l'amélioration progressive est apparue.

Amélioration progressive vs. dégradation élégante

Ces deux méthodes ont un même but, rendre le contenu accessible au plus grand nombre. Ce qui les oppose est leur approche du problème :

• dégradation élégante : l'approche est dite top-down, on développe d'abord pour une configuration précise, puis on s'efforce d'étendre le nombre de configurations capables de rendre le contenu correctement ;
• l'amélioration progressive : l'approche est dite bottom-up ou par couche ; les couches sont développées de la plus basique et la plus universelle à la plus spécifique, comme suit :

1. couche sémantique (XHTML, XML) :
   1. contenu accessible pour tous (tout est balisé) ;
   2. fonctionnalité accessible pour tous (tout est « cliquable ») ;
2. couche visuelle (CSS) :
   1. la mise en forme est gérée par des feuilles de style externes ;
3. couche événementielle (javascript, AJAX) :
   1. les comportements évolués sont non-obstrusifs et gérés par des fichiers externes
4. respect des préférences utilisateur.