Alterner la couleur des lignes dans un tableau HTML

3 08 2010

Alterner la couleurs des lignes sur des <table> HTML peut faciliter la lecture, et ça rend les tableaux moins austères.

Il est possible de le faire facilement en PHP si votre tableau est généré dynamiquement (avec une simple variable mise à jour à chaque itération, à chaque ligne du tableau).

Sinon, il y a une méthode plus simple, c’est de le faire en CSS avec les pseudo éléments :

table tr{background-color:#eee;} /*couleur par défaut, pour IE)*/
table tr:nth-child(odd) { background-color:#eee; } /*couleur des lignes pair*/
table tr:nth-child(even) { background-color:#fff; } /*couleur des lignes impair*/

J’ai aussi vu une méthode plus “oh yeah” avec des formules bizarres style 2n+1 = 3x+42y… :

table tr:nth-child(2n+1){
    background-color: #EEE;
}

Attention, ça ne marche qu’en CSS3 (comprenez : c’est pas près de fonctionner sur internet explorer, mais ça marche nickel sur tous les autres navigateurs).



Comment webdesign tutoriaux squatte google

20 06 2009

Les sites de tutoriaux se multiplient sur le web ces dernière années.

Ça a commencé avec les logiciels de graphisme comme Photoshop et ou Illustrator, et ça se propage aux soft de 3D ou de compositing comme After Effects.

Mais au milieu de tout ce contenu qui fait la richesse du web, il y a des imposteurs qui squattent les moteurs de recherches comme Google : ce sont les annuaire.

L’annuaire c’est génial, ça ne demande pas beaucoup de travail à son créateur au niveau du contenu, puisqu’il n’y en a pas. Non, la seule difficulté avec ce genre de site, c’est de se placer premier sur les meilleures requêtes (comme tutoriaux photoshop, tuto flash.

Ainsi, tout le trafic issu des moteurs transite par ces sites passerelles qui ne manquent pas de fidéliser une clientèle au passage, et dont le monopole écrasant empêche les petits sites à forte valeur ajoutée d’avoir la place qu’ils méritent.

Pourvu que ça dure…