阅读/网页/无障碍阅读

问题追踪器： #fy2023-24-we_2.1_typography_and_palette_customizations
From mediawiki.org
< Reading‎ | Web
This page is a translated version of the page Reading/Web/Accessibility for reading and the translation is 34% complete.
Languages:
维基媒体基金会的项目
无障碍阅读
通过更改版式与设置让网站更易访问
开始： 2023-07
成员： 网页团队
主导： Olga Vasileva（產品負責人）
更新： /Updates
← 为匿名用户提供长期生效的设置选项

維基媒體專案的界面必須符合無障礙和可讀性，無論何種語言或文字。 这包括大多数人，也包括有特定需求的个人。 然而，目前桌面和行動裝置上的排版使之難以閱讀。 此外，黑暗模式对弱光环境下以及喜欢低对比度阅读环境的用户很有帮助。 我们的界面目前尚未提供这一功能。

We would like to change the default typography. We will also build additional settings for typography and night mode as preferences. These changes will be available for both logged-in and logged-out users.

项目概要

As part of the 23/24 annual plan, the Web team's goal is to bring appearance settings for all users and change the default typography of all wikis. The default font size and text line height for all users across wikis will increase. This increase will improve readability for the majority of users. The team plans to make this deployment alongside the deployment of a new appearance menu which allows controls for page width, typography, and the upcoming dark mode – meaning that users will easily be able to adjust the font size back to the previous default.

The team plans to initiate discussions across all wikis, focusing on debugging current features and generating ideas for future enhancements. Then, the team will proceed with deployments, bringing the appearance menu to all users and the new typography defaults to logged-in users only. The deployment will be conducted in two steps, initially targeting a small set of wikis for testing before implementing changes across all wikis.

The decision to modify default typography is informed by research findings and accessibility recommendations. Currently, the WCAG recommendations for font size start with a minimum of 16 pixels and a AAA recommendation of 18 pixels for easy reading. Our current default is 14 pixels. This makes it more difficult to read (when compared to similar sites for long-form reading that are following these guidelines). On the other hand, we are aware that scannability (being able to scan and quickly find specific information within the page) is important for Wikipedia and that we should limit changes in text density when setting a new font size. The planned default font size is 16 pixels. This is based on:

  1. Readability research, academic studies, and market research: these sources indicated that generally bigger is better in terms of font size.
    1. Most long-form reading websites (such as news websites or social media) opt for somewhere between 16 and 18 pixels. In the two studies that specifically focused on increasing the font size of Wikipedia, researchers determined that increasing size improves comprehension.
    2. Our own research has shown that most reading sessions are 20–30 second long. This isn't enough to digest and change a type setting. This option gives the readability benefits of the new default to the most people possible with the least amount of user effort.
  2. Accessibility recommendations

Community-proposed designs: 632 logged-in users from 13 Wikipedias submitted designs with typography settings that they considered as comfortable for them. While many designs focused on keeping the default the same, the majority of designs chose a larger font size.

更新

主页面： Reading/Web/Accessibility for reading/Updates

2024年5月：使用者測試結果、測試功能使用資料以及首個深色模式版本現已推出

使用者測試結果

我們對外觀選單進行了可用性測試。您可以在此處查看完整結果報告。簡而言之：在外觀選單（舊稱：主題選單）中有排版、寬度和深色模式選項。測試的目的是確定選單是否易於使用，以及不同設定的名稱對大多數使用者來說是否直觀。透過測試，我們了解到：

  • 未發現重大可用性問題。
  • 使用者通常偏好稱之為「深色」（dark）配色方案，而非「夜間」（night）配色方案。因此，我們已將該功能的名稱改回「深色」配色方案，或簡稱為深色模式。
  • 使用者很難找到折疊後的選單圖示。因此，我們新增了一條通知，通知使用者選單已折疊到何處。

測試功能使用資料

作為測試功能，我們一直在追蹤新選單的使用狀況。您可以在此處查看完整結果報告。簡而言之，我們了解到「標準」是最受歡迎的選項。我們也發現：

  • 約55%的新選單點擊是為了選擇比預設字型大小更大的字型（標準字型或大字型）。
  • 大多數的點擊（46.7%）是針對「標準」字型大小的。

這證實了大多數使用者更喜歡比目前預設值更大的字型大小。我們之前在社群原型測試的調查結果中發現了這一點。我們將使用這些資料來決定新的預設值。

深色模式現已推出

行動版網站上的已登入使用者現在可以使用深色模式（僅限 Minerva外觀）！若要存取此功能，您必須選擇啟用行動裝置的進階模式。然後，您可以從色彩選項清單中選擇「深色」。（註：選擇「自動」將遵循您裝置的偏好。）請參閱有關此變更的詳細訊息，並前往常見問題頁面以查看有關此專案基礎知識的更多資訊。

主命名空間頁面將以全螢幕寬度顯示

目前，主命名空間的頁面（如條目）是以限制寬度模式顯示。考慮到帶有圖片的兩欄布局和當前的排版，行長（以每行字元數來衡量，CPL）是可以接受的。但是，當預設字體大小增大時，CPL會變得有點太小。因此，我們決定在主命名空間頁面上預設關閉限制寬度模式。相反，它們將像特殊頁面一樣以全螢幕寬度顯示。有關更多技術細節，參見T357706。


背景

Why it is important to work on this

Over the past few years, we have introduced the Vector 2022 skin across many wikis. We have designed it to improve the reading experience. Another goal was to provide an experience that is comfortable for existing users and more welcoming to new users. However, there are still issues with readability we have yet to address. During the research for that project, one of the issues we recognized was the size of the text itself.

Compared to the more accessible digital text, it takes longer to read our content on desktop and mobile. The ability to remember text that was read is also affected. An important factor to keep in mind is that people engage both in in-depth reading and skimming of text.[1] We would like to improve our typography for both of these ways of using the projects.

Also, our desktop site does not allow to set a font size that is comfortable for the user. Instead, readers with specific needs and likings depend on browser functionality to alter the font size. These capabilities vary by browser and are not always supported by the rest of our user interface. This causes issues with tools or navigation.

Annual plan context

Quotation from the Foundation's 2023/2024 annual plan 

Ensure a quality reading experience for all users by adapting the default experience for 15% of page views, based on the individual needs and constraints of the user.

This key result is focused on allowing the opportunity for our interface to adapt to individual needs when necessary. The theory here is that people will feel more engaged with a website and interface that can adapt based on their needs. This can include work such as dark mode, text and page density, and font size customizations. Some of this adaptation can be done automatically by the interface – for example, creating responsive versions of a feature or tool, or ensuring that dark mode turns on based on the browser or device settings of the user. In other cases, this adaptation can be done through intentional customization – allowing users to select non-default states in specific (but limited) cases. From an accessibility perspective, it will focus on the features that need to be built as standalone to allow for more accessibility, or to allow for setting defaults that are more accessibility friendly, while leaving the opportunity for customization to users who have different preferences. To set the specific number "15%", we looked at how users adapt the default experience in the Wikipedia iOS app. 59% of users of the app are using a non-default theme (dark, black, or sepia).

We used this number as a baseline, but factored in our assumption that it is more likely that habitual users of Wikipedia on the web take the time to adapt their reading experience, as opposed to sporadic users.
—Wikimedia Foundation, Annual Plan/2023-2024. Wiki Experiences: Reading and media experience. Objective 2.1


目标

排版改进

本项目的目标是：

  1. 确定并理解问题。 对各维基上的排版问题进行检查和分类
  2. 让网站更容易阅读。 提升移动版与桌面版网站的可读程度
  3. 提供更适合不同语言和文字的排版。 通过不同社群的支持与专业知识提升可读程度
  4. 让读者可以自定义排版。 引入排版的偏好设置，对有着不同需求和喜好的人十分有用

深色模式

  1. 提升网站在低光照环境下的可读程度
  2. 让深色模式选项与设置易于发现及使用

时间轴和各阶段

排版改进

阶段 時間段 描述
Research and literature review 7月– We learned what researchers say about typography for desktop and mobile
Prototype testing + discussing with communities 10月– Most editors taking part in the previous testing were open to a font size increase. They came from different communities.
Beta feature deployment 2023年12月 We released the typography improvements as a beta feature to all wikis and encouraged communities to try it out and give us their feedback
Release to pilot wikis Iteration based on testing results in collaboration with testing communities
Discussions with communities 4月/ Announcing the upcoming change and answering questions. This will take 2-3 weeks
Release to all wikis 5月/
  1. Deploy the menu to all logged-out and logged-in users as open by default (all users will be able to immediately collapse the menu) to a small set of wikis
  2. One week later, deploy the menu to all logged-out and logged-in users as open by default (all users will be able to immediately collapse the menu) to all wikis
  3. Change the default typography for logged-out users only
  4. Measure usage of appearance menu across logged-in users and gather additional data

深色模式

阶段 時間段 描述
Technical review 9月– We reviewed ideas for implementation of night mode and decided what implementation we want to use. We reviewed the dark mode gadget, night mode on the apps, etc.
Discussing with communities We started working with technical editors to adjust the community-controlled code (like templates) so that night mode works well.
Pilot release 3月– The first version is only available for logged-in users. On mobile, it's only available in the advanced mode. On desktop, it will be a "beta feature".
Release for all users 未定義 When community-controlled code is adjusted, night mode will be available for logged-out users.

Get involved and Contact

Project evaluation

We will measure the success of this project with qualitative and quantitative methods. In particular, we will be looking at:

  • Research-supported decisions in prototype creation and development
  • Qualitative improvements in readability based on user testing and community conversations
  • At least X% of all sessions longer than Ys who customize typography
    • Note: exact variables TBD
  • At least X% of all sessions use night mode
  • No significant change in reading depth

参考

  1. ↑ Readability research report
Retrieved from "https://www.mediawiki.org/w/index.php?title=Reading/Web/Accessibility_for_reading/zh&oldid=6515474"