Partager via

Optical Zooming in Legacy Document Modes

  • Article

Internet Explorer 9 introduced sub-pixel font positioning as part of its hardware-accelerated
rendering of HTML5 content as described in
this IEBlog post. That was an important step into the future as it enabled
zoom-independent text metrics—an important characteristic when pinch-zoom is part
of the browsing experience as it is in IE10 on Windows 8 touch-enabled devices.

As noted in that post 18 months ago, IE9’s legacy compatibility modes use whole-pixel
text metrics. This compatibility-driven decision continues in IE10 with IE5 quirks,
IE7 standards, and IE8 standards modes all running with whole-pixel font metrics;
IE10 document modes Standards, Quirks, and IE9 Standards all use sub-pixel text
metrics.

As a result, the text in sites running in legacy document modes 5, 7, and 8 does
not scale smoothly when the page is zoomed by pinch-zoom, double-tap zoom, or when the page is auto-zoomed for display in Windows 8’s snap and fill views.


Zoom Example: Legacy vs. Standards Modes

Below are side-by-side comparisons showing text from a popular news site in 8 and
10 document modes at 100% and 150%. Note the especially poor letter spacing between
some letters in the 150% 8 mode example (upper right).

Default size (100%) Optically zoomed to 150%
8 Sample text in IE8 mode at 100% Sample text in IE8 mode using GDI-compatible font metrics at optical zoom 150%
10 Sample text in IE10 mode at 100% Sample text in IE10 mode using sub-pixel font metrics at optical zoom 150%


Move to Standards Today

The best fix for this behavior is to move your pages to IE9 or IE10 Standards mode.
IE10
Compat Inspector is a valuable tool to help you migrate to IE9 or IE10 mode.
Compat Inspector identifies potential issues and offers steps you can take to resolve
them. In general, the HTML, CSS, and JavaScript markup and code you use with other
browsers will work great in IE10 once any browser detection is replaced with
feature detection and vendor-specific CSS prefixes are updated to include
-ms- or unprefixed versions. Modernizr is a
JavaScript library that can help with these issues.


Specifying Sub-pixel Metrics in Legacy Modes

If moving to standards-based markup is out-of-scope for your site at this time,
you may enable sub-pixel text metrics in legacy document modes using an HTTP header
or <meta> tag. Based on our testing, most sites will work fine with natural text metrics.

The format of the HTTP header is:

X-UA-TextLayoutMetrics: Natural

The syntax of the <meta> tag is:

<meta http-equiv="X-UA-TextLayoutMetrics" content="natural" />

Support for this HTTP header and <meta> tag are new in the final
release version of IE10 on Windows 8.

To improve the Windows 8 out-of-box experience for touch-enabled devices, we’ve
added a <NaturalTextMetrics> section to the
IE10 Compatibility View List that enables natural metrics for approximately
570 popular sites that currently run in legacy document modes. If your site is included on
the list but you would prefer it not be, email iepo@microsoft.com.
Include your name, company, title, and contact information along with the domain
you want removed.


Be Ready for IE10

Move your legacy document mode site to IE9’s default standards mode today and be
ready for IE10 tomorrow. Visitors to your site using IE10 on Windows 8 will thank
you.

—Ted Johnson, Program Manager Lead for Web Graphics

Comments

  • Anonymous
    August 28, 2012
    I think your choice of text to display this example should be re-thought.

  • Anonymous
    August 28, 2012
    Hey, good job making a technical article a political one! (sarcasm)

  • Anonymous
    August 28, 2012
    IE10 for Windows 7? Should we wait for it or switch to Chrome/Firefox/Opera?

  • Anonymous
    August 28, 2012
    yawn Let me know when I can try it in Windows 7.

  • Anonymous
    August 28, 2012
    You should probably wait until IE10 is actually out

  • Anonymous
    August 28, 2012
    IE10 is out. The final build was released with Windows 8 to MSDN and TechNet on August 15th. I've already installed it on 16 machines. However, at multiple user requests, I have reverted all but three of them to Windows 7. IE 10 is great, but Windows 8 on a desktop is a very disappointing experience.

  • Anonymous
    August 28, 2012
    When is Internet Explroer 10 turned Windows 7 released? He is interested rather than Windows 8.

  • Anonymous
    August 28, 2012
    Hey guys ... you need to talk Windows 7 support. Seriously.

  • Anonymous
    August 28, 2012
    It should have been obvious I meant the official release date.  Microsoft told us there wouldn't be a Windows 7 release until after the RTM came out, it probably means they are working on the conversion process right now and will either release a windows 7 RTM as soon as possible, or just wait for the release date since its too late for us to submit bug reports anyway.

  • Anonymous
    August 28, 2012
    @"@Max&quot; That would be rather sad, if I may say so. It would mean IE10 was never designed for any existing operating system, and now it needs a backport. By comparison, Firefox 14 can do everything IE10 can (to reasonable boundaries) and also runs on Vista and XP. Microsoft has no technical reason for IE10 to work only on Windows 8, even for now.

  • Anonymous
    August 28, 2012
    If a W7 version of IE10 will appear then it will be just using the new rendering engine that is in IE10 for W8. No time to introduce any significant changes to the UI.

  • Anonymous
    August 28, 2012
    Modernizr, the JS library that creates (or at least used to create) w WebGL context on every site? Anyways, could you give us numbers on the popularity of the document modes?

  • Anonymous
    August 28, 2012
    Another thing, is there a way to force all sites to render with natural font rendering, just like one can force all sites to be in Standards mode? Also, what about desktop applications that use the IE control?

  • Anonymous
    August 28, 2012
    Why did you choose to disable ClearType in IE10 and use grayscale instead?

  • Anonymous
    August 28, 2012
    "Move your legacy document mode site to IE9’s default standards mode today and be ready for IE10 tomorrow. Visitors to your site using IE10 on Windows 8 will thank you." Is that an announcement? :)

  • Anonymous
    August 28, 2012
    Who cares, really? Text rendering? Come on! IE is like the Sleeping Beauty: unfortunately the prince will never come, because he's having great time with othe princesses who are - apparently -not sleeping. Like Chrome, Firefox and even the little ugly, Opera.

  • Anonymous
    August 28, 2012
    @Ben, Opera? Ugly? Chrome is more ugly than Opera. Your talking just if the IE-team is doing nothing. But actually, they are doing a great job with IE9+.

  • Anonymous
    August 29, 2012
    Doesn't support WebGL so I recommend everybody to use a different browser.

  • Anonymous
    August 29, 2012
    Disabling ClearType regardless of user choice is stupid. Combing vertical hinting and vertical subpixel positioning in optical zooming is double stupid. You may choose between clarity and shape accuracy but never ruin both at the same time. Typical Microsoft incompetence in typography.

  • Anonymous
    August 29, 2012
    The comment has been removed

  • Anonymous
    August 29, 2012
    @WebGLStats The IE team said cleary that they're very supportive of web standards. So you can be sure that IE10 will support HTML5 WebGL.

  • Anonymous
    August 29, 2012
    What is the difference if any between the pinch zoom, the ctrl scrollwheel zoom, and the zoom on the internet options menu?

  • Anonymous
    August 29, 2012
    Unofrtunately IE10 has a regression with SVG zooming. To be precise with loading page with SVG while being zoomed. connect.microsoft.com/.../754310

  • Anonymous
    August 29, 2012
    The comment has been removed

  • Anonymous
    August 29, 2012
    The comment has been removed

  • Anonymous
    August 29, 2012
    @Gilbert You should try out IE10 in Windows 8. You'll be shocked, when you see how bad the fonts look.

  • Anonymous
    August 29, 2012
    Fonts look great in Windows 8. It's the rest of the OS that's garbage.

  • Anonymous
    August 30, 2012
    Fonts DO look awesome on Windows 8, JUST LIKE THE REST OF THE OS!!! If you don't like it, don't use it. Windows 7 will be supported till 2020 you know.

  • Anonymous
    August 31, 2012
    What's wrong with the example text?

  • Anonymous
    September 04, 2012
    Developers of the HP company did tests for period of operation of notebooks from accumulators and noted interesting feature that the operation resource from the accumulator is more on that than notebooks where Internet Explorer 9 on the average worked for 15 % in comparison with other browsers. -- www.law-us.blogspot.com

  • Anonymous
    September 04, 2012
    The comment has been removed

  • Anonymous
    September 06, 2012
    >2012 >Still waiting for non-existant IE10 for Win7 I SURE HOPE YOU GUYS DON'T DO THAT

  • Anonymous
    September 10, 2012
    i hope if i switch to 10 it wil work better and faster