Les étapes de l'amélioration progressive

L'amélioration progressive, le mobile first, le contenu d'abord… comment on fait pour aborder ces concepts ? On commence par quoi ? Existe-t-il des ressources sur le sujet ?

Oui, il existe des ressources, pas mal de ressources en anglais. Pour nourrir la base de connaissance en langue française, je vous offre une traduction d'un interview de Jeremy Keith : Responsive questions .

Jeremy Keith pense qu'il faut appliquer le principe de l'amélioration progressive à tous les niveaux : contenu, structure, images…

• Utiliser la version la plus petite des images (destinée au mobile)
• Ne pas appliquer de mise en forme de type colonnage à la page
• Débuter avec le contenu le plus prioritaire

Maintenant, vous avez la base, vous pouvez démarrer l'amélioration progressive.

• Afficher le chargement d'image plus grande si la taille de l'écran le permet
• Appliquer une grille à la page, laisser les déclarations css de grilles dans celle des media queries
• Utiliser de l'Ajax pour afficher du contenu secondaire sur les écrans aux résolutions plus importantes

Ne pas penser à l'affichage pour écran de bureau lors de la conception ; pour autant ne pas penser non plus à l'affichage pour mobile. Au lieu de cela, pensez au contenu. En même temps je dis contenu mais je pense aussi action et parcours. Mettre ce que veut l'utilisateur en tête de vos priorités.

Sélectionner le contenu à afficher en fonction des dispositifs de rendus (mobile, tablette, écran de bureau…) ne correspond pas à la manière de penser avec laquelle le web a été construit. Il s'agit effectivement d'un mode d'aborder la conception différente que celle pratiquée actuellement, cependant elle peut se révéler aussi enrichissante que lorsque vous avez arrêté d'utiliser les tableaux.