ZEP-04 : Nouvelle page d'accueil !

@regz: Effectivement ; merci, c'est fixé !

Quelques petites nouvelles de la part de Sandhose (qui n'a pas le temps de poster un message et qui m'a donc demandé de vous tenir au courant) !

Il a corrigé le tabindex suite à la remarque d'Alex-D (encore merci à toi d'ailleurs ). Il a stylisé le hover et le focus des items. Il a aussi adapté les Unes sur mobile. Concernant ces derniers, il en a laissé que trois sur mobile pour que les utilisateurs n'aient pas trop à scroller pour voir les tutoriels et les articles. Qu'en pensez-vous ?

La dernière version a l'air toujours disponible sur son serveur !

On attends vos retours avec impatience !

@Sandhose : J'ai bien résumé ?

Situphen a bien résumé mon travail de ce matin

Entre temps, j'ai lié le nombre de tutoriels du cadre bleu au vrai nombre de tutos, j'ai uniformisé les différentes listes d'articles et de tutoriels avec la home (ca rend plutôt bien !), et mis de vrais liens aux différents boutons. Aussi, Alex-D m'a rapidement fait des icônes pour les unes et les topics, qui changeront sûrement encore un peu ; c'est surtout pour se donner une idée

En parlant de ces liens, le lien Aider à développer la plateforme pointe vers le CONTRIBUTING.md du répo sur GitHub, et est configurable via le settings.py, et le liens En savoir plus sur mobile lorsqu'on est pas connecté mène vers la page À propos, qui… ne présente pas vraiment le site… Andr0 m'a suggéré de faire pointer vers l'article d'ouverture du site. Je sais pas ce que vous en pensez: faut-il modifier la page A propos pour vraiment présenter le site, ou juste faire pointer ce lien vers cet article ?

Vraiment sympa ! Une estimation du travail restant, du coup ?

C'est cool Sandhose; Pouras-tu juste tester des tutos/articles avec plusieurs auteurs (il me semble qu'on monte aujourd'hui à 4 max et qu'il y plusieurs tutos à 3 dont le mooc fablab qui risque d'être un des premiers à être mis en featured).

Une estimation du travail restant, du coup ?

Vu comme ça avance, je dirais fin de la semaine ? J'attends juste que jiyong me fournisse une version plus clean de Clem à la bonne résolution (je viens de le MP)

Pouras-tu juste tester des tutos/articles avec plusieurs auteurs

Je rappelle qu'il y a un accès staff sur l'instance sur mon serveur avec les identifiants admin/admin, et que vous pouvez tout à fait tester par vous-même ; Sinon, je prévois de mettre des ellipses (…) si y'a pas de place pour tout caser, et le texte complet au survol. Je ferais ça sûrement dans l'aprèm

Sinon, quelques update:

• Le fond du header a complètement changé ! Pour plusieurs raisons ; d'abord parce qu'il ne plaisait pas à tout le monde, car il était trop "à côté" du reste du site, ensuite parce que ça fait une image de 200Ko à charger en plus pour… pas grand chose… Du coup, ça a été remplacé par un dégradé circulaire, qu'est plus flat, et plus dans le style du reste du site. Dites moi ce que vous en pensez !
• Le style au hover des "Unes" a été revu, et le dégradé entre l'image et le texte a été accentué pour bien voir le texte, même sur fond blanc. Aussi, j'ai rajouté une preview live des unes lorsqu'on en crée ou édite une.
• J'ai viré les liens en double. Typiquement, y'avait par exemple 3 liens distinct pour un tuto: un sur l'image, un sur le titre, et un sur la description.
• J'ai stylisé correctement pas mal de choses au niveau du focus et du hover (Le bouton "Rédiger un tutoriel", la bulle des réactions des articles, les tags, …)
• J'en oublie sûrement ; pour suivre réellement ce qui a changé, suffit de voir les dernières commits

J'ai quand même plusieurs questions où j'aimerais avoir des réponses claires:

• Est-ce que le nouveau background du header vous convient ?
• Est-ce que le fait de masquer certaines la voir les deux dernière(s) Unes vous vas sur mobile ?
• Qu'est-ce que je mets comme lien pour le "En savoir plus" qui remplace les trois blocs de présentation sur mobile ? La page "À propos" ? Dans ce cas, faut-il la modifier pour qu'elle présente mieux le site ?
• Pareil pour le bouton "Aider à développer la plateforme", où est-ce qu'il doit pointer ?
• C'est le quel le plus minion ? Le chat d'Andr0 ou le mien ?

Voila voila, j'attends avec impatience vos remarques/retours !

Salut,

J'adore voir cette home page prendre forme ! Pour répondre à tes questions :

Est-ce que le nouveau background du header vous convient ?

Les arguments que tu as avancé me semble tout à fait pertinent. Je suis pour !

Est-ce que le fait de masquer certaines la voir les deux dernière(s) Unes vous vas sur mobile ?

Inutile de surcharger d'avantage les pages sur mobile, je suis pour !

Qu'est-ce que je mets comme lien pour le "En savoir plus" qui remplace les trois blocs de présentation sur mobile ? La page "À propos" ? Dans ce cas, faut-il la modifier pour qu'elle présente mieux le site ?

Pour moi, l'article d'ouverture de Zeste de Savoir qui est déjà utilisé dans les communiqués de presse de Zeste de Savoir si je ne dis pas de bêtise (c'est le cas dans le mail vers Gandhi en tout cas).

Pareil pour le bouton "Aider à développer la plateforme", où est-ce qu'il doit pointer ?

Vers le projet GitHub.

C'est le quel le plus minion ? Le chat d'Andr0 ou le mien ?

Ton chat n'a tellement aucune chance mon pauvre !

Je préfère celui-là

Désolé mais là c'est le mien. na.

J'aime tout, sauf que le texte des Unes bouge au survol. C'est vraiment le genre de comportement que je trouve dommageable en règle général (bon, là, heureusement, ça ne gène pas le clic x)).

Sur Chrome Mac OS, a priori je ne vois pas le dégradé sur l'accueil.

Moi non plus je n'ai pas de dégradé, juste un fond de couleur bleu ! (J'utilise Firefox 37.)

Je ne peux que plussoyer. AMHA, le texte devrait rester à sa place, le flou devrait est moins fort et la taille au survol plus petite !

J'ai eu du mal moi aussi à le voir. Pour voir le contraste entre dégradé et non dégradé :

1. F12 ;
2. Vas à l'élément correspondant (<section class="home-header">) ;

1
2
3
4

/* remplace */
background: radial-gradient(at top,rgba(255,255,255,.1),transparent 60%) #19516b;
/* par */
background: #19516b;

Personnellement le hover sur les Unes ne me gène aucunement. Comme tu le relève lethom, il ne gène aucunement le clic alors bon.

-> Fichier source : "Elle, c'est Clem" en PNG

Moi, je n'ai qu'une chose à dire : "oui" !

Juste un détail, que je glisse parce que je m'étais déjà fait la remarque sur le logo actuel : je pense qu'il serait bien de rajouter une pointe à la flèche, parce que là, on dirait la queue d'un phylactère. On a donc l'impression que c'est Clem qui parle d'elle-même à la troisième personne, façon Jules.

ah j'ai trouvé un bug : .

Les chiffres des bulles passent au-dessus du menu.

Est-ce que le nouveau background du header vous convient ?

C'est vraiment mieux maintenant.

Est-ce que le fait de masquer certaines la voir les deux dernière(s) Unes vous vas sur mobile ? Oui, c'est un bon compromis

Qu'est-ce que je mets comme lien pour le "En savoir plus" qui remplace les trois blocs de présentation sur mobile ? La page "À propos" ? Dans ce cas, faut-il la modifier pour qu'elle présente mieux le site ?

Je pense que dans un premier temps, on peut rediriger vers l'article qui présente le site et puis dans un deuxième temps, modifier la page à propos.

Pareil pour le bouton "Aider à développer la plateforme", où est-ce qu'il doit pointer ?

La page GitHub

C'est le quel le plus minion ? Le chat d'Andr0 ou le mien ?

Je ne participe pas aux guerres de religions

Mais sinon, c'est vraiment bien !

@Hugo : C'est corrigé, merci !

@Sandhose :

• Tu peux mettre à jour ton serveur pour que la correction soit visible ? Merci
• Peux-tu changer la couleur du bouton de la barre de recherche au survol ? Gris, c'est pas énorme je trouve

Merci Sandh0se pour avoir enlevé le dégradé que je trouvais complètement décalé. La page a maintenant une plus grande classe ainsi … continuez sur cette voie.

Cette page devient vraiment classe. Est-ce que vous savez nous dire ce qu'il reste à faire ? Parce que visuellement, nous semblons y être mais vous avez peut-être des détails à faire encore ?

Sur mobile, quand on est pas connecté, au lieu de mettre uniquement le liens "en savoir plus", on pourrait pas faire apparaitre, au clic, le meme texte que la version desktop en déroulant ? Sinon j'aime beaucoup