MediaWiki

Čtení/Web/Vylepšení plochy/Funkce/Sticky záhlaví

< Reading | Web | Desktop Improvements | Features
This page is a translated version of the page Reading/Web/Desktop Improvements/Features/Sticky Header and the translation is 100% complete.
Languages:
Řešeno přes Phabricator
Úkol T283505

V rámci projektu Desktop Improvements změníme běžně používané nástroje, které byly dříve dostupné pouze v horní části stránky. Nová funkcionalita umožní přístup k těmto nástrojům po celé stránce prostřednictvím "sticky" (přilepeného) nebo "fixed" (pevného) záhlaví. Naším cílem je usnadnit čtenářům a redaktorům přístup k těmto nástrojům. Uvědomujeme si, že nyní často potřebují rolovat až na začátek stránky.

Pozadí a cíle

V současné době je mnoho funkcí na stránkách wiki dostupných pouze uživatelům v horní části stránky a/nebo v levém panelu stránky. To se stává problematickým na delších stránkách, kdy rolování za prvních několik odstavců znamená, že uživatel bude muset posunout zpět nahoru, aby znovu získal přístup k nástrojům a dalším zdrojům. Naší navrhovanou metodou, jak to vyřešit, je učinit záhlaví webu "sticky". To znamená, že zůstane pevně v horní části obrazovky (nad obsahem), když posouváte stránku nahoru nebo dolů.

V současné době navíc našim čtenářům a přispěvatelům nabízíme velmi malou orientaci na stránce. To ztěžuje rozlišení mezi jednou a druhou stránkou.

Naším cílem je:

  • Poskytout funkcionalitu i kontext na celé stránce.
  • Snížit čas, který čtenáři a editoři stráví posouváním stránky nahoru a dolů pro účely navigace.

Případy použití

  • Jako čtenář chci neustále vědět, jaký článek čtu, abych se na webu snadno orientoval.
  • Jako editor chci mít možnost přístupu k důležitým funkcím (např. upravit, přejít na stránku historie nebo diskusní stránku článku) odkudkoli na stránce, abych neztrácel čas posouváním nahoru.
  • Jako vícejazyčný čtenář chci mít možnost přepínat jazyky v kterémkoli okamžiku čtení, abych mohl přepínat přímo poté, co najdu matoucí slovo nebo větu.

Popis funkce a požadavky

Jakmile se uživatel posune za aktuální záhlaví na stránce, v horní části stránky se zobrazí nalepené/pevné záhlaví.

  • Pro anonymní uživatele bude záhlaví obsahovat následující:
    • Logo Wiki
    • Vyhledávání
    • Název stránky
    • Název sekce
  • Pro přihlášené uživatele bude záhlaví obsahovat následující:
    • Logo Wiki
    • Nabídka uživatelských nástrojů (viz stránka uživatelských nástrojů)
    • Vyhledávání
    • Název stránky
    • Název sekce
    • Odkaz na diskusní stránku
    • Odkaz na stránku historie
    • Odkaz na zdroj a ebo úpravu (podle preferencí samotných wikin)
    • Funkce přepínání jazyků

Chování posouvání hlavičky se musí přizpůsobit potřebám přihlášených uživatelů

  • Poznámka: V současné době testujeme různé způsoby posouvání a spouštění, včetně umožnění zobrazení záhlaví při posouvání stránky nahoru a při přepínání karet. Budeme také zkoumat trvalé zobrazování záhlaví

Záhlaví musí být přizpůsobitelné při nižším rozlišení obrazovky (až do 500 pixelů)

Návrhové požadavky a směrnice

Prototyp

https://people.wikimedia.org/~jdrewniak/dip/p4.html#/en/wiki/Moon

Anonymní uživatelé

Poznámka: Pro první iteraci lepivého záhlaví bude záhlaví dostupné pouze pro přihlášené uživatele

 
Prototyp navrhované funkce "sticky" hlavičky na wikinách Wikimedie pro anonymní uživatele

Přihlášení uživatelé

 
Prototyp navrhované funkce "sticky" záhlaví na wikinách Wikimedie pro přihlášené uživatele

Kvalitativní testování

Uživatelské testování

Hlavní stránka: Sticky Header and Table of Contents User Testing

Provedli jsme uživatelské testování lepivého záhlaví se čtečkami a editory ve třech místech a jazycích s cílem určit, která funkce má nejvyšší prioritu, aby bylo možné zahrnout do lepivého záhlaví. U první iterace lepivé hlavičky odstraníme spouštěcí chování a nalepíme hlavičku jako trvalou podle požadavku řady editorů zapojených do uživatelského testování. Změnu pak vyhodnotíme naživo. Vyzkoušeli jsme také použitelnost našeho aktuálního prototypu.

Výsledky testu byly použity k iteraci odkazů dostupných v hlavičce a také ke spouštění a trvalému chování hlavičky. Zobrazit úplné výsledky tohoto testu.

Testování prototypu

V květnu 2021 jsme provedli testování prototypu s přihlášenými uživateli na 30 wikinách. Test byl navržen tak, aby shromáždil zpětnou vazbu o použitelnosti a funkčnosti lepivé hlavičky a uživatelské nabídky.

Naše předběžné výsledky ukazují, že drtivá většina účastníků testu uvedla pozitivní zkušenost s lepicí hlavičkou. Účastníci uvedli, že se jim líbila možnost přístupu k důležitým funkcím z jakékoli části stránky.

Velký počet účastníků (~20 %) však uvedl problémy se vzhledem samotné nalepovací hlavičky. Většina z těchto účastníků uvedla, že si přeje, aby se záhlaví na stránce zobrazovalo trvale, nikoli pomocí různých spouštěčů. Někteří z účastníků uvedli, že i když se jim líbil vzhled záhlaví na spoušti, měli problémy s příliš rychlým zobrazováním/mizením záhlaví.

Jako další kroky zkontrolujeme spouštěče, které umožňují zobrazení a zmizení záhlaví. Plánujeme také další experimenty s lepivým záhlavím, které se na stránce trvale zobrazuje. Očekává se, že tyto změny se objeví během první iterace lepivé hlavičky nasazené na naše pilotní wikiny.

Kvantitativní testování

Po prvním nasazení budeme sledovat před a po použití odkazů obsažených v lepivém záhlaví na našich pilotních wikinách. Očekáváme malý, ale významný nárůst v přístupu k některým z těchto odkazů, zejména na diskusní stránku a stránku historie.

Výsledky A/B testu na pilotních wikinách

Od 5. ledna do 31. ledna 2022 jsme provedli A/B test, abychom posoudili dopad nasazení lepivého záhlaví. Test probíhal na 22 našich pilotních wikinách. Přihlášení uživatelé, kteří byli přiřazeni do léčebné skupiny s novou verzí vzhledu, viděli lepící záhlaví, zatímco uživatelé v kontrolní skupině viděli starou funkci.

Primárním cílem AB testu bylo otestovat hypotézu, že lepkavé záhlaví snižuje potřebu procházet se na začátek stránky. Také jsme studovali následující dvě otázky:

  • Jaká je míra prokliku (na zobrazení stránky nebo na relaci) každé položky na pevném záhlaví?
  • Jaký je poměr kliknutí na položky s pevným záhlavím k odpovídajícím položkám v horní části stránky?

Celkově došlo k průměrnému 15% poklesu rolování na relaci přihlášenými uživateli na 15 pilotních wiki v léčebné skupině (s novým lepivým záhlavím) ve srovnání s kontrolní skupinou (bez lepivého záhlaví). To naznačuje, že naše hypotéza byla správná – přidáním lepivého záhlaví na stránku se výrazně snížila potřeba posouvat se na začátek stránky.

Celá zpráva je k dispozici na tomto odkazu.

Výsledky z A/B testu pro tlačítko upravit v lepivém záhlaví

Abychom vyhodnotili dopad zavedení tlačítka "upravit" do lepivého záhlaví, provedli jsme dva testy A/B. Tyto dva A/B testy byly navrženy tak, aby nám pomohly zjistit, jak nové tlačítko pro úpravy v nalepovacím záhlaví ovlivnilo pravděpodobnost:

  1. Lidé by zveřejňovali úpravy, které začali
  2. Úpravy publikované lidmi by byly vráceny

Následují závěry, které vyvozujeme z těchto A/B testů, a podrobnosti o Wikipediích, které se jich účastnily:

  1. Lidé s větší pravděpodobností dokončí úpravy, které začnou používat lepící záhlaví
    Ze všech úprav, které lidé zahájili v průběhu obou A/B testů, došlo k nárůstu o 2,8 % a 6,8 % v procentech lidí, kteří byli schopni úspěšně dokončit alespoň jednu úpravu pomocí tlačítka úprav v lepivém záhlaví, v AB testovacím experimentu č. 1 a č. 2. To je ve srovnání s úpravami, které lidé začali používat jiná tlačítka úprav na stránce.
  2. Úpravy, které lidé zahájili a publikovali pomocí lepivého záhlaví, byly méně pravděpodobné, že budou vráceny zpět
    Ze všech úprav, které lidé publikovali během obou A/B testů, bylo méně pravděpodobné, že úpravy, které lidé začali používat pomocí nového tlačítka úprav v lepivém záhlaví, budou vráceni zpět, než úpravy zahájené pomocí jiných tlačítek úprav přítomných na stránce.

Poznámka: Jsme schopni potvrdit, že úpravy publikované pomocí rychlého záhlaví byly vráceny s menší pravděpodobností než úpravy publikované pomocí jiných tlačítek úprav na stránce. Nejsme však schopni potvrdit a sdílet konkrétní procentuální pokles míry návratnosti z důvodu relativně vysoké míry chyb. Více se dozvíte v testovací zprávě.

První test probíhal mezi 6. červencem a 8. srpnem 2022 na 15 Wikipediích. V těchto projektech bylo 50 % lidí zahrnutých do A/B testu zobrazeno nalepovací záhlaví bez v něm umístěného tlačítka pro úpravy a 50 % lidí bylo zobrazeno nalepené záhlaví s tlačítkem pro úpravy v něm.

Druhý test probíhal mezi 16. srpnem a 1. zářím 2022 na dvou Wikipediích: vietnamské a indonéské. V těchto projektech byly tři stejně velké testovací skupiny:

  1. Kontrolní skupina, která neviděla nové pevné záhlaví nebo k němu nemá přístup
  2. Kontrolní skupina, která viděla nové lepivé záhlaví bez v něm tlačítko pro úpravy
  3. Kontrolní skupina, která viděla nalepené záhlaví s v něm tlačítko pro úpravy.


FAQ

Moje šablony používají lepivé prvky. Jak zajistit, aby nepřekrývaly lepicí hlavičku?

Přidejte třídu .mw-sticky-header-element ke všem prvkům, které chcete nalepit na spodní část lepivého záhlaví.

Jak přidám odkazy do rozbalovací nabídky s lepivým záhlavím?

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); }' );

Jak přidám ikony do lepivé hlavičky

V současné době oficiálně nepodporujeme rozšíření lepivé hlavičky tímto způsobem.

Proč v mém lepivém záhlaví není žádné tlačítko jazyka

Přejděte do předvoleb a zaškrtněte políčko "Použít kompaktní seznam jazyků" s jazyky, které jsou pro vás relevantní pro povolení jazyků v nalepovacím záhlaví.

Proč se na určité stránce nezobrazuje nalepené záhlaví?

Nalepovací záhlaví je aktuálně viditelné pouze pro přihlášené uživatele, kteří používají moderní prohlížeče na povolených akcích a povolených jmenných prostorech, když uživatel posune stránku dolů. V době psaní tohoto článku je povoleno pouze ve jmenných prostorech: Main, Main talk, User, User talk, Wikipedia, Template, Help, Category, Portal, Module[1], ale ne staré revize, historie revizí stránky[2].


Související odkazy

Poznámky pod čarou

  1. ↑ https://github.com/wikimedia/Vector/blob/master/resources/skins.vector.es6/stickyHeader.js#L535
  2. ↑ https://github.com/wikimedia/Vector/blob/master/resources/skins.vector.es6/stickyHeader.js#L548
Retrieved from "https://www.mediawiki.org/w/index.php?title=Reading/Web/Desktop_Improvements/Features/Sticky_Header/cs&oldid=7096696"