Une application Web avec jQuery Mobile et Responsive Design…
17/03/2013Plutôt que de faire une version mobile d’un site Web, Je fait une version Web d’un site mobile :).
-> A voir ici : http://serp.lcprod.net
Création : Un système de suivi pour le concours de positionnement des étudiants de la licence M@tic de l’IUT de Tours.
Je lance cette année, pour les étudiants de la licence Matic de l’IUT de Tours, un concours de référencement.
Pour pouvoir suivre proprement l’évolution du référencement de chaque site, je monte un site qui permet d’ouvrir la page de résultats de Google et récupérer la position de chaque groupe.
- Pour l’affichage des résultats, j’utilise l’API de Google Chart.
- Pour le site, je base le développement sur jQuery Mobile en version 1.3.0.
jQuery Mobile : Les frameworks Javascript et CSS pour mobiles
Le framework permet de créer des objets HTML/CSS spécifique pour les mobile. Beaucoup de paramètres à régler mais le système reste souple. Aussi bien sur la couche Javascript que CSS.
Pour pouvoir jouer proprement sur le design des éléments, jQuery propose ThemeRoller : une interface web pour manipuler le framework CSS.
Evolution : Le tout en mode adaptatif (Responsive Web Design ) !
Le site utilise les techniques CSS3 de Responsive Web Design pour provoquer des affichages différents selon la résolution des appareils. Je vise 3 format différents : Ecran, Tablette et mobile.
L’interprétation est valide sur les plateforme Android, iOS et Blackberry !
Conclusion : C’est long à monter mais c’est beau 🙂
Le framework est en constante évolution, il n’est pas simple de trouver la bonne adéquation entre les fonctionnalités Javascript de jQuery et la couche CSS…
A voir ici : http://serp.lcprod.net