Stretched site ?

[foxito]

salut,

personne ne parle de stretched site cad les sites qui s'etire en fonction de la taille de l'affiche.

Y a t il une raison a cela ?

[Dan]

Tu veux dire un design souple, comme le Hub ?

[foxito]

vi monsieur

[Jok]

Je ne vois pas pourquoi on en parlerai en fait ...

Y'a rien de sorcier derrière un site de ce genre.

[Dudu]

Bonjour

C'est pourtant relativement "à la mode" mais ce n'est pas sans poser quelques problèmes.

- les écrans de grande taille. On parle souvent des problèmes légers d'accessibilité pour les personnes ou 800x600, ou 640x480, ou encore plus petit (PDA, mobiles..) bref pour les écrans de petite taille.

Pour eux, on essaie d'avoir une mise en page fluide, élastique.. on tente de ne pas 'figer' la largeur.

Mais il y a aussi des personnes qui pour une raison ou pour une autre (souvent raison professionnelle) ont des écrans larges.. voire TRÈS larges ()

Si jamais l'idée saugrenue leur vient de passer leur navigateur en plein écran, çà devient illisible: les lignes de texte feront des kilomètres de largeur or il est prouvé qu'une ligne de texte idéale ne doit pas contenir plus d'une vingtaine de mots. Sans quoi, l'oeil a du mal à gérer les retours à la ligne.

Pour ces personnes-là, les mises en page souples posent problème.

Oui il y a bien la propriété max-width en CSS mais elle est peu utilisée, entre autres parce qu'IE Win ne la reconnaît pas.

- problèmes techniques en CSS: mine de rien ce n'est pas toujours évident de faire du 'souple'. Ne serait-ce parce qu'on ne peut pas encore, en CSS, additionner des unités différentes (20% de padding + 1px de bordure + 1em de margin-left = ???).

Ce sera peut-être pour CSS3, et encore ce n'est pas sûr, en tous cas pas pour tout de suite.

Tout le problème du fameux 'modèle de boîte' finalement

En ce moment, je m'arrache les cheveux à faire une mise en page très simple... mais élastique. Et bien ce n'est pas si évident en fait.. en tous cas lorsqu'on veut faire du vrai élastique.

(mon royaume pour additioner les pourcentages avec les pixels )

[foxito]

Je suis d'accord avec toi parce que moi aussi je m'arrache des cheveux.

Le pire c'est le melange de l'elastique avec le degradé.

D'ou ma futur calvitie...

[broadcastor]

Les longueurs de texte d'un design extensible deviennent vite problématique à la lecture, si on ne spécifie pas de max-width ou chose de ce type pour pallier a ce probleme, et ce n'est pas le seul comme il l'a été souligné precédement

[Loupilo]

Dudu a tout à fait raison quand il évoque l'impossibilité d'additionner des unités différentes... C'est un obstacle majeur à l'utilisation des CSS, et aux maquettes souples.

Un autre des problèmes importants de l'interpretation des CSS rendant leur utilisation difficile pour les sites étirables, c'est le modèle de boîtes de Microsoft. Non pas qu'il me gène, au contraire : je trouve que c'est le seul valable et qu'il devrait être celui de tous les navigateurs. Oui, je pense sincèrement que cette vision des dimensions CSS est bien plus interessante et bien plus pratique dans la conception de feuilles de style... et c'est regrettable qu'elle ne soit pas utilisable puisque limité à Internet Explorer quand il est en transe.

Prenons un cas de figure simpliste : une boîte destinée à occuper 100% (largeur) de l'écran, avec des marges internes (padding) de 15px. Pas 1%, car la taille du % varie bien trop en fonction de la résolution (en plein écran : 1%=8 pixels en 800*600, 16 en 1600*1200), pas 1em, qui serait susceptible de varier, mais bien 15px, fixes. Le résultat est tout aussi simple que l'énoncé, c'est impossible. La boite fera 100% de largeur + 30px. Votre bloc dépassera la zone de visualisation... Vous devrez vous rabattre sur le padding en % aux résultats variés. Avec IE en modèle de boites MS, votre bloc fera 100%-30px+30px de marges internes. Soit 100% en tout et pour tout... Le résultat escompté, en somme. Et logiquement, la zone de visualisation sera réduite à 100%-30px.

Sans même meler les unités, vous devrez attribuer une taille de 480 pixels à un bloc destiné en faire 500 avec une marge interne de 10 pixels. Et vous pourrez dire adieu à vos 500 pixels bien déterminés si vous comptez mettre le padding en em !

Bref, c'est un vrai casse-tête qui bride vraiment les possibilités. Bien sûr, on peut contourner certaines difficultés, mais l'implémentation des CSS dans la majorité des navigateurs ne permet pas de réaliser ce qu'on serait en droit d'attendre d'un langage se prétendant être la solution ultime de stylisation des pages Web...

Le max-width est indispensable, et le hack permettant de l'émuler sous IE (win) fonctionne très bien, ce n'est donc pas ça qui me fait douter des CSS pour les maquettes étirables... c'est le reste.

[Dudu]

je trouve que c'est le seul valable et qu'il devrait être celui de tous les navigateurs. Oui, je pense sincèrement que cette vision des dimensions CSS est bien plus interessante et bien plus pratique dans la conception de feuilles de style... et c'est regrettable qu'elle ne soit pas utilisable puisque limité à Internet Explorer quand il est en transe.

Tout pareil pour moi, et il est regrettable que le w3c ne tienne pas compte pour l'instant des (rares ? ) bonnes idées de Microsoft, qui est pourtant membre du w3c.

Mon rêve serait de pouvoir déterminer en CSS quel modèle de boîte utiliser.

[foxito]

Je pensais pas en lancant le sujet que ca allait generer du compliment pour Oncle Sam.

A quand un nouveau CSS...