Czytanie/Sieć/Ulepszenia interfejsu

From mediawiki.org
This page is a translated version of the page Reading/Web/Desktop Improvements and the translation is 83% complete.
Outdated translations are marked like this.

Poprzednia domyślna skórka wiki Wikimediów (Wektor) została wdrożona w 2010 roku. Przez następne dziesięciolecie interfejs zostawał wzbogacony poprzez rozszerzenia, gadżety oraz skrypty użytkowników. Większość z nich nie było koordynowane pod kątem wizualnym i dostępności na wielu wiki. Przez ten czas sposób projektowania stron internetowych oraz oczekiwania czytelników i redaktorów ewoluowały. Nadszedł czas, aby niektóre pomysły zostały wdrożone do domyślnego działania strony dla wszystkich użytkowników, na wszystkich wiki, w sposób spójny i zorganizowany.

Naszymi celami jest sprawienie, by wiki Wikimediów były przyjaźniejsze, zwiększenie użyteczności dla czytelników i utrzymanie jej dla już działających edytorów. Mierzyliśmy poziom pozytywnych odbioru i zachowań oraz użyteczności naszych stron (na przykład poziom tak powszechnych działań, jak wyszukiwanie czy zmiana wersji językowej).

Obecnie na większości wiki tylko zarejestrowani użytkownicy mogą włączać nasze zmiany wyłącznie dla samych siebie. Na niektórych wiki nasze zmiany są włączone dla wszystkich domyślnie, a zarejestrowani użytkownicy mogą je sobie wyłączyć. Zwiększamy liczbę wiki, gdzie Wektor 2022 jest domyślny, a docelowo ma być domyślny na wszystkich wiki.

Aktualizacje

listopad 2023: Visual changes, more deployments, and shifting focus

Before (?vectorzebradesign=0)
After (?vectorzebradesign=1)

New styling inspired by Zebra prototype

As part of Zebra #9 prototype, which we wrote about in the last two updates, we introduced two kinds of visual changes: color-based area separation, and other CSS modifications. As we reported previously, the A/B test didn't prove that the color-based separation was an improvement. We focused on the other CSS modifications instead, and we're implementing these changes now. To preview the difference, you may use URL parameters: ?vectorzebradesign=0 (without the changes) and ?vectorzebradesign=1 (with the changes). The changes are:

  • Dropdown menus (the sidebar, table of contents, user menu, and tools menu when not pinned) have a lighter outline and drop-shadow.
  • The "przypnij"/ "ukryj" buttons in the dropdown menus have a gray background instead of the square brackets.
  • The main menu no longer has a gray background when it is placed in the side column (when it's pinned). Instead, all menus have the same appearance when placed in the side columns.
  • The left and right columns have equal width.
  • Due to the change above, the content width gets slightly narrower when menus are pinned in both columns.
  • The gap between the table of contents and content area is smaller.

In mid-November, we shipped these changes to the following Wikipedias: French, Catalan, Hebrew, Polish. We are planning on introducing these changes across all the wikis within 2-3 weeks. These will enable future modifications, like the Accessibility for reading menu.

Continuing deployments of the Vector 2022 skin

A video about Vector 2022

Since our last update, we have changed the default skin on a few Wikipedias: Dutch, Hindi, Hungarian, Norwegian (bokmål), and Swedish. We have also released a short video about the skin. In addition, after receiving all logos from our Design team, we were also ready to continue the wide-scale deployments on sister projects.

  • The Vector 2022 skin is now the default on all non-English Wikibooks, Wikinews, Wikiquotes, Wikiversity, as well as on Meta-Wiki.
  • We are continuing conversations and scheduling deployments to the remainder of sister projects, beginning with non-English Wikisource, Wiktionary, and Wikivoyage.

Some of these projects may need adjustments, like default settings for limited/full-width at namespaces unique to Wikisource. Gadgets or user scripts may need to be updated, too. We gladly make fixes or assist in making them, depending on whether changes need to be made in the skin itself or a community-controlled code. Reach out to us on the Desktop Improvements talk page or write directly to SGrabarczuk (WMF) if you have any questions or requests for further changes.

Focusing on further desktop and mobile readability improvements

The team has shifted focus onto the Accessibility for reading project. We will work on improvements in typography and introduce dark mode to the Vector 2022 and Minerva skins. Please visit the project page for more details and information on how to get involved.

wrzesień 2023: Results from the Content separation (Zebra #9) A/B test

In June 2023, we ran an experiment which compared different content separation layouts of the interface.

This prototype shows the tested design; we're calling it "Zebra". The goal was to improve readability and focus on the content of the page. The experiment tested the prototype design and compared it to the current all-white Vector 2022 design. The results of the experiment showed:

  1. A 3% increase in pageviews per session in the treatment group attributed to Zebra
  2. A 3.4% decrease in edits per session in the treatment group attributed to Zebra
  3. A 17% decrease in the click rate of the table of contents
  4. An 87% increase in the page tool pins per session

After reviewing the settings of our test, we did not find any issues that would result in data inconsistencies. Next, we studied other factors which might affect the results of the test. We noticed that a significant amount of the decrease in edits and pageviews came from screen sizes narrower than 1200 px. We combined these results with the results of our user tests.

These did not indicate significant differences in readability between the test and control designs.

Our conclusion was that the prototype did not, in its tested form, improve readability and could negatively affect edits.

We decided not to proceed with the deployment of this prototype in its tested form. Instead, we plan to improve readability and focus on the content through the following:

  1. Introducing changes to the typography, focused on improving readability and content comprehension. This is the goal of the new project, Accessibility for reading
  2. Introducing improvements to Zebra, optimizing for narrower screens, and repeating the tests.

Jaki był nasz cel?

Wyobraź sobie garderobę

Poprzednio, interfejs…

…nie spełniał oczekiwań. …był zagracony i nieintuicyjny. …nie wyróżniał strony społecznościowej. …nie był spójny z wersją mobilną.

  1. Interfejs desktopowy nie spełniał oczekiwań stworzonych przez nowoczesne platformy sieciowe. Był dezorientujący i niespójny. Nawigacja i linki interfejsu były chaotyczne.
  2. Obecnie panuje nieład, który rozprasza użytkowników od tego, po co przyszli. Czytelnikom jest trudno skupić się na treści. Intuicyjne zmiana języków, wyszukiwanie treści czy dostosowanie ustawień czytania są dla nich niemożliwe. Nowi użytkownicy nie mogą użyć intuicji przy zakładaniu konta, otwieraniu edytora czy uczeniu się, jak używać stron niebędących artykułami w celach moderacyjnych.
  3. Bardzo mały procent czytelników rozumie, jak funkcjonują wiki Wikimediów. Wielu z nich nie jest świadomych, że treści, które czytają, są przez wolontariuszy tworzone i często zmieniane, ani że sami czytelnicy także mogą edytować.
  4. Duża różnica między wrażeniami przy używaniu interfejsu komputerowego, aplikacji mobilnych i przeglądarek mobilnych utrudnia czytelnikom powiązanie ze sobą stron widzianych w różny sposób. Nie ma wizji wspólnej dla wszystkich stron Wikimediów.

Jak zmiany zostaną wprowadzone

Zasady

Nie zmieniamy treści. Nie usuwamy żadnej funkcji. Nie zmieniamy innych skórek niż Vector. Inspirujemy się funkcjonującymi gadżetami. Nie robimy dużych zmian naraz.

  1. Pracujemy tylko nad interfejsem. Nie będziemy zajmowali się wyglądem szablonów, strukturą treści stron, mapami czy globalnymi szablonami.
  2. Skórki inne niż Vector są poza naszym zainteresowaniem. Zatrzymaliśmy Vectora, nazwaliśmy go Legacy Vector i zaczęliśmy wprowadzać zmiany jako składniki nowego wyglądu Vectora.
  3. Mimo że nasze zmiany łatwo zauważyć, podchodzimy do nich ewolucyjnie i chcemy, żeby, z perspektyw czytelników i edytorów, zachowanie strony było takie samo. Każda zmiana jest omawiana, rozwijana i wdrażana osobno.
  4. Chcemy, żeby nasze poprawki były testowane we współpracy z różnorodnym gronem wolontariacko zgłaszających się społeczności, zarówno Wikipedii, jak i projektów siostrzanych.
  5. Zarówno przed, jak i po wprowadzeniu zmian, zbieraliśmy dane (poprzez testy A/B, rundy zbierania opinii o prototypach, itd.). W razie zdecydowanie negatywnych rezultatów byliśmy gotowi wycofać nasze zmiany.
  6. Przeanalizowaliśmy wiele wiki i zauważyliśmy wiele użytecznych gadżetów. Niektóre z nich z pewnością zasługują na wydobycie na poziom domyślny dla wszystkich.
  7. Elementy interfejsu mogą być przemieszczane, ale wszystkie elementy nawigacyjne i inne dotychczas dostępne funkcje pozostaną dostępne.


Plan wdrożenia i oś czasu

Skórka jest już gotowa, więc może stać się domyślna na dowolnej wiki.

The timeline

Lista wcześnie używających wiki (wiki testowych) 

Pierwsza grupa wiki (zaznaczona jako ※ na powyższej osi czasu):

Druga grupa wiki (zaznaczona jako † na powyższej osi czasu):

Trzecia grupa wiki (zaznaczona jako ‡ na powyższej osi czasu):

Czwarta grupa wiki (zaznaczona jako § na powyższej osi czasu):

Pierwsza grupa małych wiki (zaznaczona jako ¶ na powyższej osi czasu): 

Zaangażuj się, kontakt

  • Subskrybuj newsletter
  • Przetłumacz: pomóż nam, tłumacząc powiązane strony:
Najważniejsze strony do przetłumaczenia 

Trzy najważniejsze

  1. Czytanie/Sieć/Ulepszenia interfejsu
  2. Czytanie/Sieć/Ulepszenia interfejsu/Często zadawane pytania
  3. Czytanie/Sieć/Ulepszenia interfejsu/Funkcje

Inne ważne strony do przetłumaczenia

  1. Template:Reading/Web/Desktop Improvements/Talk page intro
  2. Template:Reading/Web/Desktop Improvements/Features/Navigation
  3. Template:Reading/Web/Desktop Improvements/Header
  4. Czytanie/Sieć/Ulepszenia interfejsu/Aktualizacje
  5. Reading/Web/Desktop Improvements/Repository#posts
  6. Template:Reading/Web/Desktop Improvements/Office hours announcement

Bezpośredni link do materiałów


Jakie funkcje zostały dodane