logo-animiert

Menu
Accueil Accueil
1-Design 1-Design
2-Navigation 2-Navigation
3-Textes 3-Textes
4-Images 4-Images
5-Liens hypertexte 5-Liens hypertexte
6-Tableaux 6-Tableaux
7-Formulaires 7-Formulaires
8-CSS 8-CSS
Certification Certification
Demande Demande
Presse Presse
Mentions légales Mentions légales
Plan du site Plan du site
Recherche
PrinterFriendly
Version optimisée pour imprimer

6. Tableaux


6.1 Largeur des tableaux:

Lorsque vous réalisez un site Internet, nous vous conseillons de travailler avec une largeur de tableau de 98 %. De cette manière, le texte ne touche pas les bords et peut donc facilement être imprimé sur une page DIN A4. Si vous fixez une largeur , celle-ci ne devrait pas dépasser 620 pixels – de manière générale, les imprimantes classiques ne peuvent imprimer que cette largeur maxi.  Si vous utilisez une largeur plus importante, le texte sera "coupé" lors de l’édition.


Ce texte par exemple a été réalisé SANS tableau. L’avantage est que l’on peut utiliser la largeur totale de l’écran. Mais il existe 2 inconvénients : 1. lors d’une résolution plus élevée, les lignes deviennent très longues – et donc difficile à lire, et 2. le texte se termine souvent de manière défavorable – parfois, des lettres sont "coupées"et n’apparaissent qu’à moitié.

6.2 Répartir le contenu sur plusieurs petits tableaux:

Avant d’afficher un tableau, le navigateur Internet charge préalablement tout le contenu d’un tableau. Lorsque sur une de vos pages de contenu vous avez un grand tableau, tous les éléments doivent préalablement être chargés.

Il est donc recommandé de diviser les tableaux. Vous pouvez par exemple créer un tableau par chapitre. Dans ce site Internet, nous avons créé un tableau pour chaque point. Et lorsque dans un point il y avait de nombreuses images, nous avons même créé plusieurs tableaux. Par là, vous évitez l’impression d’avoir de longs temps de chargement.

 

6.3 Largeur fixe des colonnes:

Avez-vous déjà vu cela ? Vous définissez une largeur fixe en pixel pour diverses colonnes d’un tableau et votre éditeur WYSIWYG les ignore ou les crée différemment.

Astuce: Il est probable que le total des pixels de chaque colonne ne correspond pas aux pixels définis dans les propriétés du tableau, ou il se peut qu’il y ait une interférence avec un autre tableau.

Vérifiez qu’au moins un tableau n’ait pas de largeur fixe. Cliquez sur tous vos tableaux et contrôlez qu’au moins un tableau n’ait pas de largeur fixe.

Une autre possibilité peut arriver avec l’éditeur WYSIWYG. Vous voulez créer un tableau avec une largeur de 300 px. Le tableau est cependant toujours affiché à 100 %. Il est alors possible que dans le Design du CSS, les tableaux soient définis avec une largeur de 100 %. Supprimez cette information dans votre éditeur CSS, votre tableau aura alors une largeur de 300 px


6.4 Tableau avec textes et images:

Les tableaux permettent de réaliser une mise en page intéressante. Surtout si vous insérez des images pour rendre le texte plus attrayant, il est fortement conseillé d’utiliser des tableaux. Ci-dessous un exemple :



6.5 Tableau centré:

En règle générale, c’est plus esthétique si les tableaux sont centrés. Si vous avez une largeur de tableau fixée à 620 pixels, le tableau semble collé sur la gauche sur un écran avec une résolution de 1024 x 768.




Pseudo :
User-Login
Votre E-mail
*