A voir également:
- Conseil Width Page HTML
- Supprimer une page word - Guide
- Page d'accueil iphone - Guide
- Traduire une page web - Guide
- Editeur html - Télécharger - HTML
- Créer une page facebook - Guide
5 réponses
Bonjour,
quelques remarques tout d'abord:
_Les tableaux ne sont plus recommandés(pour certaines raisons que je ne développerais pas) pour la mise en page depuis 10 ans.
_Le HTML c'est la base, la structure et les éléments du document mais il doit être complété par le CSS (feuille de style en cascade) qui permet de faire la mise en page, de donner des dimensions, des positionnements, des comportements interactifs en se passant de javascript(dans une certaine mesures), de mettre des couleurs, de jolies apparences et d'insérer des images en fond d'un élément... bref HTML permet de mettre des balises, CSS permet de faire que ces balises soient présentées de façon correctes.
L'ancienne utilisation des attributs HTML et de certaines balises de mise en page est donc abandonné(bien que possible avec le doctype transitional) au profit du CSS exclusivement.
DOCTYPE: c'est une indication au début de la page HTML qui va indiquer dans quelle version la page(correspondant aux évolutions des normes et technologies employées) est écrite.
Réponses:
Laissez tomber les tableaux et utilisez e positionnement CSS pour présenter les éléments de la page, c'est la façon correcte de procéder(et permettant le référencement naturel).
>Est ce que je dois mettre une taille juste dans la div la plus haute ? (div global)
Sans voir le code je ne suit pas devin je ne peut dire à quoi ça correspond. Si vous avez un div qui englobe tout les autres quelle est son utilité? C'est le rôle de la balise body il me semble.
En html5 une nouvelle nomenclature et des balises sémantiques(qui permettent d'avoir un langage de description de la page plus fin) est possible, cela se fait par le biais de quelques nouvelles balises.
Pour vos questions sur les dimensions c'est à vous d choisir.
Sachez toutefois que les utilisateurs ont des écrans de taille, de dimensions et de résolutions différentes, c'est encore plus vrai dans le cas des tablettes où les tailles et résolutions sont moindres. Si vous utilisez une taille fixe avec des valeurs vous devez prévoir une page qui s'affiche pour ces tailles minimum(et qui fera petite donc pour la majorité des grandes résolutions).
L'utilisation de valeurs proportionnelles(comme les %) permet de pouvoir adapter ces dimensions quelles que soient les résolutions de l'utilisateur.
Vos questions sur l'affichage des images est légitime.
A mon avis il s'agit plus d'un problème de choix du design: vous mettez de nombreuses images (dans des tableaux si j'ai bien compris) sur une page donc le résultat sera pas très visible(images trop petites) et donc s'afficheront mal sur un écran de tablettes de petite taille...
La solution la plus évidente pour moi est pas technique mais graphique:
mettez moins d'images par pages, elles s'afficheront plus gros et resteront lisibles. Faire plusieurs pages pour présenter plusieurs choses est la meilleure des solutions: cela ne coûte pas plus cher, permet d'avoir des contenus mieux ordonnés et beaucoup plus facile à lire. En graphisme une règle essentielle est de respecter les blancs: cela n'indique pas forcément la couleur mais que les éléments d'une présentation sont mis en valeur par le vide et l'espace ouvert autour d'un texte d'une image permettant à l'oeil et au cerveau de se concentrer plus facilement sur le sujet et non d'avoir une masse d'informations inutile à décrypter avant d'avoir le sujet.
>2e petite questions en lien
Comment Forcer la taille (les fixer) des colonnes et TD pour eviter que ces images déforment mes tableaux au niveau des lignes et des colonnes?
Tout simplement les tableaux ne sont plus faits pour ça. Pour fixer des vaeurs vous devez indiquer à chaque cellule sa dimension(% ou pixel mais en CSS pas avec 'attribut WIDTH qui est obsolète-je ne détaillerais pas les avantage nombreux qui ont motivé cette décision du consortium web qui fait les normes-).
Si vos tailles d'affichage ne sont pas suffisante pour une résolution que vous prévoyez il faut simplement les changer et alléger votre page. Bien sûr vous ne pouvez satisfaire l'utilisateur de votre site qui consulte sur son téléphone et quelqu'un qui a une résolution élevée sur un écran de grande taille. Vous pouvez soit jongler entre les 2 en faisant quelque chose d'intermédiaire (ce qui est ma solution) ou prévoir 2 sites suivant les supports(et résolution d'affichage).
Le problème vous le prenez à l'envers j'ai l'impression, ce ne sont pas vos images qui déforment les tableaux: le tableau étant la pour présenter les images, il faut que les dimensions de vos images soient donc adaptées à l'affichage minimal(résolution) que vous prévoyez. 10 images de 200 pixels de large sur une même ligne donnera pas grand chose que des petites cases sur un écran de téléphone portable, donc mettez en 4 ou 5 et ça sera lisible ou alors changez les tailles des images (vous y perdez en qualité bien sûr).
En tout cas les tableaux me semblent pas la bonne méthode pour ce que vous voulez faire.
Le positionnement en CSS permet de régler de façon plus précise le positionnement qui sera pas dépendant de cases et de lignes/colonnes fixées; les tableaux ne sont plus destinés à cette astuce de mise en page mais aux données tabulaires comme une feuille de calcul excel.
quelques remarques tout d'abord:
_Les tableaux ne sont plus recommandés(pour certaines raisons que je ne développerais pas) pour la mise en page depuis 10 ans.
_Le HTML c'est la base, la structure et les éléments du document mais il doit être complété par le CSS (feuille de style en cascade) qui permet de faire la mise en page, de donner des dimensions, des positionnements, des comportements interactifs en se passant de javascript(dans une certaine mesures), de mettre des couleurs, de jolies apparences et d'insérer des images en fond d'un élément... bref HTML permet de mettre des balises, CSS permet de faire que ces balises soient présentées de façon correctes.
L'ancienne utilisation des attributs HTML et de certaines balises de mise en page est donc abandonné(bien que possible avec le doctype transitional) au profit du CSS exclusivement.
DOCTYPE: c'est une indication au début de la page HTML qui va indiquer dans quelle version la page(correspondant aux évolutions des normes et technologies employées) est écrite.
Réponses:
Laissez tomber les tableaux et utilisez e positionnement CSS pour présenter les éléments de la page, c'est la façon correcte de procéder(et permettant le référencement naturel).
>Est ce que je dois mettre une taille juste dans la div la plus haute ? (div global)
Sans voir le code je ne suit pas devin je ne peut dire à quoi ça correspond. Si vous avez un div qui englobe tout les autres quelle est son utilité? C'est le rôle de la balise body il me semble.
En html5 une nouvelle nomenclature et des balises sémantiques(qui permettent d'avoir un langage de description de la page plus fin) est possible, cela se fait par le biais de quelques nouvelles balises.
Pour vos questions sur les dimensions c'est à vous d choisir.
Sachez toutefois que les utilisateurs ont des écrans de taille, de dimensions et de résolutions différentes, c'est encore plus vrai dans le cas des tablettes où les tailles et résolutions sont moindres. Si vous utilisez une taille fixe avec des valeurs vous devez prévoir une page qui s'affiche pour ces tailles minimum(et qui fera petite donc pour la majorité des grandes résolutions).
L'utilisation de valeurs proportionnelles(comme les %) permet de pouvoir adapter ces dimensions quelles que soient les résolutions de l'utilisateur.
Vos questions sur l'affichage des images est légitime.
A mon avis il s'agit plus d'un problème de choix du design: vous mettez de nombreuses images (dans des tableaux si j'ai bien compris) sur une page donc le résultat sera pas très visible(images trop petites) et donc s'afficheront mal sur un écran de tablettes de petite taille...
La solution la plus évidente pour moi est pas technique mais graphique:
mettez moins d'images par pages, elles s'afficheront plus gros et resteront lisibles. Faire plusieurs pages pour présenter plusieurs choses est la meilleure des solutions: cela ne coûte pas plus cher, permet d'avoir des contenus mieux ordonnés et beaucoup plus facile à lire. En graphisme une règle essentielle est de respecter les blancs: cela n'indique pas forcément la couleur mais que les éléments d'une présentation sont mis en valeur par le vide et l'espace ouvert autour d'un texte d'une image permettant à l'oeil et au cerveau de se concentrer plus facilement sur le sujet et non d'avoir une masse d'informations inutile à décrypter avant d'avoir le sujet.
>2e petite questions en lien
Comment Forcer la taille (les fixer) des colonnes et TD pour eviter que ces images déforment mes tableaux au niveau des lignes et des colonnes?
Tout simplement les tableaux ne sont plus faits pour ça. Pour fixer des vaeurs vous devez indiquer à chaque cellule sa dimension(% ou pixel mais en CSS pas avec 'attribut WIDTH qui est obsolète-je ne détaillerais pas les avantage nombreux qui ont motivé cette décision du consortium web qui fait les normes-).
Si vos tailles d'affichage ne sont pas suffisante pour une résolution que vous prévoyez il faut simplement les changer et alléger votre page. Bien sûr vous ne pouvez satisfaire l'utilisateur de votre site qui consulte sur son téléphone et quelqu'un qui a une résolution élevée sur un écran de grande taille. Vous pouvez soit jongler entre les 2 en faisant quelque chose d'intermédiaire (ce qui est ma solution) ou prévoir 2 sites suivant les supports(et résolution d'affichage).
Le problème vous le prenez à l'envers j'ai l'impression, ce ne sont pas vos images qui déforment les tableaux: le tableau étant la pour présenter les images, il faut que les dimensions de vos images soient donc adaptées à l'affichage minimal(résolution) que vous prévoyez. 10 images de 200 pixels de large sur une même ligne donnera pas grand chose que des petites cases sur un écran de téléphone portable, donc mettez en 4 ou 5 et ça sera lisible ou alors changez les tailles des images (vous y perdez en qualité bien sûr).
En tout cas les tableaux me semblent pas la bonne méthode pour ce que vous voulez faire.
Le positionnement en CSS permet de régler de façon plus précise le positionnement qui sera pas dépendant de cases et de lignes/colonnes fixées; les tableaux ne sont plus destinés à cette astuce de mise en page mais aux données tabulaires comme une feuille de calcul excel.
animostab
Messages postés
2829
Date d'inscription
jeudi 10 mars 2005
Statut
Membre
Dernière intervention
11 novembre 2019
738
8 oct. 2013 à 00:27
8 oct. 2013 à 00:27
suivre ces tutos pour apprendre a faire un site web
https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3
https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3
ThEBiShOp
Messages postés
8378
Date d'inscription
jeudi 22 mars 2007
Statut
Contributeur
Dernière intervention
8 février 2021
1 565
8 oct. 2013 à 09:05
8 oct. 2013 à 09:05
On peut utiliser les tableaux pour représenter des données tabulaires, il faut juste éviter d'utiliser les tableaux pour créer la disposition du site, chose qui était très utilisée il y a quelques années.
Bonjour,
Alors tout d'abord Merci, je reste stupéfait par la qualitéde votre rédaction et de la quantité de connaissance que vous avez :-).
C'est noté pour vos Rappels, j'ai fait quelques recherches entre temps et vous avez completement raison.
Quand vous dites "laissez tombez les tableaux et préféré la mise en page CSS" je ne pense pas que ça soit possible dans mon cas, car dans ces images dans chaques cellulles (ce sont des indicateur de valeur, exemple rouge c'est pas bon, vert c'est bon etc...) elles sont liées par la colonne th et la ligne (et aussi la BDD) .
c'est pour ça que j'utilise un tableau.
Et vraiment je trouve pas du tout comment remedié à cela, mes données pour qu'elles soient intéréssantes doivent prendre en compte les lignes/colonnes,je ne vois pas comment le CSS peut arranger tout cela de cette façon et encore moi avec un IE8 (pas de CS3 ou peu ) . car avec les tableaux ça me permettait de faire un alignement des lignes, vu que des tableaux de données se superposent à certains moments, ou de faire un remplissage de la table assez rapide avec un truc comme :
for each tr
echo tr .$ligne
Je suis d'accord pour "L'utilisation de valeurs proportionnelles(comme les %) permet de pouvoir adapter ces dimensions quelles que soient les résolutions de l'utilisateur." Mais il faut un minimum des tailles non ?
Je m'explique en mettant que des %, certaines balise enfant n'arrivent pas a détéerminé une width c'est ce que j'ai remarqué et ajouté a cela des TD qui exploser à cause du contenu, je m'etais completement perdu.
Mes respects.
Alors tout d'abord Merci, je reste stupéfait par la qualitéde votre rédaction et de la quantité de connaissance que vous avez :-).
C'est noté pour vos Rappels, j'ai fait quelques recherches entre temps et vous avez completement raison.
Quand vous dites "laissez tombez les tableaux et préféré la mise en page CSS" je ne pense pas que ça soit possible dans mon cas, car dans ces images dans chaques cellulles (ce sont des indicateur de valeur, exemple rouge c'est pas bon, vert c'est bon etc...) elles sont liées par la colonne th et la ligne (et aussi la BDD) .
c'est pour ça que j'utilise un tableau.
Et vraiment je trouve pas du tout comment remedié à cela, mes données pour qu'elles soient intéréssantes doivent prendre en compte les lignes/colonnes,je ne vois pas comment le CSS peut arranger tout cela de cette façon et encore moi avec un IE8 (pas de CS3 ou peu ) . car avec les tableaux ça me permettait de faire un alignement des lignes, vu que des tableaux de données se superposent à certains moments, ou de faire un remplissage de la table assez rapide avec un truc comme :
for each tr
echo tr .$ligne
Je suis d'accord pour "L'utilisation de valeurs proportionnelles(comme les %) permet de pouvoir adapter ces dimensions quelles que soient les résolutions de l'utilisateur." Mais il faut un minimum des tailles non ?
Je m'explique en mettant que des %, certaines balise enfant n'arrivent pas a détéerminé une width c'est ce que j'ai remarqué et ajouté a cela des TD qui exploser à cause du contenu, je m'etais completement perdu.
Mes respects.
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Merci Animostab : malheuresement, je n'ai pas encore cette technologie ^^, je suis dans un service spéciale et un peu en retard ou l'on utilise IE8 .
TheBiShop, d'accord je comprends mieux, car je me disais ne plus utilisé de tableau pour croiser une ligne et une colonne ... je vois pas mille autres solutions meme si son analyse est tres tres bonne .
ET Pour l'histoire du tableau englobant c'etait surtout pour m'assurer que tout les tableaux se rangent bien ---> à tort je commence à le voir
TheBiShop, d'accord je comprends mieux, car je me disais ne plus utilisé de tableau pour croiser une ligne et une colonne ... je vois pas mille autres solutions meme si son analyse est tres tres bonne .
ET Pour l'histoire du tableau englobant c'etait surtout pour m'assurer que tout les tableaux se rangent bien ---> à tort je commence à le voir
