Comment ça votre site n’est pas RWD (Responsive Web Design) et vous n’utilisez pas le manifest HTML5. Mon dieu, votre site doit-être terriblement 20ème siècle.

Je plaisante mais, les nouveaux enjeux du web sont là et il serait dommage de ne pas en profiter. Je ne reviendrai pas sur le RWD, j’y ai consacré quelques billets : https://www.my-web-garden.fr/graphisme-webdesign/les-bonnes-pratiques-du-responsive-web-design/

En revanche, parmi les nouvelles spécifications de mise en cache côté client, HTML5 nous offre une nouveauté des plus intéressante, surtout si vous souhaitez mutualiser vos outils de travail. Je m’explique, vous avez un site internet que vous présentez quand les connexions le permettent et de l’autre votre PowerPoint fait maison.

Pourquoi ne pas utiliser un seul outil, le HTML5 manifest vous permet d’utiliser votre site hors connexion, il répond en effet aux exigences de la mobilité, un monde dans lequel le manque de connexion, peut-être rédhibitoire

La mise en place du fichier Manifest
Le manifest est un simple fichier text dans le lequel vous déclarez les fichiers devant être mis en cache.
Il se présente sous cette forme :
////////////////////////////////
CACHE MANIFEST
# Version 1 10/07/2012
images/img01.jpg
images/img02.jpg
images/img03.jpg
css/style.css
js/demo.js

NETWORK:

FALLBACK:
/online offline.html
///////////////////////////////////

CACHE : C’est la section par défaut, elle contient les URLs que le navigateur doit impérativement mettre en cache.
NETWORK : Liste les URLs qui doivent toujours être consultées sur le serveur. Ce sera par exemple le cas des ressources AJAX et des ressources externes (vidéo, …).
FALLBACK : Cette section permet d’associer des préfixes d’URL à des ressources alternatives utilisées en cas d’indisponibilité.

Il existe un bonne adresse pour valider votre manifest :
http://manifest-validator.com/

La limite théorique du cache d’application est généralement de 5 MO, en fonction des navigateur elle peut-être plus importante. Mais partez sur cette valeur si vous n’êtes pas sûr du navigateur de vos internautes. 5 Mo c’est effectivement un peu court pour mettre en cache un site, mais si vous souhaitez emmener votre site avec vous pour une démo et que vous souhaitez que cela se fasse offline. Il ne tient qu’à vous de régler le cache d’application. Je ne connais pas les limites théoriques du cache d’application, mais pour avoir fait quelques tests sur Firefox, j’ai déjà mis en cache un site d’une dizaine de MO. Je pense que l’on peut aller bien au delà.

Dans cette illustration on voit nettement la mise en cache de ce site :
http://www.illustrateur-graphiste.net/manifest/index-book.html
la mise en cache se fait dès la première connexion.

Si vous souhaitez faire des mis à jour de votre site, il faudra prévoir des fonctions de remise en cache, des nouvelles données, sans quoi vous aurez toujours la version antérieure.

Les limites du Manifest
Cette solution peut convenir dans certains cas, mais elle n’est pas applicable pour un site dont le contenu change beaucoup ou pour un site à fort trafic.