1485 sujets

Web Mobile et responsive web design

Bonjour à tous,

Développeur web, la demande pour des sites mobiles devient plus forte et j'ai été sollicité pour créer la version mobile d'un site web dont je m'occupe. J'aurai donc souhaité avoir des avis sur certains points.

Aujourd'hui, le site web est assez conséquent et a bien sur été fait en largeur fixe. Certaines parties, peu importantes, ne seront pas affichés sur la version mobile. Du coup, l'impact est au niveau du CSS mais également du code (vues modele et controller pour ceux à qui ça parle). Enfin, mon client ne roule pas sur l'or, donc on privilégie le plus simple.

L'approche consistant à mettre des éléments en display:none ne me semble pas la bonne solution. Cela rajoute des traitements qui n'ont pas lieu d'être et alourdi les pages. Du coup, la seule solution aujourd'hui qu'on m'a proposée consiste a dupliquer le site pour faire la version mobile.

Qu'en pensez vous ? Voyez vous autre chose à faire ?

Par curiosité, j'ai également travaillé récemment sur une plateforme dont le site mobile ne gérait aucune donnée. Il ne faisait qu'appeler des API du site web, développer spécifiquement pour lui, pour récupérer des données. Sachant que cela a demandé un coup supplémentaire et que le site mobile aurait pu sans souci accéder à la BDD, je me demandais si cette façon de faire avait un avantage particulier (hormis le faire de tout gérer en js et de l'installer comme une appli ? ce qui n'est pas le cas ici).

Enfin, si vous avez des bonnes ressources ou articles, je suis preneur, je m'oriente aujourd'hui vers knacss.

Merci d'avance pour vos retours Smiley smile
Administrateur
Hello,

Même si cela peut parfois être parfaitement justifié, dupliquer un site web pour mobiles est généralement une plaie à maintenir Smiley ohwell

Mais je confirme également que display: none est loin d'être une bonne solution en terme de performances d'affichages.

Dans ton cas, il me semble que tu pourrais t'orienter vers des solutions permettant d'introduire du contenu de façon conditionnelle. Par exemple via AJAX ou directement côté serveur avec des solutions RESS (fais des recherches sur ce mot à la mode, tu trouveras des bonnes ressources).

Bonne chance Smiley smile
Bonjour Rapahel,

Merci pour ce premier avis. Tout a fait d'accord pour la partie maintenance, c'est de toute façon un choix finale qui dépendra du client.

Pour la partir Ajax, cela implique je pense de revoir aussi la partie web ce qui est difficilement envisageable.

Je vais regarder coté RESS par contre, si je peux garder les templates existants pour le web et afficher si nécessaire des templates mobile, ça pourrait le faire.

Merci encore Smiley cligne
Le site "classique" est en MVC apparemment?

Si c'est le cas, pour la maintenabilité contente toi d'inclure les models appropriés s'ils ne sont pas trop volumineux puis de créer les controllers et ensuite les vues. Un conseil, organise bien tes dossiers et fixe toi des règles sinon ça devient vite l'enfer.

Pour le "manque de temps" : Jquery Mobile propose des éléments graphiques très convaincants et facile d'utilisation. Si tu as plus de temps je te conseil de mettre les deux mains dans le CSS de manière plus approfondie.

Même si j'ai envie de dire "Responsive Design", dans ton cas est-ce bien le plus adapté? Je le conseil surtout sur du mobile-first.

Performance : Optimisation des requêtes (regarde du coté de Jquery Mobile et des possibilités de "pré-chargement", avec une bonne stratégie et des "user case" pertinent ça paye). Images allégées.
Merci pour ce retour.

Oui, le site est sous Zend Framework + moteur de template smarty + Mootools pour JS (choix techniques déjà là à mon arrivée sur le projet).

C'est une possibilité à étudier en effet, Zend permet de travailler en "module", je réfléchie donc aussi à mettre un module spécifique pour le mobile (dans lequel on remet les controllers, vues et modèles spécifiques au module) plutôt que de dupliquer le site.

Faut que je vois entre ça et le RESS parlé plus haut.

Par contre, ils veulent une charte graphique proche de l'existant, donc je ne pense pas utilisé des éléments graphiques de Jquery Mobile (+ compatibilité avec les éléments mootools), donc ça va plutôt etre du CSS Smiley cligne
Possibilité de conserver également les mêmes "models".

Concernant la charte graphique et tes inquiétudes sur Jquery Mobile, essaye donc ça par curiosité :

Theme Roller
Modifié par La_Memoire (11 Apr 2013 - 15:49)
Hello,

Je réouvre un peu le sujet afin d'avoir vos avis sur un potentiel choix. Le client ne souhaite le site mobile que sur les mobiles (et non les tablettes).

Du coup, pour la détection, je m'oriente sur un script type : http://detectmobilebrowsers.com/

Je ne sais pas ce que ça vaut, quelqu'un a-t-il testé ?

D'autre part, si cela fonctionne, je pourrais ainsi flagué en amont si on est sur mobile ou non.

A partir de là, je peux garder la partie model et controller (avec quelques conditions en plus si certains traitements n'ont pas lieu d'être sur la partie mobile) et juste changer la partie vue.

Qu'en pensez-vous ?