Squelettes framasoft (1) page d'accueil

Après quelques mois de latence, nous voilà replongés dans la réécriture des squelettes du site Framasoft, et plus particulièrement dans celle de la page d'accueil.

Je l'avoue, le projet est dans les cartons de l'association depuis… janvier 2005. Pfuiii ! Malgré une première phase où les choses ont rapidement avancées, par deux fois cette entreprise de refonte a été reléguée au second plan ; j'avais tout simplement sous-estimé le temps nécessaire à un travail d'une telle envergure. Aujourd'hui, alors que je dispose d'une dizaine de jours plutôt calmes et de l'aide précieuse du collègue Pyg, nouveau secrétaire de l'association, nous reprenons doucement mais sûrement le travail en commençant par la page d'accueil du site.

La structure du code étant déjà remaniée (pour faire simple : remplacer les tableaux et la surabondance de blocs conteneurs génériques), Pyg a eu l'idée de faciliter la lecture de la page en permettant d'afficher et/ou de masquer les différents blocs la constituant. J'ai pris exemple sur le modèle qu'il a rapidement élaboré pour intégrer cette fonctionnalité grâce à des fonctions javascript utilisées sur ce site et légèrement remaniées, celle générant des popups et celle gérant le plier/déplier d'un arbre hiérarchique entre autres. A cela s'ajoutera un cookie qui permettra d'enregistrer le choix des internautes sur les modules à garder plier et ceux à afficher dépliés.

On peut illustrer cela avec la présentation de l'annuaire de logiciels libres, qui peut se décliner de trois manières différentes :

Capture d'écran

Affichage de l'annuaire des logiciels libres au chargement de la page d'accueil.

Capture d'écran

Un clic sur la flèche de l'une des sous-rubrique de l'annuaire plie/déplie son arborescence.

Capture d'écran

Un clic sur la flèche accompagnant le titre de l'annuaire plie/déplie l'ensemble de l'arborescence.

L'internaute pourra choisir entre l'affichage plié (image 1) et l'affichage déplié (image 3) pour l'enregistrer dans un cookie et ainsi retrouver ses préférencs de présentation à sa prochaine visite (si le cookie est conservé, bien-sur).

Capture d'écran

Case à cocher pour enregistrer les choix d'affichage dans un cookie.

Comme toujours, et c'est un leitmotiv que je ne cesse de répéter ici, le javascript est utilisé comme une « surcouche fonctionnelle » : il peut améliorer la consultation d'un document, la rendre plus agréable, mais la diffusion de l'information ne doit pas en dépendre. Entre d'autres termes, si la gestion du javascript est désactivée dans le navigateur, la nouvelle page d'accueil de Framasoft ne sera pas très différente de la précédente, en tout cas dans son contenu.

Nous espérons mettre en place cette nouvelle page d'accueil à la rentrée. La refonte des autres pages du site Framasoft se fera ensuite progressivement.