How Windows 8 touch relies on IE10

Internet Explorer 10
Windows 8 touch depends on Internet Explorer 10

Is the full-screen touch interface for Windows 8 'just a shell' on top of Windows?

Not really; there isn't an application running like Media Center that you could shut down and it isn't just a browser – this is another mode for the interface that you can switch in and out of. But it is the browser that powers it.

Apps for the immersive Windows 8 interface are written in HTML5, JavaScript and CSS (and presumably, Silverlight – this is the IE10 engine and there's no reason for it not to run plug-ins) and packaged up in an AppX container.

In fact, if you dig into the web standards support that Microsoft has added to IE10, it's clear to see that despite the resemblance to the Silverlight-powered Windows Phone 7 'Metro' interface, the layout of this new user interface is the biggest reason for adding those standards now.

One standard that Microsoft added to IE9, Media Queries, is always suggested as a way to have one web page display appropriately on different-sized screens – not just shrinking the page but reflowing the layout and adding or removing extra details to fit.

Media query

IE9: Media Queries change the layout of the page as you resize it

The IE Test Drive demo for Media Queries shows a page of pictures optimised for a smartphone, a netbook and a notebook or desktop: the images change size, lose the headline and caption and switch from a grid layout to a stack.

That's exactly the same change you see in the News application in the Windows 8 touch demo: when the app is full screen, you get large thumbnails with captions underneath them and the heading for each section has several links.

The layout is the same when another app takes up a slice of the screen, but when you slide the News app over so it takes up a smaller area, you only get one image and heading in each section and the images turn into small thumbnails to make room for the caption.

It's the same with the video player; as the window gets smaller the video doesn't just get resized – the layout changes with the title appearing underneath it, along with the playlist. That's exactly what you'd expect from an interface based on Media Queries.

Windows 8

WINDOWS 8: When the News app is full screen, you get a page of large images…

Incidentally, Media Queries let you change the layout of a page based on the orientation as well as the size. So far we've only seen the Windows 8 immersive user interface in landscape format, but we've also only seen it on a breadboxed ARM system that would be pretty hard to pick up and rotate, so it's still entirely possible that there will be a portrait version of the interface.

ARm

NEW LAYOUT: Drag the video player to take most of the screen and the News layout changes completely

Media Queries retrieve different layouts and views of the page from the server depending on the window size but getting a flexible layout in the first place takes a combination of three web standards only introduced in IE10 – including one that Microsoft came up with and only proposed to the W3C group that standardises HTML in April.

Windows 8 big nrews

VIDEO THUMBNAIL: Give the News app more room and the video player changes layout instead

Contributor

Mary (Twitter, Google+, website) started her career at Future Publishing, saw the AOL meltdown first hand the first time around when she ran the AOL UK computing channel, and she's been a freelance tech writer for over a decade. She's used every version of Windows and Office released, and every smartphone too, but she's still looking for the perfect tablet. Yes, she really does have USB earrings.

Latest in Pro
cybersecurity
What's the right type of web hosting for me?
Security padlock and circuit board to protect data
Trust in digital services around the world sees a massive drop as security worries continue
Hacker silhouette working on a laptop with North Korean flag on the background
North Korea unveils new military unit targeting AI attacks
An image of network security icons for a network encircling a digital blue earth.
US government warns agencies to make sure their backups are safe from NAKIVO security issue
Laptop computer displaying logo of WordPress, a free and open-source content management system (CMS)
This top WordPress plugin could be hiding a worrying security flaw, so be on your guard
construction
Building in the digital age: why construction’s future depends on scaling jobsite intelligence
Latest in News
Quordle on a smartphone held in a hand
Quordle hints and answers for Sunday, March 23 (game #1154)
NYT Strands homescreen on a mobile phone screen, on a light blue background
NYT Strands hints and answers for Sunday, March 23 (game #385)
NYT Connections homescreen on a phone, on a purple background
NYT Connections hints and answers for Sunday, March 23 (game #651)
Google Pixel 9 Pro Fold main display opened
Apple is rumored to be prioritizing battery life on the foldable iPhone – which could also feature a liquid metal hinge for added durability
Google Pixel 9
The Google Pixel 10 just showed up in Android code – and may come with a useful speed boost
L-mount alliance
Sirui joins L-Mount Alliance to deliver its superb budget lenses for Leica, DJI, Sigma and Panasonic cameras