SNAP!

Wednesday, 2 January 2013

I’ve been using the (Metro-style) Internet Explorer 10 on my Surface RT for two months now, and must agree with Microsoft’s recent assertion that it does suck less. Occasionally, I would come across incompatibility issues on websites, but most of the time, my expectations had been met. Of course, this may have been because my expectation levels were lowered due to past encounters. I don't know. Then, I started testing this website on IE 10. Suddenly, it's as though last 11 years never happened and the year was 2001. That is, it started to suck again.

A challenge I set myself during this website's development was to become familiar with responsive web design. As I don't find Windows RT to be a mature enough environment (yet) to do any serious development work, I developed first for Chrome on a PC. Ethan Marcotte ensured my responsive layouts worked as intended immediately. I was pleased, but knew any plans to celebrate must be deferred until the site was tested successfully on IE. Traditionally, to reach that milestone required significant effort and patience, usually with questionable and uncomfortable solutions. But, it had been sometime and numerous versions of IE since I last did any development work, and so I was hoping things had changed. Unfortunately, any hope I had was immediately crushed.

As before, the issues were eventually fixed (no thanks whatsoever to IE's developer tools, which are really no match on Google's) but I'm still puzzled by 1) why it was broken in the first place and 2) how the workarounds actually worked. Some things never change. So, after optimising the site on IE for Windows 8 Desktop and Windows Phone 8, I confidently approached Windows RT testing, expecting celebrations to be imminent. After all, it is the same browser, albeit with an interface optimised for touch. Once again, I was wrong.

It was important the layout adjusted sensibly when in a snap state, especially when snapped to 320 pixels wide. Instead the layout scaled to fit the available space, similar to viewing a non-responsive website on a phone. As it was behaving responsive on Windows Phone 8, I was confused. My natural inclination was to re-evaluate the CSS, anticipating the discovery of a basic rookie error. To my surprise, I couldn't identify any obvious leads. I decided to visit a responsive website in the smaller snapped state, to confirm this issue was specific to my website. Unresponsive. More confused. Visited another. Equally unresponsive. Very confused. Ready to give up, I visited the Microsoft website. I remember the buzz surrounding its responsive re-design. Responsive. WTF.


Mashable's responsive website's snap-fail

Fortunately, Google introduced me to Tim Kadlec, who was enlightening:

To get IE10 in snap mode to play nicely you have to use CSS Device Adaptation.

Moreover, the non-standardised meta viewport element, advised by Ethan Marcotte, isn't supported. AHA! Kadlec explains Microsoft was motivated by adhering to standards. Admirable. But, judging by my own experience and looking around the web, I'm becoming more and more worried that Internet Explorer 10's experience is being severely compromised because the web isn't optimised for it. So much so, that I've become genuinely worried whenever my girlfriend picks up the Surface to surf the web. Not knowing where she will browse to causes anxiety. I want her to have good impression of Windows 8/RT. But, I know that is at risk every time she opens IE 10 on the Surface. She has no reason to settle for something that 'sucks less' or is 'good enough' even. Not when better is available elsewhere. This feeling of uncertainty actually applies to Windows RT as a whole. There are good moments. There are bad moments. When it's good, it's great. But, when it's bad, I worry.

In the last 24 hours alone, I've witnessed four separate examples of worrying behaviour in IE:

  • Tried to log in at Readability. Log in popup opened. On-screen keyboard appeared. Inputted a character into the username field. No input was registered. On-screen keyboard hid. Couldn't login. (Note: with my Touch Cover, I had no problems logging in.)
  • Tried to update my Yahoo! account's contact information. Tapped "Save". Nothing. Tapped again. And again. Still nothing. Tapped "Cancel". Nothing at all. Couldn't update my Yahoo! contact details.
  • Tried to organise my Flickr photos. Was told I might have Javascript turned off or an unsupported browser. Was encouraged to change to a recent version of a browser that would work. Last on the list was "Internet Explorer (for PCs)". Visited the same page on RT's Desktop IE. Same apology. Same advice. Couldn't organise my Flickr photos.
  • Friend tried to book a flight with Etihad Airways. Tapped the calendar icon to open its popup. Opened up in a new tab. Tapped on a date. No feedback was visible. Switched back to the Etihad tab. Date hadn't changed. Unhappy iPad friend. Embarrassed Surface host. Couldn't book an Etihad flight.

In fairness, I've no idea if these are reproducible issues on Mobile Safari or Chrome for Android. In any case, I do empathise with the IE team's current predicament. They admit it sucked. They now claim it sucks less, and is actually good now. But for a moment or two every day now, I'm being reminded of the past, leading me to question how much is 'less'. It may not be enough to persuade me to move away from Chrome when given a choice (i.e. Windows 8), but I think it's enough for developers to at least acknowledge it. I mean, if it took me one Google search and five lines of code to desirably snap mtrostyle.net on Windows 8, I don't understand how established websites haven't done likewise. Seriously. Why?

Unlike any other version of Windows, including 8, Windows RT is as good (or bad) as Internet Explorer. Developer support is essential if IE aims to deliver the best experience. Right now, it can be better. Much better.

LET'S GO HOME