Beta Features/Hovercards

Jump to: navigation, search

The Hovercards beta feature solves the core problem of users needing to open multiple tabs to gain an understanding of a word in the context of the subject they are reading. With Hovercards, whenever a reader hovers over a link to another article, a short summary of the subject and an image (if available) is shown to them, so that they can decide whether they need to visit that subject more fully before continuing the current subject.

There have been many requests over the years for a similar feature; there are browser extensions (see list) and one heavily used gadget (the more editor-focused Navigation popups) that also exist to solve this problem.

The Hovercards settings panel enables logged-out users to disable it entirely, and enables logged-in users to choose between Hovercards, Navigation popups, or disabling both.

Intended users and objective[edit]

Our primary users are the casual readers who browse around the Wikipedia without any particular goal, simply enjoying reading the articles.

Hovercards will be of use to any user of Wikipedia who browses around the site frequently.

Our product will make it easier to get an overview of an article before you decide whether or not to browse to it. Consequently, the smoothness of the user experience for these users will be increased.

Current design[edit]

Key differences to Navigation Popups[edit]

Hovercards is styled to enable easy reading. Currently, Navpopups' type-size is small and the margins are tight.

  • Create a consistent visual style with the article type treatment.
  • Emphasize the lead images, so a user gets an idea of a term using both text and image.
  • The action set in the gadget feels out of context, hence we need to validate which of those actions are useful for readers and editors.
  • Include the last edited timestamp that we have tested on Wikipedia mobile web, but de-emphasize it.


Open/Close delay timing[edit]

You can change the timing of how fast Hovercards appear and disappear (open/close delay); see Extension:Popups#Show/hide timing for instructions.


If you turn Hovercards off via the cog-icon, you can turn it back on at the bottom of any wikipage with the "Enable previews" link.

Screenshot of page footer showing the "Enable previews" link
Screenshot of page-footer

split this image into 3 images, and update with how it looks now

Logged-out users can turn Hovercards off via the cog-icon (settings saved in cookies or localstorage). Logged-in users who have the Navigation Popups enabled can also turn Hovercards off.

Hovercard settings dialogue. The "advanced mode" is not completed at the current time.

Future priorities[edit]

  • Article titles
  • Reference Tooltips (phab:T67114)
  • Cross-wiki Hovercards (phab:T67117), and subsection links (phab:T65792), particularly for Wiktionary
  • User names
  • Integrate with Navigation Popups

Design mockups for:


Analytics and instrumentation
  • Number of displays of the popup
  • Links followed while popup is displayed vs after popup dismissal
  • Links followed within popups

Greek and Catalan Wikipedia test[edit]

We ran a test where hovercards were turned on by default for Greek and Catalan Wikipedia for a period of 4 months. We have both quantitative and qualitative data for this experiment.

Here is a list of major bugs reported.

Known & documented issues:[edit]

Unknown and need more information:[edit]

  • Text alignment issue in certain scripts
  • Disambiguation text showing in some cases - this is when a page is just using plain indented/italic text instead of a template (e.g.). Or, if the hatnote template doesn't include class="noexcerpt".
  • Half sentences are annoying, people want more text 
  • People are unhappy with animation speed, some want it faster, some slower (replicating the existing Reference Tooltips options, would be best.

Known and hard to solve for

  • Issues with PageImages (…)
  • Map shown without dot (This should be fixed once Max and Yuri are done with the tile server)
  • Reference hovercards (user and special pages too) (Prateek and Bene* are working on a restructure)
  • Sub-section links (TextExtracts)
  • Make it work with Wikidata ( )

Qualtrics Survey Results[edit]

In ~June of 2015?, hovercards were rolled out to all users on Catalan and Greek Wikipedias. They also continued to be a beta feature on english and other wikipedias. During this time, a survey was shown to all hovercards users using a banner recruitment. There were over 1,700 responses, heavily dominated by non-logged in users on Catalan and Greek and logged in users (probably mostly editors) on English. Below are the aggregated results

For first question, users mostly gave positive feedback, but a good amount of issues identified

Questions 2-6 are the qualitative text answers to whatever the user chose for open feedback. We cannot share these answers on wiki, as they have not been vetted to remove potentially personally identifiable information.

Here are some random, contiguous sample rows from those answers:

  • bug:
no se'm tanca una pestanya
Speaking people
Hovercard doesn't go away Browser: Google Chrome Operating System: Win 7
  • other problem:
Encara que deixi desactivades les vistes prèvies i guardats els canvis cada cop que tanco l'explorador i el torno a engegar les vistes prèvies tornen a estar activades. Utilitzo Firefox amb cookies activades. Gràcies. (Catalan. Google translate says: Although longer disabled and previews the changes are saved each time you close the browser and start again previews are back on. I use Firefox with cookies enabled. Thank you." )
δεν μου αρεσουν και με μπερδευουν (Greek. Google translate says "Dislikes and confused"
- |The hover card, doesn't close.
Hover card for Edvard Munch not showing correct information when linked from page Only disambiguation info shown. The problem is with the hover card, as it appears on other articles where 'Edvard Munch' is linked. I am not able to fix this problem.
  • positive feedback:
!que sexplica molt be el text. (Catalan, Google Translate says "Explains very well the text")
διότι δεν έχασα χρόνο να ανοίξω άλλη καρτέλα στον φυλλομετρητή μου (Greek. Google Translate says "because I did not lose time to open another tab in my browser"
És útil per saber si l'enllaç ens porta al contingut que ens interessa. (Catalan. Google Translate says "It is useful to know if the link leads to content that interests us."
These tooltips are awesome!
perfect :)
It is very convenient!
  • suggestion for improvement:
The preview card should disappear INSTANTLY (less than 0.01 seconds) when the mouse cursor is moved away form the hyperlink text. My only guess for giving the preview card some time to disappear is so that the user can move the cursor to the preview card itself and click it to be linked to that article. However, this is unnecessary, (in fact the preview card itself doesn't need to be clickable/linked at all) the cursor is already on the link in the text, ready to click on spot, there is no need to give it time to move to the preview card (and again no need for the card to be clickable).
αυτή η σημαία δεν υπήρχε τότε , αναφερόμαστε στο 1200 (Greek. Google translate says: "this flag was not then referring to 1200" ??
Wikipedia should optionally allow displaying high-quality, low-compression (PNG or 95%+ quality JPEG) versions of images in hover cards on higher-speed connections.
Treu-re el link. No serveix per res (Catalan. Google Translate says "Remove the link. Is useless"
I'd like to know what happened in these epoch.
Users find hovercards easy to use!
Users find hovercards useful!
Users enjoy using hovercards
Users find hovercards simple and easy

Project-level rollout discussions[edit]

Here is where the potential rollout of hovercards is being discussed:

English Wikipedia:

See also[edit]