Page MenuHomePhabricator

Page previews should display custom preview for disambiguation pages
Closed, ResolvedPublic5 Story Points

Description

Background

Preview for disambiguation pages should be able to display relevant information, including a list of the most common disambiguations

Most lead paragraphs/summary/intro paragraph of disambiguation pages is non-empty and 1 sentence about what the primary article topic. which is actually repeat of the hatnote.

for e.g. i read this hatnote >

and then the first sentence of disambiguation is

this is a common pattern in all the cases I have seen so far.

The other prominent use case is this

here, another page tells what this page is about. it's a twisted joke on content design :)

in most cases finding useful and non-redundant content from disambiguation page is difficult. a generalized approach would be explaining what the link will do as shown in the mockup.

Proposed design

Use our empty state like page preview to convey that this link is about a page that relates to multiple pages

Thinking: WMF design principle says "Content first"
Here's how it might look. similar format as the empty page previews

Zeplin spec and SVG asset https://zpl.io/Z25qbra

Note: Use the same styles from empty page previews like this -->

Acceptance criteria

  • When a user hovers over a disambiguation page, a page preview should appear including the following elements:
    • Text: "This link may refer to multiple pages. The disambiguation page will provide a list of these pages"
    • Link: "View disambiguation page"
  • Add disambiguation as a previewType in popups schema
  • Update schema to 17807993 and update previewType sent for disambiguation previews

Developer notes

The REST summary will return type for non-cached pages.

e.g.

"type": "disambiguation",

https://en.wikipedia.org/api/rest_v1/page/summary/John_Smith can be used for testing.

Open questions

Q: From Jan: Is a disambiguation page preview a "virtual page view" given there is no summary displayed?

Related Objects

Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes

There are two viable options for disambiguation previews

  1. Show the content from the disambiguation page
  1. Use our empty state like page preview to convey that this link is about a page that relates to multiple pages

Thinking: WMF design principle says "Content first"
based on it, I was inclined to go with the option 1. but... the bigger issue here is actually scraping the "content" of disambuiation page. there are so many different cases that we can't actually scrape content from disambiguation pages that would be useful.

Hence my suggestion (after getting feedback from @ovasileva) that we go with option 2

Here's how it might look. similar format as the empty page previews

I can't help but feel that this is an epic. This requires:

Depends how we define an epic. Is an epic anything with subtasks or something that's over 8 points? Definitely several moving parts to this though.

@Nirzar most disambiguation pages have the wikidata description "Wikipedia disambiguation page". Have you considered falling back to wikidata description when no extract is available? This would also help any pages where there is no lead paragraph and would be a much more general solution. If not why?

most disambiguation pages have the wikidata description "Wikipedia disambiguation page". Have you considered falling back to wikidata description when no extract is available? This would also help any pages where there is no lead paragraph and would be a much more general solution. If not why?

Most lead paragraphs/summary/intro paragraph of disambiguation pages is 1 sentence about what the primary article topic. which is actually repeat of the hatnote.

for e.g. i read this hatnote >

and then the first sentence of disambiguation is

this is a common pattern in all the cases I have seen so far.

The other prominent use case is this

here, another page tells what this page is about. it's a twisted joke on content design :)

in most cases finding useful and non-redundant content from disambiguation page is difficult. a generalized approach would be explaining what the link will do as shown in the mockup.

Jdlrobson updated the task description. (Show Details)Jun 29 2017, 10:21 PM
Jdlrobson updated the task description. (Show Details)
Nirzar updated the task description. (Show Details)Jun 29 2017, 10:25 PM
Nirzar moved this task from Needs Analysis to Triaged but Future on the Readers-Web-Backlog board.
ovasileva moved this task from Backlog to Next Up on the Page-Previews board.Jul 5 2017, 12:37 PM
Jdlrobson changed the task status from Stalled to Open.Feb 22 2018, 10:13 PM

No longer stalled!

Jdlrobson updated the task description. (Show Details)Feb 22 2018, 10:15 PM
Jdlrobson updated the task description. (Show Details)Feb 27 2018, 5:20 PM
Jdlrobson updated the task description. (Show Details)

Does this depend on T165036? Related to T186129.

ovasileva updated the task description. (Show Details)Feb 27 2018, 5:22 PM
ovasileva updated the task description. (Show Details)
ovasileva set the point value for this task to 5.Feb 27 2018, 5:27 PM

Do the open questions in the description need answers?

Second one is good to go, @Tbayer - any thoughts on the first question?

Since that the REST endpoint returns "type": "disambiguation" now, it seems like this feature could be implemented by using the approach suggested by @Jhernandez in T186129. In my opinion, I think that makes T186129 a prerequisite for this task. Thoughts?

I think this task is a part of the rendering of the type page preview, since it uses the same data source and the same of the rest of the pipeline (logging stuff, gateways, etc).

So in my opinion this is independent from T186129: Set up Extension:Popups to support multiple preview types, as it is a different rendering view for the page preview type that uses the summary data source (like the no preview available view).

I'd hope the tasks compliment each other. Definitely consider T186129 when working on this task (to help future Jan if he works on it ;-)) but agree with Joaquin - no need to block on it.

Change 416925 had a related patch set uploaded (by Jdrewniak; owner: Jdrewniak):
[mediawiki/extensions/Popups@master] [WIP] Custom page preview for disambiguation pages

https://gerrit.wikimedia.org/r/416925

@Nirzar not everyone has access to the Zeplin project. Can you make it public or attach the svg to the task?

Jdlrobson updated the task description. (Show Details)Mar 7 2018, 6:11 PM
Jdlrobson updated the task description. (Show Details)
Nirzar added a comment.Mar 7 2018, 8:53 PM

@Jdrewniak Zeplin doesn't allow public boards unfortunately, I have added you to the board.
you can now get the asset

Jdrewniak updated the task description. (Show Details)Mar 8 2018, 7:47 PM

Change 416925 merged by jenkins-bot:
[mediawiki/extensions/Popups@master] Custom page preview for disambiguation pages

https://gerrit.wikimedia.org/r/416925

Jdlrobson reassigned this task from Jdrewniak to ABorbaWMF.Mar 14 2018, 9:51 PM
Jdlrobson added subscribers: ABorbaWMF, Jdrewniak.

@ABorbaWMF I've updating staging with the latest code and set it up so that it uses real world content
http://reading-web-staging.wmflabs.org/w/index.php?title=Spain
If you hover over the disambiguation link at the top of the page you will be able to see the new treatment.

Can you please do a generic QA of other page previews types (e.g. normal links; empty previews when the connection drops) to verify this task hasn't broken anything? Thank you!

ABorbaWMF reassigned this task from ABorbaWMF to ovasileva.Mar 15 2018, 12:09 AM

Looks good on staging




> Can you please do a generic QA of other page previews types (e.g. normal links; empty previews when the connection drops) to verify this task hasn't broken anything? Thank you!

@ABorbaWMF - did you also get a chance to go through these as well?

Looks good to me on staging. Did some testing of various previews on different browsers/OS's.









Deskana removed a subscriber: Deskana.Mar 16 2018, 9:58 AM
ovasileva closed this task as Resolved.Mar 16 2018, 1:49 PM

looks great, thanks all!

Nirzar reopened this task as Open.Mar 16 2018, 7:45 PM

This did not go through design!!!

the icon size does not match the spec given!

please assign designer for sign off for user facing changes

ovasileva reassigned this task from ovasileva to Nirzar.Mar 19 2018, 11:15 AM
ovasileva added a subscriber: alexhollender.

My bad on this one - thought this was done as part of development. Let's note to make this more explicit. Over to you @Nirzar. Or should it go to @alexhollender?

Jdlrobson reassigned this task from Nirzar to Jdrewniak.Mar 19 2018, 2:55 PM

@Jdrewniak can you sync with nirzar regarding https://phabricator.wikimedia.org/T168392#4057519 ? I'd be most grateful as this is train bound!

I think the discrepancy in icon size is due to switching to resourceLoader's image feature for the icons. The icons were switched to used a standardized mw-ui-icon-large icon size, which coincidentally matched the size of the "empty" icon, but made the icons for the disambiguation preview larger than it should be.

I have a feeling that resourceLoaders mw-icon feature shrinks wide icons more than high icons, but I haven't investigated this too deeply. I guess the icon can be shrunk down manually.

Also just noticed, the mock calls for large padding above the icon. Since I re-used the existing "empty" preview, which doesn't have this padding, the white space is missing. Please confirm that we should add this padding to the disambiguation preview and not the empty preview .

empty preview (current)disambiguation previewdisambiguation mock

Also one more thing. I noticed the grey was different on the mock than on the empty preview, so I changed the color to match the current "empty" icon color, @Nirzar can you confirm which is the right color (or if their should be two?)

Fyi there is a small icon size - mw-ui-icon-small and regular (don't use large or small modifiers)

btw this is what I mean about different icon sizes with .mw-icon

Change 420396 had a related patch set uploaded (by Jdrewniak; owner: Jdrewniak):
[mediawiki/extensions/Popups@master] Icon sizes for generic/disambiguation previews made smaller

https://gerrit.wikimedia.org/r/420396

Change 420424 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/Popups@master] Disambiguation icon should be regular mw-ui-icon size

https://gerrit.wikimedia.org/r/420424

Change 420424 merged by jenkins-bot:
[mediawiki/extensions/Popups@master] Disambiguation icon should be regular mw-ui-icon size

https://gerrit.wikimedia.org/r/420424

Jdlrobson reassigned this task from Jdrewniak to Nirzar.Mar 19 2018, 10:51 PM

For icon sign off! You have 30 mins! ;-)

Change 420396 abandoned by Jdrewniak:
Icon sizes for generic/disambiguation previews made smaller

Reason:
Abandoned in favour of 420424

https://gerrit.wikimedia.org/r/420396

Nirzar closed this task as Resolved.Mar 21 2018, 6:30 AM

Macro votecat: looks good