18073 sujets

Questions générales et questions de débutants

Structure de site possible ou pas en CSS ?

bonsoir

je suis débutant en CSS (mais pas en HTML quand même Smiley cligne )... j'ai eu beau potasser tous les cours que j'ai pu trouver sur le net concernant le positionnement CSS, je suis incapable d'arriver à mes fins quant au positionnement que je souhaite faire sur un de mes sites.
En version Table, ça serait évident, mais en CSS j'ai beau triturer les <div> et le toutim dans tous les sens, ça va pas... pourtant ce que je demande ne me paraît pas irréalisable au coup d'oeil et sommes toutes assez classique.

je ne sais pas si en posant cette question je transgresse une loi du forum, mais si une âme charitable et douée du css pouvait prendre quelques minutes de son temps précieux et rentrer en contact avec moi pour éclairer ma lanterne, je lui en serais fortement reconnaissant ! (mes cheveux aussi ! c'est limite à se les arracher !)

merci mille fois d'avance si c'est possible...
(j'ai fait un squelette sous forme d'image pour m'expliquer au cas où...)

Nicolas
Modérateur
Bonjour,

L'idéal serait que tu montre un lien pour voir cette maquette. Au pire, si tu as peur de te faire piquer ta maquette, dessine seulement les zones principales, sans graphisme. Juste les blocs, textes et listes à positionner.
l'avantage des forums c'est qu'on tombe sur des personnes rapides ET sympas, ça c'est cool !

voilà le squelette de ce que je recherche pour une home : http://nikola.free.fr/squelette.jpg

pour répondre, oui j'ai consulté les tutoriaux, j'ai parcouru ceux-ci et bien d'autre en ligne, et j'ai même le livre de R.Goetter...
je dois dire qu'après ces centaines de lignes d'explications, j'ai encore du mal (typique pour un débutant hmmm? ) avec le positionnement des blocs...

dans mon exemple, impec pour le header/menu du haut.
ça se corse surtout pour deux choses :
+ bien positionner les 4 blocs centraux (de préf de taille fixée identique) et le 5e central qui prend toute la largeur.

+ positionner le footer de façon à ce qu'il soit toujours, quelle que soit la hauteur de la page, en bas juste en dessous de ce qu'il termine. Là j'ai consulté pas mal de sites qui ont chacun leur solution plus ou moins aisée à mettre en place je dois dire, mais rien de concluant pour le moment.

merci de me dire si c'est réalisable facilement
forcément en absolute j'y suis parvenu, en fixant tous les blocs (mais dans ce cas autant rester en version table à mon goût -arghhh je sens les coups déjà !-)
mais je n'arrive pas à "empiler" correctement les blocs (absolute mélangé au float et/ou relative... là j'ai du mal à m'y retrouver malgré tout ce que j'ai lu)

voilà, si quelqu'un a un conseil il est le bienvenu !!!

merci

Nico
Plusieurs choses :
* c'est réalisable
* facilement... tout est relatif, il faut ici mettre un peu d'huile de coude et multiplier le balisage pour faciliter (rendre possible ?) les choses
* MAIS QU'EST-CE QUE C'EST COMPLIQUE TON TRUC !!!!!!!!!!

Avant de se lancer dans la réalisation de la mise en page, ne serait-ce pas mieux de simplifier ta page pour rendre le contenu plus facilement utilisable et consultable ??

Là, j'imagine bien le foutoir final que ça doit donner !!
Franchement, je reconsidererais la structure et la présentation de ta page en visant à simplifier l'ensemble.

Après, si tu as cette idée en tête pour des raisons bien précises, établies, valables etc... on pourra se pencher sur la question.

Autre chose, dans un premier temps, tu peux gérer ta mise en page générale (le découpage en zone grosso modo, une dizaine de cellules) de façon propre, et faire tout le reste à base de CSS, quitte à revoir à terme la structure. Mais ça serait mieux de directement passer à une mise en page sans tableaux Smiley cligne

Mais avant tout, reprend bien l'ensemble et regarde si plus simple, c'est pas possible. (je vois mal comment ça pourrait ne pas être possible de faire plus simple que ça !! Smiley langue )
Modifié par Olivier (26 Jan 2006 - 23:25)
bon, je vois que c'est définitivement complexe ma structure... je vais revoir ma copie alors
les tables j'en fait depuis des années, et là je suis décidé à passer au CSS, alors exit les tableaux, je vais me zigouiller quelques neurones de plus pour essayer de comprendre la logique du positionnement du CSS... si d'autres y sont arrivés, pourquoi pas moi hein ! Smiley smile

... simplifions... il m'a dit simplifions...
Ah oui, autre remarque, eviter de mélanger float, position: absolute; ça fait généralement pas bon ménage pour le contrôle "d'ensemble".

Personellement, je recommande l'utilisation des float avec le clear en complément.
Salut,

Faire une mise en page sur la base de ton squelette ne me paraît pas trop ambitieux. En fait ça reste assez classique.
Tu peux par exemple essayer d'adapter ce modèle : à largeur fixe, ou largeur "fluide"
Pour placer les 4 bocs dans la partie centrale, float devrait faire l'affaire

Bonne continuation,

Alain
Il y a une tentation qui revient souvent et dont il faut, je pense, savoir se débarasser :
il ne faut pas vouloir faire la même chose avec une mise en page CSS qu'avec une mise en page par tableaux.

Ce n'est pas la même façon de penser et ce qui est facile avec une méthode ne l'est pas forcément avec l'autre. Il est beaucoup plus interessant et valorisant, à mon avis de penser, sa mise en page en ayant en tête les possibilités de la méthode retenue.

Par exemple :
une des grosses limitations actuelles de CSS est la difficulté d'aligner et d'ajuster verticalement la taille les blocs les uns par rapport aux autres. Mon avis est qu'il ne faut pas chercher à le faire.

Voir pour illustration ces deux sites :
- http://www.buzzwordhell.com/
- http://www.worldspanmarketing.co.uk/

Dans le premier, on a deux colonnes : les blocs de hauteur variable sont alignés en haut mais pas en bas. Cependant, un dégradé astucieux permet de masquer le bas des blocs.

Dans le second, le desing lui-même est pensé de telle façon à ce que les deux colonnes n'aient pas besoin de faire la même taille.

Ce sont des maquettes qui ont été pensées pour CSS, avec la pleine compréhension des limites et des possibilités que cela offre.

En l'occurence, ton design est pensé pour les tableaux, et le refaire en CSS n'offre que peu d'intérêt. Smiley cligne
Modifié par Lanza (27 Jan 2006 - 10:12)
Lanza a écrit :
Il y a une tentation qui revient souvent et dont il faut, je pense, savoir se débarasser :
il ne faut pas vouloir faire la même chose avec une mise en page CSS qu'avec une mise en page par tableaux.


C'est vrai ce que tu dis, mais quelques fois il y a les exigences du rendu que souhaite le commanditaire, c'est à dire, la mise en écran, pour ne pas parler de mise en page, qu'il souhaite... Smiley decu
Bonjour,

La maquette esquissée dans http://nikola.free.fr/squelette.jpg ne pose en effet pas de problèmes spécifiques de positionnement, ou plus exactement de float, car ce sera la technique de base à utiliser pour un rendu sans dégradation dans IE5.x-6.0 Windows (cette dégradation et le design d'ensemble pourraient être très économiquement maîtrisée avec d'autres techniques, mais la dégradation sera sans doute mal vécue par le client à qui on a fait croire depuis des lustres qu'une page Web devait avoir le même aspect quelque-soit le navigateur).

Du moins, rien de plus que d'habitude pour un débutant acharné et bien soutenu Smiley cligne

En revanche, comme le remarque très bien Lanza, la différence entre le possible en CSS et le souhait du client, ou le coût de développement du possible en CSS conforme au souhait du client... se mesureront sur la question des hauteurs. Si les blocs internes juxtaposés doivent impérativement faire réellement la même hauteur (pour cause d'effet de bordure, par exemple), un zest de tableau dans une mise en page CSS sera la solution la plus rationnelle a priori. Mais il faudrait avoir la maquette exacte sous les yeux pour en dire plus.

Sinon, je donnerais bien un lien potentiellement fort utile, mais ce serait une pub sans doute déplacée sur ce forum...
Modifié par Laurent Denis (27 Jan 2006 - 10:07)
merci à tout le monde pour vos réponses !
je crois que j'ai encore beaucoup de chemin à parcourir en CSS, j'en suis qu'à la découverte... mais il est vrai que je pars un peu déçu quant au potentiel (notamment de précision : positionnement en l'occurance) de ce langage... je m'étais fait une autre idée de sa puissance et je ne m'attendais pas à me retrouver coincé pour une banale histoire de position...
Donc à moi de potasser mes bouquins et de réarranger ma page finalement pour rendre le travail réalisable (facilement pour moi en tout cas)...

Nico.
Sujet clos
Aller à