Reading/Features/Article lead image

This page is a draft of a proposal for an alternate mobile web view of Wikipedia articles on mobile. The idea focuses on providing quick and easy access to information for readers on mobile, while providing a legible display of media. Below is a description of a proposals where we want to integrate community suggestions, and accommodate community concerns into the idea as it develops.

Current Layout at the top of articles
As a casual reader, this is your first and most common experience on mobile Wikipedia: In other words, this is what everyone sees first every time they come to Wikipedia on mobile web.
 * Last edited by a username
 * Title
 * Icons for Edit and Watch
 * What this article is not about (disambiguation)
 * Issues with the article (not enough citations, current event, etc.)
 * Title again
 * Image
 * Unstructured infobox
 * Start of article text

Problem: There is a lot of interface, and you must scroll before you can understand: am I in the right place? And then, where is the information that I want to know?

Goal
Allow the reader to see the most relevant, readable information about the subject quickly with less distraction.

The design does that by focusing on the image, title, first paragraph, and then the infobox. It shows a consistent layout of image and title together.

This redesign will not change article content.

Summary of proposed changes

 * Display lead image in a crop at the top of page
 * Last edited banner moved to bottom
 * Change icon alignment
 * Display Wikidata description
 * Restyle page issues
 * Restyle disambiguation
 * 1st paragraph moved above infobox

Lead images
The lead image will be displayed in a crop at the top of the page. It is the same image shown in search thumbnails. It helps the reader very quickly tell if they have the right article.
 * Attribution is shown when you click on the image, the same as every other image on the page.
 * Some crops may create issues with pictures of people - cropping into faces. We will work on using facial detection to show the best crop possible.
 * We are working on a way for editors to change the lead image and the crop, see this phabricator task.

Last edited banner moved to bottom
Introducing the "Last edited by [username] 3 days ago" was an attempt to show the human side of Wikipedia, and help readers see that the article is continuously edited. After feedback, we want to rethink this so that the last editor doesn't seem more important than all editors. We also want to rethink other ways that readers can determine if this is a good article besides how recently its been updated. For the time being we will move this to the bottom of the article so that it doesn't distract from the lead section.

Wikidata Descriptions
The description for the Wikidata item will be shown below the title. The purpose is to provide a very quick description that also helps to disambiguate.

Page issues + Disambiguation
These currently take up a lot of space on mobile screens and look unstructured. Giving them a simple, structured styling will give users consistent access to them while de-cluttering the main reading experience.

Moving 1st paragraph above infobox
This allows the reader to quickly start reading the 1st sentences of the article. Both sentences and infobox are important and useful, but this will make the hierarchy more consistent with desktop. It will provide a more readable introduction to the article.

Try it out!
View the prototype. (View 3 different articles by clicking button in lower right corner.)

You can also view most of these features in progress on mobile web by tapping on the left menu, going to settings, and turning on Beta.

You can also view a very similar layout by downloading the Wikipedia app for iOS or android.

We're not done! Help us with feedback and research
Join the discussion on the talk page, voice concerns or alternate ideas. Lets talk more about this proposal on the talk page, and find the best way to implement a better visual display of media in article on mobile.