Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refonte de la page “À propos” : vraie description, Gandi & Café des Sciences, mises à jour, vraie mise en page #6527

Open
wants to merge 26 commits into
base: dev
Choose a base branch
from

Conversation

AmauryCarrade
Copy link
Member

@AmauryCarrade AmauryCarrade commented Sep 12, 2023

Suite à un mail de rappel de Gandi que nous avions demandé leur logo pour l'intégrer sur notre page À propos (ils ne nous forcent pas, mais étaient étonnés que nous ne l'ayons pas fait alors que nous avions demandé de pouvoir le faire), j'ai voulu intégrer leur logo, donc.

Bon, ça a un peu dérapé (qui est surpris).

À voir la page, je me suis rappelé de la principale critique que je lui ai toujours fait, sans jamais prendre le temps de le corriger : ce n'est pas une page À propos, au mieux un Colophon. Et j'aime beaucoup les colophons, y'a pas de souci, mais ce n'est pas ce qu'est attendu ici.

J'ai donc entreprit d'ajouter une vraie description. D'ajouter Gandi, et le Café des Sciences tant qu'on y est (il y a un logo prévu pour ça). Et puis ça manquait de certaines mentions légales. Et la liste des technologies n'était pas à jour. Et tout ça manquait un peu de style.

J'ai repris la description de multiples présentations (notamment celle au CNRS) et documents sur lesquels j'avais dû expliquer ce qu'est Zeste de Savoir.

Concernant la liste des technologies, la question se pose fatalement : que mettre, que ne pas mettre, tout mettre étant bien long ? J'ai fait un choix subjectif des technologies qui ont un usage/impact notable sur la plateforme, pour qu'on ait une vraie idée des outils utilisés pour construire Zeste de Savoir. J'ai également fusionné les deux listes, la séparation n'étant pas vraiment pertinente.

Cliquez ici pour obtenir un aperçu de la nouvelle page À propos (à jour).

Questions à résoudre avant la QA

  • Concernant les mentions légales, j'ai hésité. Il y a déjà des mentions légales dans les CGU (article 2) mais elles sont incomplètes. Il faut donc faire un choix :

    • déplacer les mentions légales hors des CGU (ce qui est assez classique) ; ou
    • remplacer les mentions légales de la page À propos par un lien vers les mentions légales des CGU, et compléter les mentions légales dans les CGU (car il manque la ville de domiciliation de l'association, et le ou la responsable de la publication — qui n'est pas l'association elle-même mais son ou sa représentante légale, i.e. son ou sa présidente).
  • Secondement, l'adresse de l'association affichée est fausse (cf. commentaires plus bas). Faut-il mettre la bonne (association@) directement dans le fichier de paramètres de base (zds/settings/abstract_base/zds.py), ou uniquement dans le fichier de production comme aujourd'hui ?

    Question subsidiaire, cette distinction a-t-elle le moindre intérêt ?
    Question sub-subsidiaire, est-ce hors-scope de cette PR ?

Contrôle qualité

  • Lancez make build-front && make run-back pour mettre à jour les styles et lancer le site ;
  • Rendez-vous sur la page À propos et constatez que :
    • le contenu est exact ;
    • il n'y a pas de fautes ;
    • les éléments montrés sont cohérents ;
    • la page est visuellement propre, les styles ne sont pas cassés (sur écran large comme sur téléphone).

Avant de fusionner

Je ferai une dernière passe typographique avant de fusionner, ne le faites pas immédiatement (toutes les apostrophes sont droites, là, notamment). Je le ferai à la fin au cas où des éléments doivent être ajoutés, afin de ne pas le faire vingt fois.

@AmauryCarrade AmauryCarrade added C-Front Concerne l'interface du site S-Refactorisation Améliore le code existant sans forcément ajouter de nouvelle fonctionnalité labels Sep 12, 2023
@coveralls
Copy link

coveralls commented Sep 12, 2023

Coverage Status

coverage: 88.818% (-0.004%) from 88.822%
when pulling 943d507 on AmauryCarrade:feat/à-propos-na-pas-changé-depuis-2015-ça-va-bien-cinq-minutes
into e1f9d0f on zestedesavoir:dev.

@jeanlapostolle
Copy link
Contributor

J'aime beaucoup cette nouvelle page.

Petite coquille sur l'adresse mail dans les références légales et attributions qui est l'adresse gmail alors que ça devrait être "association@zestedesavoir.com"

@AmauryCarrade
Copy link
Member Author

AmauryCarrade commented Sep 12, 2023

Merci ! Et bien vu.

À noter que le problème existe en production car j'ai sourcé cette adresse depuis le même endroit que d'autres pages que je n'arrive à retrouver, à savoir, le ficher de configuration du site.

"association": {
"name": "Zeste de Savoir",
"email": "zestedesavoir@gmail.com",
"email_ca": "ca-zeste-de-savoir@googlegroups.com",
"forum_ca_pk": 25,
"subscribe_link": zds_config.get("association_subscribe_link", DEFAULT_ASSO_LINK),
},

D'ailleurs, cette adresse est dupliquée dans la configuration, faudrait vérifier que tout est bien utilisé.

Il faudrait aussi vérifier si cette adresse du CA est affichée quelque part, car je ne crois pas qu'elle soit utilisée en pratique (en tout cas à titre personnel je ne la monitore pas, je ne suis même pas sûr d'avoir accès).

@AmauryCarrade
Copy link
Member Author

Ah, c'était la page des CGU. Mais en fait le souci n’apparaît pas en prod, ou presque, en tout cas c'est pas la même adresse que ce que j'ai en local. Mais c'est communication@, alors qu'il faudrait plutôt association@. Elle est modifiée dans le fichier de configuration de production (pourquoi ? pourquoi ne pas le mettre directement bon à la source ?).

ZDS_APP["site"]["association"]["email"] = "communication@zestedesavoir.com"

@AmauryCarrade AmauryCarrade marked this pull request as ready for review September 12, 2023 15:54
@AmauryCarrade AmauryCarrade changed the title Refonte de la page “À propos” : vraie description, Gandi & Café des Sciences, mises à jour Refonte de la page “À propos” : vraie description, Gandi & Café des Sciences, mises à jour, vraie mise en page Sep 12, 2023
@Situphen
Copy link
Member

Situphen commented Sep 12, 2023

Premièrement beau travail, le rendu est super !

Concernant les mentions légales, je pense qu'il faut suivre ce que font globalement tous les autres sites, c'est-à-dire les mettre dans une page à part des CGU avec un lien direct dans le footer.

Concernant l'adresse de l'association, ce n'est pas privé donc on peut simplement faire le changement dans le code de ZDS. Ceci dit, c'est le genre de paramètres qui selon moi ont toute leur place dans la configuration d'Ansible car cela permet de les modifier sans devoir publier une nouvelle version de ZDS.

J'ai parcouru très vite fait les modifications :

  1. J'ai vu un commentaire en français dans le code SASS, est-ce volontaire ? Il me semble qu'actuellement la règle est de commenter le code en anglais, mais on pourrait décider d'autoriser le français dans les commentaires étant donné le peu de contributions anglophones dans l'histoire de ZDS. Peu m'importe personnellement.
  2. Tu as ajouté du code en SASS alors que tout le reste est en SCSS. Idem que le point précédent, est-ce qu'on souhaite autoriser le mélange des deux formats ? De manière idéaliste je préférerais un seul format mais j'imagine que tu dois préférer coder en SASS et tu es un des seuls contributeurs front, si ce n'est le seul, donc je ne m'y oppose pas.

Je ne sais pas si @philippemilink a un avis sur ces deux points. Mon objectif n'est pas de freiner cette PR mais surtout d'éviter un flou dans nos conventions/règles pour les prochaines PR.

@AmauryCarrade
Copy link
Member Author

AmauryCarrade commented Sep 12, 2023

Merci @Situphen !

Concernant les mentions légales, je pense qu'il faut suivre ce que font globalement tous les autres sites, c'est-à-dire les mettre dans une page à part des CGU avec un lien direct dans le footer.

Tu ferais une page supplémentaire ? Tu penses que, supposant qu'on fasse effectivement comme à l'accoutumée ailleurs et qu'on les sépare des CGU, les mettre dans la page À propos n'est pas suffisant ? Ou bien j'ai mal compris et tu parlais justement de la-dite page ?

Ceci dit, c'est le genre de paramètres qui selon moi ont toute leur place dans la configuration d'Ansible car cela permet de les modifier sans devoir publier une nouvelle version de ZDS.

Peut-être faudrait-il prévoir cette modification, alors ! Bien que ce ne soit pas très urgent. D'ici là, je peux modifier dans le dépôt, dans cette PR, si ça vous va.

J'ai vu un commentaire en français dans le code SASS, est-ce volontaire ? Il me semble qu'actuellement la règle est de commenter le code en anglais, mais on pourrait décider d'autoriser le français dans les commentaires étant donné le peu de contributions anglophones dans l'histoire de ZDS. Peu m'importe personnellement.

Je plaide la mauvaise mémoire, j'avais souvenir qu'on avait le code en anglais mais les commentaires, documentations, commits et tickets/PR en français. Je vais traduire :) .

Tu as ajouté du code en SASS alors que tout le reste est en SCSS. Idem que le point précédent, est-ce qu'on souhaite autoriser le mélange des deux formats ? De manière idéaliste je préférerais un seul format mais j'imagine que tu dois préférer coder en SASS et tu es un des seuls contributeurs front, si ce n'est le seul, donc je ne m'y oppose pas.

Clairement, mon confort de travail en Sass est bien supérieur à celui en SCSS. Je me suis permis de l'utiliser, car :

  • Sass et SCSS sont conçus pour être mélangeables dans une même base de code ;
  • Sass est très simple à comprendre si on connaît SCSS — à l'exception de la syntaxe courte pour les mixins (+mobile), que je peux m'efforcer de ne pas utiliser si cela vous semble être un compromis acceptable ;
  • par extension, Sass est simple à écrire une fois qu'on a pigé le principe (pas de points-virgule et de l’indentation pour les niveaux — comme en Python, en fait !) ;
  • enfin, Sass est, je trouve, plus lisible (code plus aéré, forcément bien indenté…).

Sass, c'est limite SCSS et Python qui ont fait un petit 🙃

Bref, je préfèrerais qu'on s'autorise à mélanger Sass et SCSS, vu ce qu'apporte Sass et la presque absence d'inconvénients que ce mélange a. D'ailleurs, pour ne rien vous cacher, j'avais prévu d'écrire Yuzu en Sass exclusivement.

@AmauryCarrade
Copy link
Member Author

AmauryCarrade commented Sep 12, 2023

Je me suis laissé emporter par les commentaires. Bon, ils sont en anglais :d

@qwertygc
Copy link
Contributor

@AmauryCarrade
Copy link
Member Author

Ah oui bien vu, il y a sans doutes des choses à reprendre :)

@Arnaud-D
Copy link
Contributor

Arnaud-D commented Sep 29, 2023

Petit commentaire sur le contenu :

  • La page "À propos" que tu es en train de faire devrait intégrer la page "Association" (peu importe le nom), cette dernière disparaissant alors.
  • On a choisi de renommer le "À propos" en "Crédits techniques" (voir Renomme la page "À propos" en "Crédits techniques" #6515) sans en changer le contenu. Il faudra gérer ça au rebase. Je pense qu'il faut garder cette page séparée. Et pas besoin d'en faire des caisses non plus, parce que le dépôt est aussi là pour ça ; en l'état je trouve que c'est trop.

En résumé : d'un côté une page "à propos" avec tes nouvelles infos et celles de la page "association" (description de l'asso et du site) et d'un autre côté un colophon. Ça mérite d'être séparé selon moi.

Sinon, je pense aussi qu'il faudrait une page "mentions légales" dédiée avec lien direct dans le pied de page.

Sympa le rendu graphique sinon. :)

@AmauryCarrade
Copy link
Member Author

AmauryCarrade commented Sep 29, 2023

La page "À propos" que tu es en train de faire devrait intégrer la page "Association" (peu importe le nom), cette dernière disparaissant alors.

Plus j'y pense, plus je pense également que ce serait une bonne idée, et c'était dans mes projets. Je réfléchissais juste comment l'intégrer (tant éditorialement que graphiquement). Pour l'édito, le texte cité par @qwertygc est une base intéressante. De manière plus générale, je suis ouvert à toutes les idées !

On a choisi de renommer le "À propos" en "Crédits techniques" (voir #6515) sans en changer le contenu. Il faudra gérer ça au rebase. Je pense qu'il faut garder cette page séparée.

Je n'avais pas vu cette PR, mais en effet, ce n'est pas une mauvaise idée. Je suis assez neutre quant au fait de séparer ou non, et je comprends les arguments pour séparer, moi ça me va bien. Est-ce que tu sais à quel point la PR #6515 est sur le point d'être fusionnée ? Sinon, je peux la reprendre directement dans cette PR, ça pourrait peut-être être plus simple.

Et pass besoin d'en faire des caisses non plus, parce que le dépôt est aussi là pour ça ; en l'état je trouve que c'est trop.

Je ne suis pas trop d'accord : j'ai pas mal limité pour que ça reste une vue d'ensemble, mais je trouve que c'est intéressant de mettre l'important dans un peu toutes les catégories. J'y vois un but pédagogique, étant donné que le site enseigne (notamment) l'informatique, montrer tout ce qu'on finit par utiliser pour faire une plateforme web un peu complexe est intéressant, je trouve.

J'aurais bien plus compris l'envie de diminuer si c'était resté en page unique, pour être honnête, car il est vrai qu'en l'état, ça prend pas mal de place. Mais sur une page dédiée… je ne vois pas le souci (sinon celui de la maintenance, mais j'ai volontairement choisi des technologies qu'on utilise de façon stable : la seule qu'il faudra changer à court ou moyen terme, sauf grosse surprise, c'est ElasticSearch).

Cela dit, je reste bien évidemment ouvert à la discussion — qu'est-ce que tu trouves superflu ?

Sympa le rendu graphique sinon. :)

Merci !

@Arnaud-D
Copy link
Contributor

Est-ce que tu sais à quel point la PR #6515 est sur le point d'être fusionnée ?

À deux doigts d'être fusionnée, vraiment. Il reste la QA à faire (que tu peux faire si tu veux !), mais c'est juste pour vérifier la prise en compte de commenaires purement techniques.

Pour moi, elle doit être fusionnée séparément. Ça sera toujours des choses à vérifier en moins dans la présente PR.

Cela dit, je reste bien évidemment ouvert à la discussion — qu'est-ce que tu trouves superflu ?

C'est plus que je trouve le concept de lister beaucoup de choses un peu overkill, pas spécialement des choses spécifiques.

Mais ça m'est un peu égal que ça soit long, ça ne me dérange pas.

Par contre, et c'est important pour la maintenance : ne pas citer de version spécifiques (à part Python peut-être), parce qu'elles changent régulièrement et on n'a pas envie d'avoir une page obsolète. Par exemple, Django 3, dans quelques mois, ça ne sera plus vrai et on oubliera de changer la page. :-°

@AmauryCarrade
Copy link
Member Author

À deux doigts d'être fusionnée, vraiment. Il reste la QA à faire (que tu peux faire si tu veux !), mais c'est juste pour vérifier la prise en compte de commenaires purement techniques.

Je ne garantie pas d'avoir le temps mais je vais voir, peut-être :) Et sinon ok !

Pour moi, elle doit être fusionnée séparément. Ça sera toujours des choses à vérifier en moins dans la présente PR.

Fair. Le rebase risque juste d'être un peu pénible (fichier renommé mais en fait il ne faut pas qu'il le soit, etc.), cela dit, rien d'insurmontable.

Par contre, et c'est important pour la maintenance : ne pas citer de version spécifiques (à part Python peut-être), parce qu'elles changent régulièrement et on n'a pas envie d'avoir une page obsolète. Par exemple, Django 3, dans quelques mois, ça ne sera plus vrai et on oubliera de changer la page. :-°

Sur ce point précis, si ça peut te rassurer, les premiers concepteurs de cette page ont prévu le coup :

def about(request):
"""Display many informations about the website."""
return render(
request,
"pages/about.html",
{
"default_repository_url": get_repository_url(
settings.ZDS_APP["github_projects"]["default_repository"], "base_url"
),
"django_major_version": django.VERSION[0],
"python_major_version": sys.version_info.major,
},
)

Il n'y a que jQuery qui pourrait perdre sa précision de version — d'ailleurs j'ai vu que ça a été fait dans la PR que tu citais. De toute façon, c'est pas comme si on était en train de s'en débarrasser petit à petit.

@philippemilink
Copy link
Member

Après en avoir discuté en réunion des dev's, voici les points qui ont été décidés :

Après discussion, on a besoin des pages suivantes :

  • "L’association" : présentation de l’association (comme décidé lors de la dernière AG) et lien d’adhésion
  • "Technologies" : présentation des technologies utilisées et lien vers la documentation de l’API
  • "Mentions légales" : mentions légales, CGU, cookies, licences

On supprime du pied de page les liens "API", "Cookies" et "Adhérer à l’association".

Concernant la page décrivant les technologies utilisées, on souhaite mettre du détail, puisque ça peut intéresser les visiteurs et visiteuses qui consultent après tout un site de cours (à majorité informatique). Par rapport à ce qui est proposé dans la PR, on ajoute plus de texte, pour expliquer le rôle des différentes technologies, pourquoi on en a besoin. On peut également dire qu’on accueille les développeurs débutant et mettre un lien vers les tickets faciles.

Amaury a besoin d’aide pour ce qu’il y a à mettre dans la page qui présente l’association. Ces éléments peuvent venir du rapport d’activité (dont il faudra mettre le lien sur cette page).

@qwertygc
Copy link
Contributor

qwertygc commented Apr 6, 2024

Du coup, ce qu'on doit faire :

@Situphen Situphen force-pushed the feat/à-propos-na-pas-changé-depuis-2015-ça-va-bien-cinq-minutes branch from a541b40 to 566d43d Compare May 21, 2024 20:56
@Situphen
Copy link
Member

J'ai rebasé la branche et je l'ai mise sur la bêta, sans modification pour le moment.

J'étais parti pour juste insérer le logo Gandi, mais ça a dérapé. Oups.

- Restructuration de la page
- Ajout d'une vraie explication de ce qu'est Zeste de Savoir.
- Ajout de Gandi.
- Ajout du Café des Sciences.
- Remise en forme de la section présentant les technologies utilisées.
- Remise en forme de la section légale.
- Ajout des mentions légales classiques sur la page à propos, à côté
  des autres.
- Doublon avec les CGU ? Mais idéalement, il faudrait au moins un
  report vers ces dernières, et les compléter, car il manque des
  informations — notamment, le siège social de l'association et son
  responsable de la publication. Un choix à faire.
À terme, ces deux pages pourraient fusionner.
AmauryCarrade and others added 16 commits June 24, 2024 10:46
- Retour au serif (retiré par erreur suite à une refactorisation)
- Ajustement de marges
- Titres et sous-titres des blocs colorés plus petits sur mobile.
Ouais, c'était *à ce point* pas à jour.
Il fallait l'ajouter à la liste des éléments avec sélection inversée.
Et intégre mieux sa construction au pipeline Gulp.
- Inutile de répéter les sélecteurs, on fait du SCSS, on peut imbriquer.
- Correction du style de code d'après les règles editorconfig : indentation avec deux espaces.
- On ne s'appuie plus sur des espaces dans le contenu, mais sur une marge à la
  taille relative à la largeur d'une lettre de la police courante.
- Les compteurs sont réinitialisés en une ligne (plus clair, inutile de
  s’embêter).
- Les numérotations sont à peine plus claires.
- J'ai tenté aussi de retirer la graisse. Je ne sais que choisir.
@AmauryCarrade AmauryCarrade force-pushed the feat/à-propos-na-pas-changé-depuis-2015-ça-va-bien-cinq-minutes branch from 566d43d to aabf5bf Compare June 24, 2024 08:53
- Division de la page en deux : une partie pour les
  technologies (un colophon), et une pour un vrai
  “à propos” et pour l’association.
- Rédaction de la page “technologies”.
@AmauryCarrade
Copy link
Member Author

Bon ; j'ai commencé la reprise de cette PR. Pour le moment, la page des technologies me semble correcte. Il me reste à intégrer la page “à propos”, que je vais fusionner avec la page “Association” — à moins que quelqu’un n’y voit un problème !

@Arnaud-D
Copy link
Contributor

J'ai regardé et j'ai trouvé ça bien ! Pas de problèmes avec la fusion des deux pages, j'avais proposé ça auparavant et ça me paraît toujours une bonne logique. :)

@AmauryCarrade
Copy link
Member Author

Il faudrait ajouter un lien vers le code de conduite dans la page à propos.

@Situphen
Copy link
Member

Bonsoir,
Quelqu'un peut-il récapituler où nous en sommes ici ?

@AmauryCarrade
Copy link
Member Author

@Situphen Le message du 24 juin est toujours d’actualité, n’ayant pas pu avancer depuis.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
C-Front Concerne l'interface du site S-Refactorisation Améliore le code existant sans forcément ajouter de nouvelle fonctionnalité
Projects
Status: Modification demandée
Development

Successfully merging this pull request may close these issues.

7 participants