Reading/Web/Desktop Improvements

From mediawiki.org
< Reading‎ | Web

The current default Wikimedia skin (Vector) was deployed in the year 2010. Over the last decade, the interface has been enriched with extensions, gadgets and user scripts. Most of these were not coordinated visually or cross-wiki. At the same time, web design, as well as the expectations of readers and editors, have evolved. We think it's time to take some of these ideas and bring them to the default experience of all users, on all wikis, in an organized, consistent way.

Our goals are to make Wikimedia wikis more welcoming and to increase the utility amongst readers and maintain utility for existing editors. We measure the increase of trust and positive sentiment towards our sites, and the utility of our sites (the usage of common actions such as search and language switching).

Currently, on most wikis, only logged-in users are able to opt-in individually. On selected wikis, our changes are deployed for all by default, and logged-in users are able to opt-out. We are increasing the number of wikis where Vector 2022 is the default, until our improvements are default on all wikis.

Updates[edit]

May 2023: Continuing work on Vector 2022, and making plans for the new fiscal year

We have been focusing on continuing deployments across remaining wikis and running experiments for further improvements. We have also done some work on the plans for future projects.

  • Rollouts. Vector 2022 is now the default skin on Polish and Spanish Wikipedias, and French Wikinews. We are also discussing with the Chinese Wikipedia community. Special gratitude to everyone who helps us and editors have better understanding in the discussions, find and resolve bugs, and explain decisions. If the community of your wiki would like our skin to become the default, please reach out to us!
  • Experiment: toggle indicator. We have launched an experiment which introduces an indicator pointing to the fixed width toggle. This is to ensure that readers are aware of the location of the toggle and able to switch between full and fixed width. (T335307)
  • Content separation (Zebra #9) A/B test. We will run an experiment that compares different content separation layouts for the interface (based on this prototype). The experiment will be run in May across a set of 10 large to medium-sized Wikipedias. Once the experiment is complete, we will analyze the data and continue the process of selecting the best page layout. Read more about the on-wiki test here. For more information, check our documentation on the previous user testing experiment. Many thanks to everyone who has commented on this topic on our project talk page, on other wikis, or at online meetings with us! (T333180, T335972)
  • Plans for the future. In the next fiscal year of the Foundation, we'll be working on new projects. We invite you to read the draft of the Wikimedia Foundation annual plan, section Infrastructure, Bucket: Wiki Experiences. Also, read the more detailed description "WE2: Reading and media experience". This is the part our team will focus on. Among others, dark mode and reading lists are mentioned as examples of the possible projects. We will be glad to read your comments on the talk pages of the linked Meta-Wiki pages. Post in any language! The deadline is .

March 2023: Vector 2022 on more wikis and other updates[edit]

Over the past few months, the team has been preparing and changing the skin on the largest Wikipedias. Vector 2022 has become the default for all logged-in and logged-out users on Czech and English Wikipedias.

Since then, we have been discussing further improvements to the skin with the communities. As a result of these discussions as well as working on the previous plans, we've implemented many changes. These include:

  • Persistence and availability of the full width toggle. The full width toggle (available at the bottom of the page) is now persistent for both logged-out and logged-in users. This means that they see the width of their choice in spite of refreshing the page or opening a new one. The toggle is also available at narrower screen widths.
  • New page tools menu.
    • It allows for a separation between navigation related to the entire wiki and tools related to a specific page. In the first group there are, for example, Main page and Random page. In the second group there are, for example, What links here, Related changes, and Cite this page. The new menu also collects the page-specific tools in a single menu. Before, some of these links were the main menu (sidebar) or in the More menu (next to History). Our goal is to make it easier for new readers and editors to understand what these links do. Users also may pin and unpin the new menu. More information is available on the project page.
    • Making this change also has the benefit of showing the table of contents further up the page. Now, people need to scroll down to see the table of contents more rarely. This is one of the concerns we've been hearing over the last couple of days and hope this addresses it.
  • Moving the log-in link outside of the drop-down menu for logged-out users. This change makes it quicker to reach the log-in link, without requiring logged-out users to open the drop-down menu.
  • Various small improvements to the Table of Contents (ToC):
    • Increase the height of the ToC. This will allow the ToC to appear longer, and for more sections to be visible (T319315).
    • Where the page lands when clicking on a ToC link (T314419). We've heard that the ToC opens too close to the beginning of a section, without giving any space for the title and previous section. This change will increase this space, making it more comfortable when navigating.
    • Threshold for when a section is considered active, and marked in the ToC (T317661). We have also heard that a section is considered active only after the user has scrolled the previous section out of view. This had lead to some confusion on the active state. This change will allow sections to be shown as active earlier, when the majority of the section is displayed on the screen.
    • Navigating directly to sub-sections and expand the parent section if collapsed (T325086). Some of the feedback relates to the way that subsections appear on the page. We've heard that subsections should appear more consistently when needed. This change ensures that subsections are open when the user opens a direct link to that subsection.

Upcoming changes and explorations

We are currently working on the following changes:

  • Page layout. We wanted to address one of the main concerns which has come out of the feedback around the skin so far. It's about the separation of content, and the brightness of the interface. We've developed a prototype we would like to get your feedback on. How should we measure the potential changes as compared to the current layout? We've posted more details and specific questions on the talk page. There are a few sections for discussions in different languages. Add your comments and questions there!
  • Configuration of the table of contents. We want to allow the ToC to be more configurable. Then, editors could determine when the ToC needs to be expanded or collapsed by default, and how many sections of the ToC can be shown by default. This will replicate the functionality of some of the "magic words" used in the ToC. It will be especially useful on pages like the Village Pump or coordination pages in the Wikipedia namespace (T317818).

What is our objective?[edit]

Imagine a wardrobe[edit]

Currently, the interface…[edit]

…doesn't match the expectations. …is cluttered and not intuitive. …doesn't highlight the community side. …isn't consistent with the mobile version.

  1. The desktop interface does not match the expectations created by the modern web platforms. It feels disorienting and disconnected. Navigation and interface links are organized haphazardly.
  2. There is clutter that distracts users from focusing on what they came for. It is challenging for readers to focus on the content. It is not possible for them to intuitively switch languages, search for content, or adjust reading settings. New editors are unable to use their intuition to set up their account, open the editor, or learn how to use non-article pages for moderation purposes.
  3. A very small percentage of readers understand how Wikimedia wikis function. Many readers are not aware that the content they are reading is written by volunteers and updated frequently, or that they can potentially contribute as well.
  4. The large difference in experiences among our desktop interface, apps, and the mobile web, makes it difficult for readers to connect our products. There is a lack of unity in the concept of Wikimedia sites.

How the changes are made[edit]

Principles[edit]

We do not touch the content. We do not remove any functionality. We do not change skins other than Vector. We are inspired by the existing gadgets. We do not make major changes in single steps.

  1. We are working on the interface only. No work will be done in terms of styling templates, the structure of page contents, map support, or cross-wiki templates.
  2. Though our changes are easily noticeable, we are taking an evolutionary approach and want the site to continue feeling familiar to readers and editors. Each feature is discussed, developed, and deployed separately.
  3. Elements of the interface might move around, but all navigational items and other functionality currently available by default will remain.
  4. Skins other than Vector are out of the scope of our adjustments. We have frozen Vector to Legacy Vector, and begun deploying our features as parts of the new default Vector.
  5. We have analysed many wikis and have noticed many useful gadgets. Some of them definitely deserve to be surfaced and be a part of default experience.
  6. Both prior to development and after deployment, we collect data (via A/B testing, prototype feedback rounds, etc.). In the case of significantly negative results, we will roll back our changes.
  7. It is our intention to test our improvements in collaboration with a diverse set of volunteering early adopter wikis, both Wikipedias and sister projects.


Deployment plan and timeline[edit]

The skin is now ready to become the default on any wiki.

List of early adopter wikis (test wikis) 

First group of wikis (marked as ※ on the timeline above):

Second group of wikis (marked as † on the timeline above):

Third group of wikis (marked as ‡ on the timeline above):

Fourth group of wikis (marked as § on the timeline above):

First group of small wikis (marked as ¶ on the timeline above): 

Get involved & Contact[edit]

  • Translate: help us translate related pages:
Priority translations 

TOP3

  1. Reading/Web/Desktop Improvements
  2. Reading/Web/Desktop Improvements/Frequently asked questions
  3. Reading/Web/Desktop Improvements/Features

Other priority translations

  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. Reading/Web/Desktop Improvements/Updates
  5. Reading/Web/Desktop Improvements/Repository
  6. Template:Reading/Web/Desktop Improvements/Office hours announcement

Direct link to all translations

What features will be added[edit]

Each feature was built and implemented separately, over time. Our decisions are based on community feedback, user testing, and extracted API data.