fastclemmy.com

L'effet de loupe joue sans doute un peu, mais une chose est sûre : on parle de plus en plus de l'accessibilité. Et quand je dis "on", je parle non pas de notre microcosme blogosphérique, mais bien d'un cercle plus élargi, celui des sites informatiques "grand public".

Cela tient sans doute au fait qu'un projet de loi sur "l'égalité des droits et des chances, la participation et la citoyenneté des personnes handicapées" est actuellement en discussion auprès de nos sénateurs et députés. On voit donc fleurir ici et là des articles sur le sujet, des interviews, des dossiers chez le Journal du Net, Zdnet ou encore Neteconomie.

Premier écueil, les intervenants généralement interrogés sur le sujet sont surtout là pour vendre leur solution propriétaire (ne comptez pas sur moi pour leur faire de la pub). Plus que l'accès pour tous à l'info, ce qui les intéresse c'est que le plus de clients possibles aient accès à leur produit ! On passe bien souvent sous silence qu'aucune rustine coûteuse n'est nécessaire pour rendre un site accessible. Un simple tour chez Accès pour tous devrait vous en convaincre.

Deuxième écueil, dissocier le concept d'accessibilité des autres concepts promus par les standards du web (conception par blocs, validité du code, sémantique) est à mon avis terriblement dangereux. Si il est clair que ces domaines sont bien distincts, ils participent tous d'une même philosophie prônant un meilleur web. D'ailleurs, faut-il rappeler qu'il faut oublier les handicapés quand on parle d'accessibilité ? On a tout à perdre à laisser s'installer une accessibilité-rustine (comprenez reposant sur des solutions propriétaires). C'est à nous de fournir l'effort pour réussir à imposer les standards dans toutes leurs dimensions, sans quoi le défi de l'accessibilité se transformera en défaite pour les standards.

#conceptionWeb

Redesigns en série

# 08-06-2004

Article original du 27.05.03 - Il doit y avoir quelque chose dans l'air du temps, des envies de changement, du temps libre à occuper. Toujours est-il que pas mal de blogs ont remis une couche de peinture fraîche.

Il y a quelques temps déjà c'est l'illustrissime Zeldman.com qui a flushé l'orange criard pour glisser vers un vert verdoyant. La dorénavant inévitable ombre portée (qui fera bientôt l'objet d'un prochain log) complète le tout agréablement.

Autre grande figure de la blogosphère anglophone, Dave Shea a aussi revu complètement son site Mezzoblue. De "blue" il ne reste finalement pas grand chose, si ce n'est le bandeau du haut, camouflant difficilement un grand sentiment de flottement général. Dommage, surtout quand on voit que Shea avait joliment créé son autre site personnel récemment.

Enfin, Doug Bowman a mis son StopDesign à poil. Comme Mezzoblue on serait tenté de resservir le fameux "c'était mieux avant". Hormis le logo finement travaillé, c'est très vide. Mais cela ne pourrait être que temporaire paraît-il. Ouf.

Redesign, redesign, voilà qui donne des envies... Et surtout une envie de disposer de plus de temps !

Mise à jour du 08.06.03 - En effet, le redesign de StopDesign n'était que temporaire ! Retour à un look beau beaucoup plus proche de l'original (pour ceux qui auraient déjà oublié, il ressemblait à s'y méprendre à cette copie). Pour ma part, je suis assez sceptique sur le concept des 3 colonnes de la page d'accueil, mais je pinaille...

Au fait, le fameux temps après lequel je courais plus haut, et bien il semblerait bien que j'ai fini par en trouver, résultat bientôt sur vos écrans si tout va bien.

#liens

La fin d'un projet sur lequel je travaille depuis quelques semaines déjà commence à approcher. Voici quelques retours d'expérience "de la vraie vie" que j'aimerais vous faire partager.

Note : penser à éventuellement mettre à jour ce log.

Organisation des fichiers

Visiblement, il n'y a pas encore de règle de l'art en la matière. Pour ma part, pour éviter les feuilles de style à rallonge, j'ai expérimenté une nouvelle fois avec succès que j'appellerais le "toutpareilsaufque".

Mettons d'abord de côté la feuille de style de la page d'accueil qui a souvent des spécificités très différentes du reste du site. Le coeur du système, c'est une feuille de style "commun.css" qui, comme son nom l'indique, regroupe les caractéristiques communes à toutes les pages (typo utilisée, effets sur les liens, disposition générale des grands blocs, etc.). Ensuite pour les pages où des propriétés ponctuelles sont nécessaires, je crée une feuille de style qui @import(commun.css) avant de les déclarer. Quels avantages ? Une séparation claire des fichiers, des feuilles de style individuellement raccourcies, une maintenance facilitée.

Ainsi, pour mettre en place une image illustrative indiquant la rubrique du site dans laquelle on se trouve on procèdera comme suit. On affecte un id du nom de la rubrique à la balise >body<. Dans la feuille de style "commun.css" on déclare les propriétés générales du bloc d'image (position, marges, etc.). Dans une feuille de style "nomDeLaRubrique.css" on précise simplement le nom de l'image en question. Et le tour est joué !

Positionnement : the simpler, the better

Assurément, la tâche la plus compliquée dans la conception par blocs reste le positionnement. Je peux maintenant dire d'expérience que l'on a tout avantage à garder la structure la plus simple possible. D'ailleurs si cette attention est portée dès la conception du design graphique du site, vous vous éviterez quelques désagréments par la suite.

Si le positionnement absolu peut paraître sexy avec son approche au pixel près et son comportement relativement homogène dans les navigateurs, quelques inconvénients font qu'il ne peut s'appliquer à tous les éléments d'un site :

  • il est peu compatible avec une mise en page liquide
  • il ne permet pas d'obtenir des pieds de page "mobiles"
  • il risque de créer des problèmes de chevauchement

De manière générale essayez donc de conserver au maximum le flux normal des éléments (empilement des boîtes) pour ne pas avoir de surprises désagréables avec les différents brouteurs.

Pensez aux nouvelles bonnes méthodes

Le concept des image-maps vous plaisait ? Ca tombe bien, il est encore possible d'en faire, mais avec la (bonne) manière. Pour cela, inspirez-vous de l'article d'ALA sur le sujet, mettez-le à votre sauce. Et le tour est joué ! Dans mon cas, j'ai utilisé une simple liste linéaire avec une image d'arrière-plan et des les éléments étaient des liens dans des >span< que j'ai caché via la propriété display:none.

Pas de tableaux mais...

Hérésie, j'ai utilisé des tableaux pour mettre en forme des formulaires ! Mais finalement, est-ce si impardonnable ?

#xhtmlCSS