Forké de pjax (pushState + AJAX), Responsive-content est un plugin jQuery créé par le développeur Stephan Fowler qui vous permet de servir un contenu différent aux différents appareils.
Comme Fowler l’explique, Responsive-content va de pair avec des techniques courantes de conception en responsive design, mais agit à un niveau différent. Par exemple, les CSS Media Queries permettent de faciliter le redimensionnement de la largeur des div, mais chargent le même contenu à l’intérieur de ces div, et ce quel que soit le périphérique que vous utilisez.
C’est là que Responsive-content se démarque, puisque, utilisé subtilement, par exemple pour fournir des images plus petites afin qu’elles soient optimisées sur des appareils plus petits, il viendra vous rendre bien des services…
Mais, l’utilité première de ce plugin est de fournir un contenu radicalement différent pour des largeurs d’écran différentes ou pour s’adapter aux capacités du périphérique. Si utiliser des medias queries pour faire ce traitement semble donc impossible, le plugin semble mieux armé vous permettant de remplacer dynamiquement le contenu d’une zone de la page HTML afin qu’il soit adapté à la largeur de la demande, autrement dit dicté par la taille du dispositif ou les capacités de ce dernier. Bien sûr vous allez me dire que ce comportement est déjà accessible avec diverses méthodes, mais celles-ci sont généralement plus complexes, alors que Responsive-content est très facile à mettre en œuvre.
Comme le souligne la page du plugin, une largeur d’écran étroite est généralement associée à des connexions à bande passante plus faibles, et c’est pourquoi ils ont décidé d’adopter une approche pour une “amélioration progressive” ou “mobile first”.
Ce plugin permet ce qui suit :
- Une seule URL : une page Web doit avoir une URL identique quelque soit le périphérique qui la consulte
- Un cache convivial : Puisque la mise en cache utilise l’URL d’un document en tant que clé unique, il n’y a pas besoin d’avoir recours à d’autres paramètres. Cette approche permet donc d’éviter la détection du user agent ou encore des cookies
- Performance : Les dispositifs avec une faible bande passante devraient être les grands bénéficiaires de cette approche !
Vous pouvez en apprendre davantage via ce lien : http://stephanfowler.github.com/responsive-content/.
Avez-vous d’autre(s) technique(s) ? Que pensez-vous de ce plugin ? Correspond t-il à vos attentes ?
