Reading/Web/Design

About
Since mid 2016 and the design team of the Reading department has been working on enhancing the UX (user exprience) and UI (user interface) of Wikipedia mobile site. Design for Reading Web is an evolving effort. This page is updated with design related projects that the team is working on and the changes that have been made.

The reading web, design related phabricator board is where you can keep track of the progress of the tasks, while below, is a list of all changes that are proposed, need discussion, planned, or in current implementation.

Ongoing
We are actively working on smaller and bigger projects and could use your feedback in providing better solutions.

1. Improve Article Notes
Status:

Problem statement: Orient reader about the subject of the article at first glance. Evaluate the position of lead paragraph, redirect information, hatnotes, and page issues.

More information on Phab

2. Improving Print styles

Status:

Problem statement: Provide readable and eco friendly way of printing wikipedia articles. Include Wikipedia wordmark in print styles.

More information on Phab

3. Add Wikipedia Wordmark on Mobile website

Status: Planning

Problem statement: New readers research a lack of awareness around wikipedia as a brand. We need to raise awareness around the fact that readers are reading articles on Wikipedia.

Placeholder Phabricator card

Recent Changes
1. Improve language switching

Status: ✅

Problem statement: It was difficult to switch languages on Wikipedia on phones.

More information

2. Improve colors to comply with WCAG 2.0

Status: ✅

Problem statement: UI colors used on Wikipedia weren't WCAG compliant for contrast.

More information

3. Improve footer for MobileFrontend

Status: ✅

Problem statement: separation of chrome and content was an issue on article layout. We started fixing it by improving the footer of wikipedia with better alignment of elements and creating space for future footer elements like Related Pages More Information