|
FORUMS PROFESSIONNELS
WINDEV, WEBDEV et WINDEV Mobile |
| | | | | |
| [WB17] Responsive Web Design, qui s'y est déjà tâté avec WB ? |
| Débuté par René MALKA, 17 juil. 2012 22:06 - 17 réponses |
| |
| | | |
|
| |
Membre enregistré
265 messages
Popularité : +14 (16 votes) |
|
Posté le 17 juillet 2012 - 22:06 |
Bonjour,
En gros le Responsive Web Design c'est la recomposition dynamique d'une page en fonction de la taille de l'espace d'affichage. Afin qu'une même page Web s'adapte automatiquement à toutes les tailles et résolutions d'écran, et donc y compris ceux des smartphones et autres tablettes. Ce n'est pas simplement un repositionnement des éléments qui la compose, cela peut dans certain cas aller bien plus loin.
Étant chargé de re-concevoir un site dans cette optique, j'aurais aimé savoir si parmi vous qui s'y est déjà collé et peut-être profiter honteusement d'une expérience déjà acquise...
Cordialement
>René MALKA |
| |
| |
| | | |
|
| | |
| |
Posté le 18 juillet 2012 - 10:52 |
Bonjour,
L'ancrage des éléments dans une page Webdev en mode zoning est délicate mais fonctionne parfaitement.
Dans la page d'accueil, en fonction de la largeur et de la hauteur du navigateur et de NavigateurPlateforme(), il faut lancer des familles de pages "publiques" adaptées à chaque environnement et navigateur et éventuellement aux dimensions de l'écran.
Mais cela demande analyse et pas mal de travail...
Pour ma part j'ai isolé les familles suivantes : iPad, iPhone et iPod, mobiles "étendus", smartphones et tablettes sous Android et enfin PC si aucun autre environnement n'a été détecté. (excepté Blackberry).
Courage...
Cordialement
>François SCHAAL |
| |
| |
| | | |
|
| | |
| |
Membre enregistré
265 messages
Popularité : +14 (16 votes) |
|
Posté le 18 juillet 2012 - 14:11 |
Bonjour François,
Et merci de ta réponse.
Mais si tu relis bien ce que j'ai écris et/ou que tu te renseignes sur le sujet tu te rendra compte que le Responsive Web Design cherche exactement à EVITER ce que tu proposes. C'est à dire la création d'autant de pages qu'il y a de tailles d'écran.
Quand tu songes, en plus, que pour une même taille d'écran tu peux avoir différentes résolutions, et ceci en format portrait ou paysage, tu devines le nombres de pages que tu peux être amené à créer, maintenir et faire évoluer... c'est tout simplement et rapidement l'usine à gaz !
Regardes par exemple la directive @media en CSS3, c'est le point d'entrée pour une meilleure compréhension du sujet.
Un bon exemple de site dit "responsive" est :http://2012.ampersandconf.com/
Ouvres le et réduit la taille de ton navigateur en partant du plein écran à celle que pourrait avoir un petit smartphone. Et observes comment se comporte le contenu. Et c'est toujours la même page quelque soit l'espace d'affichage
Cordialement
>René MALKA |
| |
| |
| | | |
|
| | |
| |
Posté le 18 juillet 2012 - 16:07 |
Rebonjour,
J'ai consulté le site en question. Superbe, en effet : même la taille des caractères s'adapte à la page. Une solution en Webdev : je n'en ai pas.
Dans mes solutions, j'ai un jeu de 5 familles de pages qui s'adaptent à tous les environnements matériels et navigateurs du marché. Ca a été complexe à mettre en place mais il s'agit de pages "publiques" moins nombreuses que les pages d'administration et je suis loin de l'usine à gaz.
Bon développement
>François |
| |
| |
| | | |
|
| | |
| |
Posté le 20 juillet 2012 - 16:33 |
| |
| |
| | | |
|
| | |
| |
Membre enregistré
265 messages
Popularité : +14 (16 votes) |
|
Posté le 23 juillet 2012 - 15:37 |
Bonjour et merci Guillaume,
J'avais déjà entendu parlé de Bootstrap et c'est l'occasion avec ta suggestion de m'y plonger vraiment. Quelques tutos vraiment intéressants et en français exsitent sur la toile.
Mais ce kit est surtout fait pour un démarrage de projet. Pas pour une reprise. Et comme le fait souvent remarquer Eric Roumégou, l'approche des styles par WB est loin d'aider !
Si tu as des conseils basés sur une expérience tangibles, n'hésites pas !
Cordialement
>René MALKA |
| |
| |
| | | |
|
| | |
| |
Posté le 01 juillet 2013 - 20:31 |
Bonjour,
Même si ce sujet date, je me demandais si vous aviez trouver une solution ?
Je peux toujours faire un template en html et changer des paramètres via webdev mais bon...
Merci
>Jonathan |
| |
| |
| | | |
|
| | |
| |
Membre enregistré
265 messages
Popularité : +14 (16 votes) |
|
Posté le 03 juillet 2013 - 14:31 |
Bonjour Jonathan,
Le fil dans le forum est déjà ancien c'est vrai, mais le sujet du responsive webdesign est d'une grande actualité !
En tout cas merci de ton intérêt.
Mes essais sur WB m'ont amenés à des approches plus ou moins lointaines du responsive tel qu'il est conçue actuellement, et qui restent très insatisfaisantes pour des sites un tant soit peu élaborés. Ces approches se basent soit sur l'utilisation des tables de positionnements - qui consiste à attribuer à un objet de la page une dimension en %, que ce soit en hauteur, en largeur ou les deux - soit sur la mise en œuvre conjointe du zoning et des ancrages. Chacune de ces solutions apporte des possibilités avérées, mais aussi des inconvénients majeurs. C'est à dire que la fluidité et la flexibilité ne seront alors réservées qu'à des pages simples, ne dépassant pas la complexité d'un formulaire. Le plus gros obstacle reste à mon avis que les champs évolués, comme les Tables et les ZR, sont pratiquement impossibles à dimensionner dynamiquement.
Ce qui est également certain c'est que l'utilisation de frameworks, tel que Bootstrap, est inenvisageable tant qu'il s'agit de passer par l'éditeur de pages de WB. Celui qui voudra avec WB élaborer un site flexible et fluide digne de ces exigences devra composer lui-même ses pages et devenir le champion du ScriptAffiche() ou du ChaineAffiche() ! Ce qui représente une solution viable - François SCHAAL l'a démontré brillamment - mais c'est se passer de 50% des avantages de l'outil, et aussi être prêt à réduire sa productivité d'autant, sinon plus. Enfin, dans l'immédiat...
Ceci étant dit, il faut tout de même se mettre à la place de PC-SOFT : les normes quand au responsive webdesign, n'existent pas encore. Ce ne sont qu'un empilement de méthodes et de préconisations, issuent d'une triangulation composée des organismes de normalisation, des concepteurs de navigateurs et de quelques webdesigners célèbres. Et la vision même de ce que sont fluidité et flexibilité est en perpétuelle évolution ! Le W3C pensait avoir trouvé la panacée avec les "media query", et patatras, le nombre de formats et de tailles d'écrans a presque doublé en un an ! A ce propos j'invite tout ceux intéressé par ce sujet à lire l'excellente étude réalisée par une de nos plus illustres collègues et compatriotes, Stéphanie Walter :http://mobile.smashingmagazine.com/2013/05/29/the-state-of-responsive-web-design/
Et donc je peux comprendre que PC-SOFT ne puisse se permettre de figer dans le marbre ni d'investir dans la réalisation de fonctions qui ne sont pas basées sur des normes établis ou pas encore arrivées à maturités. Déjà que ses ingénieurs ont fort à faire à gérer les effets de bord du passage d'une version à l'autre
En revanche là où PC-SOFT fait défaut, toujours à mon avis, c'est avec les champs Table et ZR. Le champ Table en particulier n'a pratiquement pas évolué depuis la version 14. Et je connais de plus en plus de développeurs qui se tournent vers des plugins comme jqGrid. C'est dommage non ?
J'ai bien conscience de ne pas avoir été exhaustif.
Il ne s'agit là que d'un retour d'experience en résumé
Bon dév à toi !
--
>René MALKA |
| |
| |
| | | |
|
| | |
| |
Membre enregistré
1 603 messages
Popularité : +64 (70 votes) |
|
Posté le 03 juillet 2013 - 16:12 |
Bonjour René,
Ton analyse est très complète. Le responsive webdesign semble promis à un bel avenir.
La CTS de Strasbourghttp://www.cts-strasbourg.fr/fr/vient de refondre complètement son site en responsive webdesign.
Excellent article aussi ici :http://www.alsacreations.com/article/lire/1559-responsive-web-design-present-futur-adaptation-mobile.html
En ce qui me concerne, j'utilise au maximum les fonctionnalités de Webdev pour adapter automatiquement les pages aux environnements.
Sur mes sites en gestion de contenus CMS comme sur intra.fr un curseur permet d'augmenter ou de réduire proportionnellement la taille des caractères des contenus HTML, à 100% de code navigateur.
Cette technologie est très utile pour afficher du contenu sur iPod,par exemple. Si la taille des caractères est 6 (maximum) sur PC, elle sera automatiquement affichée et limitée en 3 sur l'iPod.
Une image intégrée dans du contenu est mémorisée en deux tailles d'images (une normale + une réduite pour smartphones).
En ce qui concerne les ZR, je ne suis pas tout à fait d'accord parce que Webdev a fait de gros progrès (mais je ne sais plus depuis quelle version) dans les ZR avec le nombre de colonnes variables.
Cordialement
>François |
| |
| |
| | | |
|
| | |
| |
Membre enregistré
265 messages
Popularité : +14 (16 votes) |
|
Posté le 04 juillet 2013 - 11:59 |
Bonjour François,
Effectivement c'est l'avenir, et c'est une évidence dans la mesure ou les types de supports de consultation d'un site web n'arrêtent pas de se diversifier. Si Microsoft a radicalement changé l'interface de Windows avec la version 8 pour l'orienter mobile ce n'est pas par hasard
En tout cas merci de ton intervention.
Cela va me permettre de préciser un certain nombre de points concernant le responsive webdesign ici.
J'ai consulté le site de la CTS de Strasbourg, qui est effectivement très mignon esthétiquement. Mais je suis désolé François ce n'est pas encore du ''full'' responsive. Côté fluidité les choses ont été bien pensées puisque par défaut, en réduction de taille, l'affichage s'adapte du grand écran au format tablette. Mais en deçà de ce dernier format - j'ai testé sur un smartphone - c'est une autre page qui s'ouvre, et qui là met en œuvre une flexibilité qu'il n'y a pas du tout sur grand format. Ce qui signifie que c'est plus une intelligente adaptation de l'esprit du responsive, mais pas du full responsive
Autre point, pour qu'un site soit considéré comme responsive, par défaut, l'utilisateur n'a pas à devoir intervenir pour adapter une taille ou un positionnement. Le design responsive est justement là pour éviter que, quelque soit la taille du support, l'expérience utilisateur ne soit perturbée par la nécessité d'actions qui n'ont rien à voir avec le contenu du site.
Merci aussi d'avoir donné le lien de l'article original en français de Stéphanie Walter
L'intérêt de la publication en anglais sur Smashing Magazine ce sont les commentaires en bas de page qui sont une source d'informations et de liens.
Pour ce qui est des ZR je suis d'accord avec toi, il y a eu une évolution, mais entre nous rien de bien révolutionnaire au regard des attentes de bon nombre de développeurs.
Bien cordialement
René MALKA
--
>René MALKA |
| |
| |
| | | |
|
| | |
| |
Membre enregistré
265 messages
Popularité : +14 (16 votes) |
|
Posté le 04 juillet 2013 - 14:04 |
Bonjour à nouveau !
Juste pour donner un exemple de ce qu'il est possible de réaliser en édition de pages responsives :
http://froont.com/
Si un developpeur ou directeur technique de PC-SOFT passe par ici ....
--
>René MALKA |
| |
| |
| | | |
|
| | |
| |
Membre enregistré
1 603 messages
Popularité : +64 (70 votes) |
|
Posté le 04 juillet 2013 - 14:55 |
Bonjour René,
Je ne suis pas un spécialiste du responsive webdesign.
Sur mon ipod, le site de la CTS s'affiche : il s'agit de la même page que sur un PC mais sans l'image ni certains éléments de droite, mais c'est bien une page unique : j'ai lu un article la dessus dans la presse locale, mais OK il faut bien faire attention.
D'accord c'est peut être pas du full responsive webdesign mais c'est quand même d'un excellent niveau pour ses concepteurs.
Je ne sais pas non plus si la taille des caractères peut varier.
J'ai l'impression que le responsive webdesign se codifie avec par du HTML5 et par les CSS et des bases de données sans autre outil.
Un autre avantage du responsive webdesign, à mon avis, c'est de faire disparaître du site tout ce qui n'est pas nécessaire ; bandeaux publicitaires, liens divers, vidéos, photos non nécessaires... pour un site plus sobre mais à mon avis plus lisible et plus efficace. Je pense que cela devient trop complexe d'intégrer encore et encore des champs HTML et autres.
Si PC Soft passait un jour à ces technologies, une migration serait elle possible ? Pas sûr. Je pense qu'il faudrait tout repenser.
Cordialement
>François |
| |
| |
| | | |
|
| | |
| |
Membre enregistré
265 messages
Popularité : +14 (16 votes) |
|
Posté le 05 juillet 2013 - 12:09 |
Bonjour François,
Nous sommes d'accord, ce n'est pas du full responsive mais c'est déjà beaucoup ! Comme je le disais plus haut c'est une approche intelligente pour répondre au besoin de réactivité d'un site. Bien que je n'ai pas fouillé en profondeur le site de de la CTS je devine que le nombre de page fonctionnelles est relativement limité. La dissociation PC-Tablette / Smartphone n'entraine donc qu'une charge de maintenance et des contraintes d'évolutions limitées.
Maintenant imaginons une application de gestion composée de centaines de pages. Qui offre des fonctionnalités dignes d'une gestion de projets, des données du personnel ou commerciales. Que cette application a le devoir d'être accessible de n'importe quel type de ''client'' qui a une connexion à Internet et/ou un Intranet. Au bureau, en clientèle, dans le train ou du bistro du coin. Et surtout qui intègre une ergonomie permettant dans tous les cas de figure de disposer de fonctionnalités adaptées à la situation, avec aisance et convivialité. Cela parait peut-être compliqué dis comme cela mais ce niveau de projet web est de plus en plus courants.
Si on en reste avec les outils non responsives il faudra créer au moins 3 applications dans une ! C'est à dire que chaque page sera dédoublée ou triplées pour s'adapter aux catégories PTS (PC / Tablettes / Smartphone ou Pointer / Tactile / Small). Imagines alors la charge de maintenance à envisager ? Et quand il s'agira de faire évoluer le moindre écran ....
De plus en plus de webdesigners comparent le responsive à l'eau ! Une eau qui s'adapte au contenant dans lequel on la déverse. Tout simplement. Et il est vrai que les contraintes imposées par le responsive entrainent actuellement une tendance au dépouillement et à la simplicité. A mon avis c'est passager
Pour ce qui est des langages et des techniques, oui, point de salut hors HTML5 et CSS3 ! Mais pas seulement, les processeurs CSS se rendent de plus en plus indispensables également. La modèle MVC prend aussi un essor grandissant.
Pour ce qui est de WebDev, non tout n'est pas à repenser. Seul l'éditeur de page l'est, et avec lui le module de génération de code. Mais quelque chose me dit que PC-SOFT y travail déjà depuis longtemps. Il va nous falloir être patients. Et c'est ce que nous demande d'ailleurs PC-SOFT : regardes donc tout en bas de la page d'aide récapitulant les nouveautés de la dernière version, "Merci de votre patience."
>Cordialement |
| |
| |
| | | |
|
| | |
| |
Membre enregistré
1 603 messages
Popularité : +64 (70 votes) |
|
Posté le 05 juillet 2013 - 14:16 |
Bonjour René,
Il y a dans Webdev un outil qui s'appelle "Envoyer une suggestion" à PC SOFT.
Cordialement
>François |
| |
| |
| | | |
|
| | |
| |
Membre enregistré
265 messages
Popularité : +14 (16 votes) |
|
Posté le 05 juillet 2013 - 16:34 |
Cher François,
Oui et c'est ce que j'ai fais il y a environ 10 mois.
Réponse du ST : C'est une bonne idée que nous transmettons aux ingénieurs concernés.
Cordialement
--
>René MALKA |
| |
| |
| | | |
|
| | |
| |
Posté le 09 septembre 2014 - 12:31 |
René MALKA a écrit :
Cher François,
Oui et c'est ce que j'ai fais il y a environ 10 mois.
Réponse du ST : C'est une bonne idée que nous transmettons aux ingénieurs concernés.
Cordialement
--
René MALKA
Si cela pouvais être une des 920 nouveauté de webev 20> mais je n'y crois guère ... |
| |
| |
| | | |
|
| | |
| |
Membre enregistré
1 603 messages
Popularité : +64 (70 votes) |
|
Posté le 10 septembre 2014 - 09:41 |
Bonjour,
Ce ne serait pas une nouveauté mais une révolution dans Webdev !
Je fais confiance aux ingénieurs de PC SOFT : le marché l'exigera rapidement.
D'ailleurs la version mobile semble déjà intégrer le multi-environnement.
--
Cordialement
François
http://intra.frhttp://intrasoftware.fr> |
| |
| |
| | | |
|
| | |
| |
Membre enregistré
1 603 messages
Popularité : +64 (70 votes) |
|
Posté le 15 octobre 2014 - 08:22 |
| |
| |
| | | |
|
| | | | |
| | |
| | |
| |
|
|
|