Get ready for plug-in free browsing

Internet Explorer 10 is one web platform that provides two browsing experiences: the new Windows Internet Explorer in the new Windows UI optimized for touch devices, and the traditional browsing experience of Internet Explorer for the desktop. As a Windows Store app, Internet Explorer 10 runs without plug-ins so that you have a clean, fast, and secure web browsing experience, though it does provide a native Flash player. By removing plug-in dependencies from their sites and opting instead for analogous standards-based technologies, web developers can benefit from better site interoperability and easier maintenance. Here we offer guidance and strategies for preparing your sites and web applications for plug-in free browsing in Internet Explorer 10.

Plug-ins and the modern web

Browser plug-ins are compiled third-party software components that extend the functionality of web content by calling into low-level browser interfaces. In Internet Explorer, plug-ins take the form of ActiveX objects and Browser Helper Objects (BHOs). Two commonly used plug-ins on the web today are the Adobe Flash Player and Skype Click to Call, which on Internet Explorer install as a Microsoft ActiveX object and a Browser Helper Object (BHO), respectively. Other common browser plug-in technologies include Microsoft Silverlight, Apple QuickTime, and Java applets. Like Flash, these technologies provide an application framework and runtime for web developers to write plug-ins that extend the functionality of their sites and web applications.

From the early history of the web, browser plug-ins have played a vital role by enabling rich online multimedia experiences and complex web application functionality. However, along with these capabilities, plug-ins can come with a number of disadvantages. Because plug-ins are essentially applications that run inside the browser, they consume additional system resources and expose additional attack surface to security risks. Also, plug-ins are not designed for touch, and because they are separate applications from the browser itself, they don't benefit from any changes coming with Internet Explorer 10 that make websites work smoothly with touch. Finally, plug-ins are based on proprietary technologies and are written with variable code quality, making it difficult to predict or control their support across different browsers and operating systems.

Fortunately, the web has come a long way since its early days, and standards-based technologies specified the World Wide Web Consortium (W3C) like the ones comprising HTML5 offer similar capabilities to various plug-ins. These technologies have strong support across modern web browsers, making it possible for web developers to write the same markup and script that works across all modern browsers, without writing or maintaining any additional code that has third-party framework and runtime dependencies.

Essentially, standards-based, plug-in free websites benefit:

• Consumers, with better performing browsing experiences, longer battery life on mobile devices, and increased security, privacy, and reliability;
• Web developers, with wider site interoperability across browsers and devices, better forward-compatibility, and overall easier site maintenance; and
• The modern web, by promoting and populating a more open, accessible, and vendor-neutral web.

For these reasons, Internet Explorer 10 on Windows 8 provides a plug-in free experience, and an ever-growing number of top sites around the world do too. There is already a considerable number of consumer devices and browsers on them that do not support plug-ins. Despite these trends and benefits, some consumer sites and line-of-business web applications might still require plug-ins. The last section of this article discusses fallback techniques and mitigation strategies to help users easily switch to Internet Explorer for the desktop to view plug-in dependent sites.

Going plug-in free

Windows Internet Explorer 9 and Internet Explorer 10 for the desktop also provide a way to view the web without plug-ins using ActiveX filtering. Because Internet Explorer 10 on Windows 8 runs plug-in free, it provides a great test bed with which to develop new plug-in free sites and convert plug-in dependent sites to use standard technologies.

The following table summarizes the most common uses of plug-ins, examples of older plug-in based technologies, and their standards-based equivalents available in Internet Explorer 10.

Video and audio

One of the most common uses of plug-ins is for embedding rich audio and video content in webpages using media players like the Flash Player. However, that trend is now changing with the development of the HTML5 video and audio specifications and their growing support across modern browsers. Support for the HTML5 video and audio elements has been available since Internet Explorer 9. Internet Explorer 10 adds support for the proposed HTML5 track element for video captioning. The next section, "HTML5 video ", discusses how to use HTML5 video in detail.

Graphics

Plug-ins have also been used to provide animated and graphically-rich interactive games and multimedia advertisements. Since Internet Explorer 9, Internet Explorer offers a host of standards-based,hardware-accelerated graphic technology alternatives, including HTML5 canvas , SVG, and CSS3 2D transforms . Internet Explorer 10 adds support for SVG filter effects, CSS3 transitions and animations, and CSS3 3D transforms.

Offline storage

Many web applications require access to data files, and in the past, this meant requiring access to remote servers storing these files. But this, in turn, requires network connectivity, and in order to be viable alternatives to desktop client applications, web applications need to also work offline. Plug-ins like Java applets and Google Gears initially stepped in to fulfill the offline storage needs of web applications, but now W3C standards-based alternatives are available. Web storage has been supported since Windows Internet Explorer 8, and Internet Explorer 10 introduces support for File API, IndexedDB, and the Application Cache API, opening up all kinds of new possibilities for building offline experiences.

Network communication, resource sharing, file upload

Modern websites and apps are all about social interactions and sharing, which often requires that separate websites are able to safely and swiftly communicate and upload and share data. In the past, developers have sometimes needed to use plug-ins like Flash for making cross-domain HTTP requests when the Internet Explorer XDomainRequest object could not provide the functionality they needed. In other instances, developers might have used a Flash- or Silverlight-based plug-in when their web applications required support for multiple file uploads, uploading files on a background thread, or displaying file upload or download progress. All that has changed with Internet Explorer 10, which supports the Cross-Origin Resource Sharing (CORS) standard for XMLHttpRequest (XHR), XHR progress events, and web workers. In the area of HTML5 Web Messaging , IE8 introduced cross-document messaging with the postMessage method and onmessage event, and Internet Explorer 10 adds support for channel messaging.

HTML5 video

The future of video on the web is HTML5; however, there are several things to keep in mind as the related standards are being defined and browser vendor implementations converge on baseline levels of support.

Encoding

There are three major video encoding formats supported by the HTML5 video tag: H.264, VP8, and Theora. The H.264 format, also known by the .mp4 file format, is the most widely used video encoding format on the web today, and in addition to the HTML5 video tag, is also supported on every Blu-ray digital video disc (DVD) player, most Flash and Silverlight players, and a significant share of mobile devices. There are other benefits to the H.264 format as well. You can use video taken directly from your camera on the web without having to encode it. Also, H.264 video has vastly better hardware support than any other video codec, making it possible to get great HD video performance on a low-end machine with H.264 decoding happening directly in the CPU. The same video in a different encoding might likely require additional software support to run and thus be much slower and power intensive.

Not all the leading browsers have built-in support for the H.264 format. Currently the Firefox and Opera web browsers only natively support the VP8 (or .webm file) and Theora (or .ogg file) formats. However, Mozilla is on the cusp of supporting H.264 in Firefox in the near future. To work around these differences and ensure that your HTML5 video works across all these browsers, the best practice for now is to provide multiple encodings of your video with the HTML5 source element. For example:

<video id=”video1”>
    <source src=”slideshow.mp4" type="video/mp4">
    <source src="slideshow.webm" type="video/webm">
</video>

This table summarizes the primary HTML5 video formats and their current levels of support across major browsers.

1IE support for playing .webm videos doesn't require a browser plug-in, but does require users to install the free VP8 codec for Windows.

2Google Chrome plans to drop H.264 support in the future.

3Mozilla is on the cusp of natively supporting H.264 in Firefox in the near future.

To make sure your HTML5 video and audio plays across different browsers, see "Practical Cross-Browser HTML5 Audio and Video".

Streaming and Digital Rights Management (DRM)

Video can be either live or on demand (that is, played from a file on a web server). HTML5 video currently supports only the latter. Specifically, HTML5 video plays media files that are transferred via HTTP from a server to the browser client, where they are played in the video element. Although this download is stored as a temporary file and is not evident to the user, the fact that the video file now resides on the client computer has obvious implications for intellectual property. With HTML5 on-demand video, users can easily save the video file (by right-clicking and selecting Save video as...) or find it in the browser's disk cache. HTML5 video does not currently support content protection.

Additionally, the HTML5 specification does not currently provide a standard mechanism for live streaming (or adaptive bandwidth) video. Just recently the International Organization for Standardization (ISO) standardized the specification for Dynamic Adaptive Streaming over HTTP (DASH), an alternative to the existing, proprietary, adaptive streaming technologies that are used over the web today. However, DASH is not yet supported by many servers and clients.

In scenarios where content protection, adaptive streaming, or both are necessary, a video player plug-in that supports these features would typically be required. Because the Internet Explorer 10 browser for the new Windows UI doesn’t support plug-ins, however, a viable alternative might be to create your own Windows Store app, register it to handle specific content like live video streams, and then use it to start one of these video players in a webpage.

Using plug-ins as a last resort

For optimal future proofing and browser compatibility, it's best to develop your site entirely without using plug-ins. In some cases, however, it might not be possible for a website or web app to work completely without plug-ins. In these instances, there are some fallback techniques and mitigation strategies you can follow to ensure the best possible experience for users of Internet Explorer 10 and other plug-in free browsers.

Selectively serving up plug-ins

There is no programmatic way to know if your website or app is being viewed on Internet Explorer 10 in the new Windows UI or on the desktop: the IE10 user-agent string is the same. However, this is not a useful distinction anyway, as both experiences run off the same HTML5 and script engines, and Internet Explorer for the desktop might be running with ActiveX filtering. When planning your plug-in free fallback strategy, the best practice for ensuring site compatibility across Internet Explorer 10 experiences and other plug-in free browsers is to detect features instead of browsers. Using feature detection, your site can check if a particular feature is supported in the client browser, and if not, offer plug-in based functionality in its place.

This example uses HTML element fallback to provide a plug-in solution for browsers that don’t support the HTML5 video element.

 
<video id="video1" width="640" height="360" controls>
    <source src="video.mp4" type="video/mp4">
    <source src="video.webm" type="video/webm">
    <object width="640" height="360" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0">
        <param name="SRC" value="http://ie.microsoft.com/testdrive/IEBlog/Common/player.swf?file=video.mp4">
        <p>Please update your browser or install Flash</p>
    </object>
</video>

This next example uses JavaScript-based fallback to provide a plug-in solution for browsers that don’t support native XMLHttpRequest (XHR).

// Best Practice: Use Native XHR, if available.
if (window.XMLHttpRequest) {
    // If IE7+, Gecko, WebKit: Use native object.
    var xmlHttp = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
    // ...if not, try the ActiveX control. 
    var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else {
    // No XMLHTTPRequest mechanism is available.
}

Conversely, if your site offers a richer experience with a particular plug-in, you could check to see if the plug-in was loaded, for example via the readyState property of its host object element, and then fall back to a plug-in free experience as needed. For more info and code examples on fallback strategies, see "Plugins and ActiveX controls" in the "Internet Explorer 10 Compatibility Cookbook ".

Using the Compatibility View (CV) list to play Flash content

On Windows 8, Internet Explorer 10 provides an integrated Flash Player, removing the need to download or install an additional player. While any site can play Flash content in Internet Explorer for the desktop, only sites that are not listed in the NoFlash section of the Compatibility View (CV) list can play Flash content within Internet Explorer in the new Windows UI. (Being listed in the NoFlash section does not affect a site’s document mode.) Sites with Flash content are only placed on this list if they have known security or reliability issues. Developers can also request that their site is considered for removal from the CV list for Flash. For more info, see "Developer guidance for websites with content for Adobe Flash Player in Windows 8".

Switching to the desktop when all else fails

To ensure forward-compatibility for your site and the best experience for the widest user audience in the long term, it's best to build new sites and retrofit existing sites without using plug-ins. In cases where this is not possible, consider either migrating your site to a Windows Store app or writing code for a Windows Store app using a custom Windows Runtime object in place of the functionality provided by the plug-in, and then connecting your site to your Windows 8 app.

In the short-term, Internet Explorer 10 provides the requiresActiveX feature switch that, if enabled, displays a notification prompting users to switch to the desktop:

Use the requiresActiveX switch only when the lack of a plug-in would break your website. Here is how the notification works:

• Notifications are displayed one time per hostname visit, per browser tab
• The notification appears again if the user refreshes the page
• The notification doesn't block the user from interacting with the site (it is non-modal)
• Pages loaded in sub-frames will not trigger the notification

Providing your users with the option to switch to Internet Explorer for the desktop is a short-term mitigation for site-compatibility issues, and not a long-term solution. The desktop browsing experience and most plug-ins were not designed for smaller screens, battery constraints, and no mouse.

This table lists the different ways you can enable the requiresActiveX switch.

Keep in mind that Windows RT, doesn't support running, emulating, or porting existing x86/64 desktop apps. The Building Windows 8 blog provides more information.

HTTP header and meta tag

As a web developer, you can enable the requiresActiveX feature switch either by using this HTTP header:

X-UA-Compatible: requiresActiveX=true

<meta http-equiv="X-UA-Compatible" content="requiresActiveX=true"/>

Compatibility View list

Microsoft maintains a Compatibility View (CV) list of known sites that require ActiveX. These sites can be listed by domain or subdomain. For example:

<domain docMode="EmulateIE7" featureSwitch="requiresActiveX:true" versionVector="7" uaString="7">contoso.com</domain>
<domain docMode="EmulateIE7" versionVector="7" uaString="7">
    fabrikam.com
    <path docMode="EmulateIE7" featureSwitch="requiresActiveX:true" versionVector="7" uaString="7">/tv</path>
    <path docMode="EmulateIE7" featureSwitch="requiresActiveX:true" versionVector="7" uaString="7">/video</path>
</domain>

A separate, hostname-only compatibility view list is supported via Group Policy to trigger the same notification as the one triggered based on Microsoft’s public CV list.

You can use F12 Developer Tools to determine if your site is on the IE CV list. If your site is listed as “requiresActiveX:true” but you’ve recently eliminated its plug-in dependency, the IE10 compatibility list setting can be overridden with an HTTP header or meta tag specifying requiresActiveX=false. For more info about the CV list, see "Understanding the Compatibility View List".

Getting your site ready for the plug-in free web

An ever-increasing amount of websites, web apps, browsers, and devices are going plug-in free, to the benefit of consumers, web developers, and the modern web as a whole. The best practices for preparing your sites and web apps for plug-in free browsing in Internet Explorer 10 are to replace critical plug-in functionality with standards-based technologies, selectively serve up plug-ins only when there are no standards-based alternatives, and only prompt users to switch to the desktop as a last resort. By following these guidelines, you can provide the best possible browsing experience for the widest possible audience and ensure that your site works great with Internet Explorer 10.

Related topics

ActiveX Filtering for Consumers

Browsing Without Plug-ins

Windows 8 browsing and plug-in free HTML5

Web Sites and a Plug-in Free Web

iOS to IE10: Building Cross-Browser Plugin-Free Experiences

Send comments about this topic to Microsoft

Build date: 6/14/2013