Pour commencer, le site de référence : Dive into accessibility et la version traduite en français : Plongez dans l'accessibilité .

Il y a aussi la page W3C écrite en charabia traditionnel.

Le bout visible de l'Iceberg.

Un site web, c'est : du graphisme (la charte), du contenu (les informations et la navigtion) et du code qui lie graphisme et contenu et affiche tout ça sur un navigateur web. L'internaute voit le graphisme, lit le contenu, et se fout du code HTML. On ouvre pas le capot du moteur avant de prendre le bus, mais il faut qu'il roule, ce bus, il lui faut donc du beau HTML, sinon, tout le reste s'écroule.

Butineurs

En plus du classique Internet Explorer sur Windows, il ne faut pas oublier que le site peut être vu autrement.

Navigateur "multimédia"

Bon, il y a les classiques minorités, Safari sur Mac, Galeon sur Linux et autres combinaison plus ou moins exotique. Là, l'offre est maintenant stable, il y a 3 principaux moteur de rendus graphiques :

  • Internet Explorer . Grand vainqueur de Netscape, il est maintenant largement majoritaire. La version Mac etait un developpement à part, avec ses bugs et autres spécificitées enervante (comme son javascript catastrophique). Mais bon, c'est mort, le produit n'est plus maintenu et MacOSX est livré avec Safari qui utilise KHTML, plus standard. Aprés avoir écrabouillé Netscape, son developpement c'est arreté, laissant des bugs et des failles en suspend. Son attaque spécial a été la gestion du HTML pourrite, extremement tolérant qui a permis à des HTMLeurs flemmards de faire des sites illisibles avec des browsers plus stricts. Mais bon, il gère aussi les sites propres, et c'est le dernier des navigateurs à autoriser les popup de pub.
  • Netscape 4.x. Le passage a un DHTML completement proprietaire et buggé (mauvaise gestion des tableaux imbriqués par exemple, pas de DIV mais des LAYERs) lui ont été fatal. Heureusement avant de mourir, il a livré Gecko, le moteur de Mozilla
  • Gecko . Extremement ambitieux, il a mis enormement de temps à devenir utilisable, mais les avatars light de Mozilla : Camino, Galeon, Epiphany ... l'ont sauvé, du coups Mozilla à fait sa propre version light : FireFox, produit excellentissime sur toutes les plateformes.
  • KHTML. Le projet KDE, las d'attendre gecko a fait son propre interpreteur HTML. Apple a surpris tout le monde en utilisant ce moteur pour faire son propre navigateur web : Safari.

Je met de coté, bien sur, les différentes fonctionnalitées des interfaces de ses produits et autres détails qui font choisir l'un plutot que l'autres.

Navigateurs exotiques

Bon, ils ne sont pas trés répandus mais rendent des services bien précis.

  • Navigateur en mode texte. Lynx et Links par exemple, bien pratique en mode console.
  • Navigateur embarquée. Sur téléphone, Palm ou autres appareils avec des écrans tout petit.
  • Télé. Ca, ça n'a pas super marché, mais bon, s'assoir sur le canapé pour regarder un écran énorme en 512 pixels de large, n'a pas motivé grand monde.
  • Accés handicapé. Avec un petit robot qui lit les pages, un accés texte en braille, l'inversion des couleurs, grossissement de l'image ou autres astuce, le web est accessible au handicapés.

Les robots

Bien plus important, les sites webs sont regulierement visités par des robots, les spiders des moteurs de recherche qui indexent tout internet. Pour avoir plein de visiteurs, mieux vaut donc être gentil avec l'araignée de Google.

HTML

La version actuel du HTML et le XHTML qui facilte le travail de parsing par des moteurs XML. Concretement, ça veut dire fermer les tags que l'on ouvre, et mettre des <br/> plutot que des <br> qui reste betement ouvert. La référence légale : W3C , pas trés lisible et leur intégrisme enerve certain : W3C go home! .

Pour avoir des pages legères et séparer le contenu du look, il faut utiliser au maximum les feuilles de style, ça facilte aussi le changement de charte graphique. La bible (et ses tutoriaux) sont sur ce site de prosélytisme CCS : OpenWeb

DHTML

Même en s'amusant avec les CSS, il est possible d'avoir un site propre et compatible. Il faut donc titiller plus le navigateur : le DHTML est là pour ça. Le terme DHTML est un argument marketing, concrétement, c'est du HTML4, des feuilles de style, et du javascript qui, en travaillant sur le DOM(Document Object Model) , fait bouger tout ça. Il faut faire trés attention quand on commence à toucher au DHTML, les problèmes de compatibilités sont vite trés prise de tête. Le plus sage est de limiter leur usage et d'utiliser des bibliothèques où de gentilles personnes se sont fadé toute la partie compatibilitée. En plus des classiques MM_ de Dreamweaver, voici quelques projets bien finalisé, avec des fonctions utiles et facilement personnalisable.

  • webfx : Un ensemble de bibliotheque pour utiliser des widget classiques (boite à onglet, menu deroulant, arbre ...) et des trucs plus experimentaux.
  • Milonic : Ce site presente une seul chose, un menu déroulant, mais avec toutes les options imaginables, sous menu, icones ...
  • OverLib : Une palette flottante, avec moults options.

Ce n'est qu'un aperçu, le web est remplis de library de ce genre, mais il ne faut jamais oubliés que ça ne marche pas forcement, que ça risque de faire ramer la machine cliente et que les robots n'interprete pas le javascript.

HEADER

La face caché de la page web. Cette partie est trés utilisé par les moteurs de recherches qui y trouvent la description de la page, les mots clefs, la periodicitée de mise à jour ... Les meta-datas sont trés souple, pour organiser un peu ça, le projet Dublin Core Metadata Initiative propose une série de meta-données utilisable au dela du web (Adobe, par exemple, l'utilise dans son XMP pour ses produits de la série CS. En plus de ses informations serieuses et utile, il est aussi possible de donner des informations plus symboliques (voir fantaisiste) :

  • PICS est prévu pour aider les parents et les professeur à éviter aux gamins d'aller sur rotten ou sexe.com . Un rien utopique.
  • Creative common propose une licence pour les copyright sur le contenu de la page.
  • GeoURL localise géographiquement la page web, super pratique pour trouver des sites dans son quartier.
  • Links. En plus d'importer des éléments externes comme les feuilles de style ou l'icone, Links permet de faciliter la navigation à l'interieur du site.

Mozilla le gere depuis la version 0.9.5, il faut l'activer avec le menu View/ShowHide/Site Navigation Bar/Show Only As Needed . Une magnifique extension pour firefox : linkToolbar permet de l'utiliser de manière ergonomique, c'est assez magique. Par exemple : <link rel="search" href="/cherche.php" title="Recherche sur ce site" /> indique qu'un moteur de recherche est disponible sur ce site. Pour voir les autres possibilités, regardez la source de cette page.

Conclusion

Euh, il va falloir que je polisse ce site, il ne respecte pas tous ce que je viens de dire précédement.