Bourez.net V13

Soumis par Denis le ven 16/10/2015 à 11:24

Depuis la migration sous Plone en 2010, en passant par celle sous Drupal en 2012, la structure du site n'avait pas franchement évolué, reposant sur une largeur fixe et une entête intégrant un menu horizontal. Cet automne voit l'arrivée de "Crystal Lake", la V13 de bourez.net, qui marque une rupture franche avec cette présentation avec l'adoption de trois nouveautés qui modifient pas mal la présentation :

  • la navigation n'est plus en haut de page mais dans une colonne à gauche ;
  • la largeur n'est plus fixe, le site s'adapte à la fenêtre du navigateur ;
  • l'ensemble est "responsive" et s'adapte aux écrans des appareils mobiles.

Sur un écran classique de PC ou Mac, on pourrait résumer par "c'est plus large, c'est plus gros". Mine de rien, il m'a fallu retravailler pas mal d'éléments, à commencer par la présentation des vues Drupal affichant des photos. La plupart des vues utilisant une structure de type "grille", basée sur des tables, ont été adaptées à des structures libres, la taille des images étant adaptée par leur propriété CSS.

Sur smartphone, les colonnes sont désormais disposées les unes en dessous des autres. De même, le menu principal passe en mode "accordéon". La mécanique est en place, elle fonctionne, mais je vais poursuivre le chantier dans les prochains jours pour améliorer la présentation et la lisibilité de certains éléments.