Guidelines for making Play To friendly web pages

  • Article

The Windows Play To feature enables users to stream video, music, or picture files stored on their computer to a separate playback device on their home network. Play To is automatically enabled for music, videos, and images in Internet Explorer in the new Windows UI. This topic outlines some tips to ensure that Play To works well with your web page.

Internet Explorer in the Windows UI has a heuristic that attempts to identify the best media item to use as the Play To source. The heuristic favors elements that are currently playing, selected, in-focus, and actively in view. Music and video elements that are 5 seconds or less, and images that are 300x300 pixels or smaller, are ignored by the heuristic and never automatically enabled.

The Play To heuristic works well for simple web pages that only have one primary media element, such as one big photo or one big video. But for more complex pages that have multiple videos or a complex slideshow experience, some help is required from the web developer to correctly identify the best element. Here are some tips to ensure the best possible experience.

Dos and don'ts

  • Set the msPlayToPrimary attribute to true for any audio, video, or image tag that you'd like to always be selected for Play To. For example:
    • <video src="movie.mp4" msPlayToPrimary="true">
    • document.getElementById("my_video").msPlayToPrimary = true;
  • Use the msPlayToDisable attribute to exclude an element from the Play To experience. For example, this attribute can be used to prevent video ads from being selected.
  • Attempt to minimize the number of audio, video, and image elements on a given page.
  • Don't mute audio. The volume should always be greater than 0.
  • Make sure the duration of an audio element is greater than 5 seconds. Shorter audio elements aren't eligible for Play To selection.
  • Ensure that images are at least 300 pixels wide and 300 pixels long. Smaller images aren't eligible for Play To selection.
  • Confirm that all video elements are attached to the Document Object Model (DOM), and are in view. Otherwise, these elements won't be eligible for Play To selection. Note that audio elements don't need to be attached to the DOM. An audio element created by script can be selected for Play To.

Additional usage guidance

  • Elements that are currently playing are preferred over non-playing elements. So elements that are marked as autoplay, or start playing from script, are more likely to be selected.
  • If there are multiple elements on a page, Play To element selection looks for another eligible element once the current element stops playing. So, a playlist can be arranged by starting the next element from script after or shortly before the previous element completes.
  • Audio elements do not need to be attached to the DOM. An audio element created by script is still eligible for Play To.
  • The largest image on the page will be selected. It is possible to have a photo album experience with multiple images on the page, but the desired Play To element should have a significantly larger image than other image elements on the page (or set its msPlayToPrimary attribute to true).
  • Images will only selected if there are no eligible video or audio elements on the page. If an image is the desired target for Play to (and msPlayToPrimary isn't set) ensure that all audio elements are less than 5 seconds long and all video elements are hidden.