Archive for the 'Web Standards' Category

The great Internet Explorer 8 controversy

So, the Internet Explorer team has proposed that as of IE8, if you want the latest and greatest features you’ll have to opt-in. (Note: Microsoft have changed their mind.) You can do this by way of an http-header, or using a meta-tag:

<meta http-equiv="X-UA-Compatible" content="IE=8" />

I can see under­stand why they’ve chosen this direc­tion. IE6 was absolutely chock-full of bugs, but was left to stagnate for so long that web-developers began to rely on it’s quirks in order to make pages render correctly. Eventually IE7 came along and fixed many of those bugs. Consequently, many pages that were reliant on IE6 bugs broke in IE7. Microsoft don’t want to see that happen again.

The rest of the world doesn’t seem so keen on the idea. The web has gone wild, shout­ing about the myriad technical problems. Representatives from Mozilla (Firefox/Gecko), Apple (Safari/Webkit) and Opera have all said they don’t like the idea (and won’t be imple­ment­ing it in their browsers). The big issue that stands out for me isn’t technical at all though. It’s education.

Getting the word out

Somehow, Microsoft need to get the word out to exist­ing web design­ers and developers. They need to tell newcomers to the industry. They need to let educat­ors know. I’m strug­gling to see how they’re going to do that. Why?

A quick look around the SitePoint forums reveals that people are still tripping up on using the doctype element to switch between quirks and stand­ards modes (the last attempt at provid­ing backwards compat­ib­il­ity to legacy web pages). They were first intro­duced with Internet Explorer 5 for Mac the best part of a decade ago. Over the years, every major browser has taken up the techno­logy, count­less people have blogged about it, written tutori­als on it, put it into knowledge bases, included it in web design books, podcas­ted it, and people are still strug­gling to get their heads around it.

I reckon Andy Budd hit the nail on the head:

No matter what great leaps forward the Internet Explorer team make from now on, the major­ity of developers won’t use them and the major­ity of users won’t see them. By doing this the Internet Explorer team may have created their own backwa­ter, shot themselves in the foot and left themselves for dead.

Things move quickly on the web

Of course, while I was writing that, the story developed a bit further.

It turns out that using the new HTML5 doctype will trigger the new super-standards-mode in Internet Explorer 8. What’s more, Ian Hickson thinks he knows a way to make an HTML5 compat­ib­il­ity layer for IE7 (see the last paragraph).

My inter­pret­a­tion? Microsoft are trying to make HTML4 and XHTML1 legacy formats (unless you specify other­wise with the X-UA-Compatible header) and push HTML5 as the stand­ard for content going forward. I’ll be very inter­ested to see how all of this plays out.

Lemurs

Katemonkey has gone and rendered everything I’ve written here irrel­ev­ant: The “X-UA-Compatible” Controversy — As portrayed by toy lemurs.

Some time later…

Microsoft have decided to do the right thing: IE8 now will use standards-mode by default.

@media Europe 2007

It was @media Europe 2007 last week and for me it was the best yet. Patrick and his team of merry oompa-loompas put on a great show.

The present­a­tions were fantastic this year. Particular highlights for me were those from Richard Ishida, Jon Hicks and Dan Webb. I took a lot of good stuff away from each of them.

It was also a privilege to see Molly E. Holzschlag (who recently announced her retire­ment from the confer­ence circuit), Joe Clarke (who announced his retire­ment from Web Accessibility) and Håkon Wium Lie, who showed off the $100 Laptop.

Outside the present­a­tion halls, it was great to catch up with old friends again and lovely to meet new people. Hopefully I’ll see you all again soon. It was only slightly weird when the bouncer at Metra told me he’d voted for the Threadless tee I was wearing.

I was begin­ning to feel a bit down about the whole web thing, so it’s really good to leave @media feeling enthused, inspired and full of fresh knowledge. Big thanks to every­one who made it what it was and here’s to the next one!
(more…)

Internet Explorer combination float bug

So, I’m creat­ing a layout that looks something like this:

Picture of a three-column web-page.

It’s a fairly simple three-column layout. The thing is, I’ve used some funky negat­ive margin trick­ery to swap the first and second columns (so that the HTML is displayed in the correct order for non-CSS user agents).

Unfortunately, IE6 renders this:

Picture of IE getting a three-column web-page wrong.

…except in some hard-to-reproduce circum­stances when it gets it right.

It turned out to be a combin­a­tion of bugs, which made it ever so slightly diffi­cult to track down. First up was The IE Doubled Float-Margin Bug. Adding display: inline; to the CSS for the floated columns appeared to just make the problem worse, but was in fact needed to correct the issue.

Once that was in place, the page was only correctly rendered once I’d moused over certain links. It took me quite some time to figure out what was going on: IE was incor­rectly calcu­lat­ing the funky margins: Instead of basing them on the width of the floated column’s parent element, it was working them out from the body element. I figured that out because the render­ing was slightly differ­ent depend­ent on the width of the window.

The solution was to wrap yet another element around the outside, and set the width there too.

I’ve created a simple test-case that explains the solution for the anybody else that runs into the issue.

Crimes against HTML: Best practise and the CMS

I’ve been evalu­at­ing some content-management systems recently. We’ve got a few require­ments that rule out a lot of them straight off: It’s got to be a .net system, be able to run over SSL and be very secure, have decent version­ing, document manage­ment, audit trails and so on. There aren’t many products out there quite fit our needs.

We’re currently working with one (I’m not going to name names here) which has a document manage­ment compon­ent that looks something like this:

DocLib.gif

It’s a simple tree-view that works very simil­arly to Windows Explorer. Believe it or not, to build that simple box they’ve used twelve nested tables, a div, a span, endless inline styles, javas­cript: URIs and even a made-up HTML attrib­ute (view the full horror). Even if you don’t know HTML, you can see that it’s overkill. Apart from one on the outer-most element, it’s lacking any useful IDs or class-names for me to hook into with my style-sheet.

I know I’m a mark-up purist, but really that’s just taking the piss. Accessibility? Search-engine friend­li­ness? Page load-time optim­isa­tion? Nope, never heard of them. It’s alright though, it does AJAX.

It’s no wonder that so many corpor­ate web-sites have appalling mark-up when this is the state of the default output from the “enter­prise level” CMS products that drive them. If web stand­ards and best practise are going to go truly mainstream, we’re going to have to reach out to the developers of these products and nudge them in the right direction.

I’ll leave you with this exerpt from Bruce Lawson & Patrick Lauke’s talk at the multipack’s Geek in the Park event:

Legal & General… made their site access­ible because they were worried about the legal risk.

And they found as side effects: 30% increase in natural search engine traffic, a signi­fic­ant improve­ment in Google rankings for all their target keywords, a 75% reduc­tion in time for pages to load, access­ible to mobile devices, their time to manage content reduced from an average of five days to half a day per job, they saved £200,000 a year on site mainten­ance, they got a 95% increase in visit­ors getting a life insur­ance quote (which was the purpose of that site), a 90% increase in sales online, and 100% return on invest­ment in 12 months. And that was the side effects of making the site accessible.