1485 sujets

Web Mobile et responsive web design

Bonjour,

Vaut-il mieux faire une seule page XHTML pour le media screen et le media handheld avec deux feuilles de style (c'est bien l'intérêt des CSS) ou faire deux feuilles de style et deux pages XHTML
C'est que j'ai regardé ce site et lui, il fait les deux, enfin je crois :
www.english360.com
www.english360.com/mobile

Si quelqu'un peut m'expliquer,

Merci
Si le but est d'avoir un contenu identique dans les deux versions, on fera une seule page HTML avec des feuilles de styles dédiées aux différents médias.

Le site que tu indiques, pour sa part, traite différemment le contenu pour le média mobile/petits écrans. Le contenu y est souvent abrégé, on va plus à l'essentiel car on ne peut pas se permettre de noyer le lecteur dans un contenu qu'il ne peut pas apréhender globalement (enfin, c'est sans doute comme ça qu'ils le voient, il ne faut pas généraliser non plus).

Bref, à partir du moment où on veut offrir des approches différentes selon le média, on fera deux fichiers HTML.

À noter que les standards du web, et en particulier les CSS, permettent d'adapter un contenu à différents type de restitution.
De plus, il me semble que l'adaptation d'un contenu (et donc pas uniquement de sa mise en forme) pour le média handheld est raisonable uniquement dans le cas d'un site dynamique (CMS) qui, à partir d'une même base de données, peut produire des contenus HTML différents.
mais il est aussi possible de créer de site qui marchent aussi bien sur pc que sur mobil et avec une seule css. Tout cela dépend de l'intéret que l'on porte à l'accessibilité. car un site accessible est avant tout un site qui marche partout et sur tout Smiley smile
Bonjour,

l'intérêt des Css est d'avoir un seul document XHTML et une feuille de style associé pour chacun des médias selon de principe de séparation contenu/présentation

si tu as un document xhtml bien structuré, une feuille de style associé pour le périphérique mobile peut suffir.

Le problème qui se pose souvent (et pour le cas du site que tu prend pour exemple) est qu'il est plus ergononomique d'afficher moins d'informations sur un site pour périphérique mobile . Dans ce cas le principe de séparation contenu/présentation touche aux contenus et il devient souvent nécessaire de créer une page xhtml spécifique pour le mobile en éliminant une partie du contenu.

une autre solution pour alléger ton contenu consisterait à utiliser dans ta feuille de style pour le périphérqiue mobile la propriété
display:none 
qui permet de ne pas afficher le contenu. Tu élmines donc le contenu secondaire que tu considère superflux sur un mobile

selon le cas il vaut mieux adopter la deuxième solution qui te permet de n'avoir a effectuer q'une seule mise à jour de tes infos dans ton document xhtml.
...
ou alors faire comme le site que tu prend pour exemple et créer un document stucturé avec du XHTML mobile qui de permet d'être plus sur du rendu sur un périphérique mobile