Durant deux mois à travailler sur la forme et le contenu du nouvel AtelierBD paru hier (je vous en parle plus en détail demain, promi), j’ai ressenti le besoin grandissant de donner à l’Abdel-INN (annuaire bd en ligne, animation 2d, 3d, animation flash, …) un nouveau visage. Voilà le résultat de plusieurs soirs et week-ends de travail passionné.

J’ai commencé par concevoir une maquette sous Fireworks dans un format de 540 pixels de largeur, la dimension minimum des pires écrans actuels.

J’ai trouvé une bonne part de mon inspiration dans le design de 15 Megs of Fame (un très bon site de musique légale et gratuite, soit-dit-en-passant). J’ai également été influencé par les propos de JMG qui est admiratif devant l’épure ergonomique de certains sites actuels. Bien entendu mes expériences antérieures m’ont bien aidé, en particulier dans les choix typographiques.

J’ai découpé la maquette initiale et me suis attaqué à son transfert sous forme de feuille de style.

A cette période, j’ai reçu un message du papa d’un enfant atteint du syndrome de Stargardt (cause d’une déficience visuelle très grave) ; cela m’a poussé à chercher à rendre ce site bien plus accessible. Notament en le rendant totalement agrandissable (essayez d’augmenter la taille du texte dans votre navigateur). Pour cela, il m’a fallu abandonner le fond ombré des cartouches calibré au pixel près, pour rendre les zones vraiment maléables. D’où une combine entre une bordure « inset » en CSS, adoucie par un fond qui représente une ombre légère sur la gauche des cartouches. Tous les textes sont à base de polices courantes, afin de ne pas avoir à en faire des images (qui sont impossibles à agrandir/réduire à volonté).

D’un point de vue ergonomique, j’ai aussi essayé d’épurer au maximum à la fois les moyens graphiques et le schéma de navigation.