Lecture/Web/Améliorations du bureau/Fonctionnalités/Entête fixe
Dans le cadre du Projet d'améliorations bureau, nous introduisons une nouvelle manière d'afficher les outils les plus fréquemment utilisés qui auparavant se trouvaient en haut de la page. La nouvelle fonctionnalité permettra d'accéder à ces outils tout au long de la page via un entête « fixe » ou « figé ». Notre objectif est de faciliter l'accès des lecteurs et des contributeurs à ces outils. Nous nous rendons compte que, aujourd'hui, ils doivent souvent faire défiler la page au complet jusqu'à monter en haut.
Contexte et objectifs
Actuellement, de nombreuses fonctionnalités des pages wiki ne sont accessibles aux utilisateurs que situées en haut de la page, et/ou sur le panneau à gauche de la page. Cela devient problématique sur les pages plus longues, lorsque le défilement des premiers paragraphes oblige l'utilisateur à remonter pour accéder à nouveau aux outils et autres ressources. La méthode que nous proposons pour résoudre ce problème consiste à rendre l'entête du site « figé ». Cela signifie qu'il reste fixé tout en haut de l'écran (au-dessus du contenu) lorsque vous faites défiler la page vers le haut ou vers le bas.
En outre, nous offrons actuellement très peu d'orientation dans la page à nos lecteurs et contributeurs. Cela fait que distinguer entre une page et une autre devient compliqué.
Notre but :
- Donner en même temps la fonctionnalité et le contexte tout au long de la page.
- Réduire le temps que les lecteurs et les contributeurs passent à faire défiler la page vers le haut ou vers le bas pour des raisons de navigation.
Cas d'utilisation
- En tant que lecteur, je veux savoir à tout moment quel article je suis en train de lire, afin de pouvoir m'orienter facilement sur le site.
- En tant que contributeur, je veux pouvoir accéder à des fonctionnalités importantes (p.ex. éditer, aller dans l'historique ou dans la page de discussion de l'article) à partir de n'importe quel endroit de la page, sans perdre du temps en faisant défiler la page vers le haut.
- En tant que lecteur multilingue, je veux pouvoir changer de langue à tout moment de ma lecture, de sorte que je puisse passer directement à l'autre après avoir trouvé un mot ou une phrase qui prête à confusion.
Description et prérequis de la fonctionnalité
Un entête fixe/figé apparaitra en haut de la page lorsque l'utilisateur aura dépassé l'entête actuel de la page.
- Pour les utilisateurs anonymes, l'entête contiendra les éléments suivants :
- Logo du wiki
- Barre de recherche
- Nom de la page
- Titre de section
- Pour les utilisateurs connectés, l'entête contiendra les éléments suivants :
- Logo du wiki
- Menu utilisateur (voir la page dédiée)
- Barre de recherche
- Nom de la page
- Titre de section
- Lien vers la page de discussion
- Lien vers l'historique de la page
- Lien vers l'édition du wikicode et/ou via l'éditeur visuel (selon les préférences des wikis eux-mêmes)
- Sélecteur de langue
Le comportement de défilement de l'entête doit s'adapter aux besoins des utilisateurs connectés.
- Note : nous sommes en train de tester plusieurs comportements de défilement et de déclenchement, notamment en permettant à l'entête d'apparaître lors du défilement de la page et du changement d'onglet. Nous allons tester aussi l'affichage de l'entête en permanence
L'entête doit pouvoir s'adapter aux résolutions d'écran faibles (inférieures à 500px)
Exigences de design et recommandations
Prototype
https://people.wikimedia.org/~jdrewniak/dip/p4.html#/en/wiki/Moon
Utilisateurs anonymes
Note: for the first iteration of the sticky header, the header will only be available for logged-in users
Utilisateurs connectés
Tests qualitatifs
Tests utilisateur
Nous avons effectué des tests utilisateur de l'entête fixe avec des lecteurs et des contributeurs de trois endroits et langues différentes, afin de déterminer quelle fonctionnalité devrait être incluse dans l'entête fixe en priorité. For the first iteration of the sticky header, we will be removing triggering behavior and making the sticky header persistent as per request of a number of the editors involved in the user testing. We will then evaluate the change once live. Nous avons également testé l'utilisabilité de notre prototype actuel.
Les résultats du test ont été utilisés pour déterminer les liens disponibles dans l'en-tête ainsi que le comportement de déclenchement et de persistance de l'en-tête. Voir les résultats complets de ce test.
Test du prototype
En mai 2021, nous effectuons des tests de prototype avec des utilisateurs connectés à travers 30 wikis. Le test a été conçu pour recueillir des commentaires sur l'utilisabilité et le fonctionnement de l'entête figé et du menu utilisateur.
Nos résultats préliminaires montrent qu'une écrasante majorité des participants au test ont fait une expérience positive avec un entête fixe. Notamment, les participants ont mentionné qu'ils appréciaient la possibilité d'accéder à des fonctionnalités importantes à partir de n'importe quel endroit de la page.
Cependant, une large partie des participants (~20%) a indiqué des problèmes avec l'apparence de l'entête fixe lui-même. La majorité de ces participants souhaitent que l'entête apparaisse en haut de la page en permanence plutôt que par divers déclenchements. Certains participants ont indiqué que, même s'ils appréciaient l'apparence de l'entête déclenché, ils avaient rencontré des problèmes avec l'entête qui apparaissait/disparaissait trop rapidement.
Dans les prochaines étapes, nous examinerons les déclencheurs qui permettent à l'entête d'apparaître et de disparaître. Nous prévoyons également de poursuivre l'expérimentation de l'entête figé qui apparaît de manière persistante sur la page. Ces changements devraient apparaître au cours de la première itération de l'entête figé sur nos wikis pilotes.
Tests quantitatifs
Avant et après, nous surveillerons l'usage des liens utilisateur sur les wikis primo-adoptants concernés par nos premiers déploiements. Nous nous attendons à voir une augmentation faible mais significative de l'accès à certains de ces liens, en particulier à la page de discussion et à la page de l'historique.
Results from A/B test on pilot wikis
From Jan 5 to Jan 31, 2022, we ran an A/B test to assess the impact of deploying the sticky header. The test ran on 22 of our pilot wikis. Logged-in users who were assigned to the treatment group with the new skin version saw the sticky header while users in the control group saw the old feature.
The primary goal of the AB test was to test the hypothesis that the sticky header decreases the need to stroll to the top of the page. We also studied following two questions:
- What is the clickthrough rate (per pageview or per session) of each item on the sticky header?
- What is the ratio of clicks of sticky header items to the corresponding items at the top of the page?
Overall, there was an average 15% decrease in scrolls per session by logged-in users on the 15 pilot wikis in the treatment group (with the new sticky header), compared to the control group (without the sticky header). This indicates that our hypothesis was correct - adding the sticky header to the page reduced the need to scroll to the top of the page significantly.
The full report is available at this link.
Results from A/B test for edit button in the sticky header
To evaluate the impact of introducing an "edit" button within the sticky header, we ran two A/B tests. These two A/B tests were designed to help us learn how the new edit button within the sticky header impacted the likelihood:
- People would publish the edits they started
- The edits people published would get reverted
What follows are the conclusions we're drawing from these A/B tests and details about the Wikipedias that participated in them:
- People were more likely to complete the edits they start using the sticky header
- Of all the edits people initiated throughout both A/B tests, there was a 2.8% and a 6.8% increase in the percent of people who were able to successfully complete at least one edit using the edit button within the sticky header, in AB Test Experiment #1 and #2 respectively. This is in comparison to edits people started using other edit buttons present on the page.
- Edits people initiated and published using the sticky header were less likely to be reverted
- Of all the edits people published throughout both A/B tests, the edits people started using the new edit button within the sticky header were less likely to be reverted than edits started using other edit buttons present on the page.
Note: We are able to confirm that edits published using the sticky header were less likely to be reverted than edits publishing using other edit buttons present on the page. Hovewer, we are unable to confirm and share a specific percentage decrease in revert rates because of a relatively high margin of error. Learn more in the test report.
The first test ran between 6 July and 8 August 2022 on 15 Wikipedias. At these projects, 50% of people included in the A/B test were shown the sticky header without an edit button within it and 50% of people were shown the sticky header with an edit button within it.
The second test ran between 16 August and 1 September 2022 on two Wikipedias: Vietnamese and Indonesian. At these projects, there were three equally-sized test groups:
- A control group that did not see or have access to the new sticky header
- A treatment group that saw the new sticky header without an edit button within it
- A treatment group that saw the sticky header with an edit button within it.
FAQ
Mes modèles utilisent des éléments fixes. Comment être sûr qu'ils ne sont pas recouverts par l'entête fixe ?
Ajoute la classe .mw-sticky-header-element à tous les éléments que vous voulez fixer au bas de l'entête figé.
mw.util.addPortletLink('p-personal-sticky-header', '#', 'test', 'myfeatureid')
mw.util.addCSS('.mw-ui-icon-vector-gadget-myfeatureid:before { background-image: url(/w/resources/lib/ooui/themes/wikimediaui/images/icons/code.svg); }' );
Comment ajouter des icônes à l'entête figé ?
Actuellement nous ne supportons pas officiellement l'extension de l'entête figé de cette manière.
We currently do not officially support extending the sticky header in this way.
Pourquoi le bouton des langues n'apparaît-il pas dans mon entête figé ?
Allez dans vos Préférences, et cochez la case « Utiliser une liste compacte de langues, avec seules celles qui vous conviennent. » pour afficher les langues dans l'entête figé.
Pourquoi l'entête figé n'apparaît-il pas sur certaines pages ?
L'entête figé n'est actuellement visible que par les utilisateurs connectés, utilisant des navigateurs modernes pour les actions et les espaces de noms autorisés, lorsque l'utilisateur fait défiler la page vers le bas. Au moment d'écrire, cela est disponible seulement pour les espaces de nom suivants : Principal, Discussion, Utilisateur, Discussion utilisateur, Wikipédia, Modèle, Aide, Catégorie, Portail, Module [1] mais pas pour les anciennes versions, les Diffs, l'Historique des versions ou encore les pages en mode édition[2].
The sticky header is currently only visible to logged in users using modern browsers on allowed actions and allowed namespaces when the user has scrolled down the page. At time of writing it is only enabled on namespaces: Main, Main talk, User, User talk, Wikipedia, Template, Help, Category, Portal, Module[3] but not old revisions, diffs, history or edit pages[4].
Voir aussi
- Gadget des entêtes de tableau figés sur la Wikipédia anglophone
- Script utilisateur d'entête figé
- Script utilisateur d'entête figé
- Script utilisateur d'entête figé
Références
- ↑ https://github.com/wikimedia/Vector/blob/master/resources/skins.vector.es6/stickyHeader.js#L535
- ↑ https://github.com/wikimedia/Vector/blob/master/resources/skins.vector.es6/stickyHeader.js#L548
- ↑ https://github.com/wikimedia/Vector/blob/master/resources/skins.vector.es6/stickyHeader.js#L535
- ↑ https://github.com/wikimedia/Vector/blob/master/resources/skins.vector.es6/stickyHeader.js#L548