A propos du Modèle de boîte Microsoft (ou "quirks")
Internet Explorer interprète les dimensions CSS différemment des autres navigateurs, ou plutôt interprétait... Contrairement à ce que laissent supposer certains articles et propos de designers "chevronnés" qui n’en démordent pas, Internet Explorer 6 de Microsoft interprète les dimensions CSS des pages html et xhml valides de la même manière que les autres navigateurs de même génération.
Afficher / Masquer des éléments sans javascript
Vous avez envie d'afficher un "calque" de contenu, ou une image lorsque le visiteur survole un lien quelconque. La plupart du temps, c'est Flash ou javascript et sa gestion de "calques" affichés/masqués qui vous permettent de réaliser vos voeux.
Pourtant, il existe une manière plus compatible de réaliser cette technique sans langage de programmation, ni flash.
Comprendre l'héritage et la parenté des styles CSS
Les styles CSS fonctionnent sur le principe d'imbrication, de parenté et d'héritage, quelques explications.
Créer une lettrine sur du texte
Une lettrine est la première lettre d'un paragraphe dans les récits. Large et bien mise en valeur, elle représente en général trois hauteurs de ligne.
Des statistiques graphiques grâce aux CSS
Fans des statistiques en tout genre, mais plutôt feignant en ce qui concerne leur réalisation picturale, voici une solution basée sur les feuilles de style CSS pour mettre en valeur de façon élégante et simple diverses données à présenter.
Faire un site pour toutes les résolutions
La question des dimensions idéales d'un site est souvent posée.
Les résolutions d'écran varient généralement de 800x600 pixels à 1280x960 pixels, en passant par 1024x768. Quelle est donc la résolution à privilégier ? Quelle est la dimension idéale pour un site web ?
Faire une feuille de style pour l'impression
On se focalise souvent sur les feuilles de style pour le rendu à l'écran, mais une page web peut également se décliner sous la forme d'un document imprimé. Coup de chance : les feuilles de style CSS servent aussi à définir les styles pour l'impression des pages web. Elle est pas belle, la vie ?
Les balises et propriétés HTML dépréciées et obsolètes
Les balises dépréciées sont l'ensemble des balises qu'il est déconseillé d'utiliser car elles pourraient devenir obsolètes et ne plus fonctionner sur les futurs navigateurs
Les standards du Web : aucune contre-indication !
Les langages du web (HTML, XHTML, XML, CSS,...) reposent sur des normes et des standards. Les organisations de normalisation, comme le W3C (World Wide Web Consortium), créent un consensus à travers ces groupes et ces experts pour maintenir et développer des principes architecturaux cohérents. Utiliser une norme permet la compatibilité du langage, de bénéficier des dernières innovations mais aussi de s'assurer de la pérennité des documents dans le futur.
Négociation de contenu
Une fois n'est pas coutume, un terme lié à internet n'est ni un mot anglais francisé ni une abréviation tordue mais une simple description. Passons la définition de négociation, il reste trois interrogations: qui négocie, quel est ce contenu et surtout quelle utilité pour tout ceci ?
Optimiser le poids de son site web (CSS séparée et include PHP)
Il existe de multiples techniques pour réduire le poids de ses pages web. Les plus fondamentales passent par l'optimisation du code HTML (supprimer les balises et scripts inutiles) et par l'optimisation des images et illustrations (choix du format, compression).
Nous supposerons dans cet article que ces deux premières étapes ont été correctement réalisées et nous allons nous pencher sur deux autres méthodes qui peuvent avoir un effet très bénéfique sur la lourdeur de votre site web : les Feuilles de Style séparées et l'instruction Include.
Principes à suivre pour un site web de qualité : Ergonomie, Compatibilité, Accessibilité
Les enjeux d'un site web sont multiples et sa compatibilité ainsi que sa qualité comptent parmi les premiers critères de sa réussite, tant au niveau quantitatif (trafic, nombre de commandes) que qualitatif.
STRONG, B, I, EM : quelle balise utiliser et pourquoi ?
Une question se pose fréquemment : quel est le "bon" usage des balises <strong>, <b>, <em> et <i> ? La tendance générale est à remplacer systématiquement <b> par <strong> et <i> par <em>.
Typographie web : gérer la taille du texte avec les « em »
Pour améliorer sensiblement l'accessibilité d'un site web, il faut permettre le redimensionnement du texte, afin qu'il s'adapte aux résolutions et aux paramètres des utilisateurs. Pour cela, on utilisera les unités relatives, et en particulier l'unité em. Mais beaucoup de webmasters, peu familiers avec cette unité, répugnent à l'utiliser. Dommage...
Ce tutoriel présente l'unité em et la démarche à suivre pour l'utiliser à bon escient, ainsi que quelques conseils pour vous aider à assurer autant que possible la lisibilité du texte sur votre site... et donc à en améliorer la qualité générale.
Une image réactive en CSS avec une seule image et sans javascript
Ce petit tutoriel simple vous explique comment réaliser un menu codé en xhtml et mis en forme grâce aux css, le menu réagit au passage de la souris pour laisser apparaître une nouvelle image de fond.
L'avantage de la méthode utilisée ici, est de n'utiliser qu'une seule image contenant l'état normal et l'état survolé. Ceci permet de découvrir l'image instantanément après le passage de la souris, l'image étant chargée une bonne fois pour toute dès l'affichage de la page.
Idée originale de la technique présentée ici : http://wellstyled.com/css-nopreload-rollovers.html, cette technique est aussi grandement utilisée par Dave Shea dans son exemple des « sprites », article traduit sur pompage.net.
Une ombre (ou un contour) sur du texte en CSS
Créer des effets de texte en CSS, comme des ombres portées, est très simple à mettre en oeuvre.
