J’utilise une instance Discourse pour gérer les projets clients depuis un certain temps et j’ai décidé de l’enrichir avec plus de contenu public, de partager des études de cas et des ressources. C’est encore en cours de développement (seulement stylisé pour le bureau, la plupart des sujets n’ont qu’un contenu minimal) mais j’ai l’impression de l’avoir regardé trop longtemps pour encore porter de bons jugements..
Ce serait formidable d’avoir quelques retours :
en général : Est-ce intuitif ? Est-ce que ce que je partage a du sens ? Pensez-vous que je devrais partager autre chose ou mettre en avant d’autres éléments ?
édition : j’ai réécrit ce composant pour résoudre les problèmes mentionnés sur le plan technique : Un composant de mise en page central que j’utilise est un flux modifié de barre latérale/en-tête. L’objectif est de n’afficher qu’une seule barre de navigation principale à la fois, soit l’en-tête, soit la barre latérale. Le composant brut se trouve sur Manuel Kostka / Discourse / Helpers / Sidebar Flow · GitLab et j’ai adopté deux approches pour construire le flux :
redéclarer l’en-tête au-dessus de la barre latérale comme transparent et attribuer une grille pour aligner le bouton de la barre latérale et le logo avec la largeur de la barre latérale
utiliser un hack de style pour étendre l’arrière-plan de la barre latérale (déclarer une drop-shadow sur toute la page, puis la limiter avec une clip-path)
J’ai choisi cette approche car jusqu’à présent, j’ai obtenu la plus belle animation en conservant les animations de glissement par défaut. Il s’agit donc simplement de la barre latérale qui glisse, son arrière-plan s’étend vers la gauche et vers l’en-tête, et l’en-tête transparent repose dessus.
Les inconvénients que je vois sont que la redéclaration de l’en-tête en tant que grille ne fonctionne pas bien avec d’autres composants qui s’affichent dans l’en-tête. Et je n’ai pas encore trouvé le moyen de faire fonctionner le hack clip-path sur Safari. Je serais donc curieux de savoir si certains des magiciens du CSS ici ont de meilleures idées !
Peut-être renommer ce bouton en « connexion client » ? Et j’envisagerais également de le déplacer dans l’en-tête. Actuellement, il occupe l’espace le plus visible de votre site, presque comme un appel à l’action principal.
L’ouverture du menu fait sauter toute la page, supprimant les deux éléments du haut. Cela semble un peu peu intuitif ?
L’ouverture du menu sur « à propos » et « sujets » supprime en fait tout le contenu :
J’avais aussi cette attente, bien qu’il soit devenu logique qu’il s’agisse d’un accès client dès que j’ai cliqué dessus.
Les autres commentaires de Bas sont également pertinents, mais d’une manière générale, j’aime cette mise en page et j’imagine que des ensembles particuliers d’utilisateurs et de cas d’utilisation la trouveraient très accueillante.
Oui, c’est en effet l’appel à l’action principal car la plateforme était entièrement destinée aux clients se connectant pour la gestion de projet. Je devrai peut-être repenser l’idée d’y ajouter une vitrine publique. Ou du moins comment organiser les deux aspects.
Elle est uniquement destinée à inclure les projets que j’ai mis en œuvre. Je suppose qu’il serait clair si je les reliais à un sujet d’étude de cas pour chacun.
C’est à la fois à cause du hack CSS avec clip-path que j’ai mentionné et qui ne fonctionne pas encore sur Safari.
Dans l’ensemble, c’est probablement encore trop expérimental pour être utilisé. Peut-être devrais-je d’abord essayer de travailler sur le flux de la barre latérale dans un thème dédié. C’est le principal défi d’implémentation que je veux résoudre ici après tout : construire une mise en page pleine largeur qui ne colle pas la barre latérale au bord gauche de la fenêtre, mais qui a un flux plus fluide.
