Web Pages That Suck - learn good web design by looking at bad web design

The HTML 5 Test is a really cool site that tells you how much HTML 5 support is built into your browser. With Apple screaming “We have the best HTML 5 support” I thought it would be logical to visit The HTML 5 Test and see who’s the real winner.

I went on Monday, June 7, the day Safari 5 was released. I went back on Tuesday and discovered that the test had been revised. The original test had 160 possible points, while the current test (released on Wednesday) has 300. I’ve broken the tests down by New (300 point scale) and Old (160 point scale). The score does not include bonus points

Google can claim they beat Apple and offer better HTML 5 support, but that’s if you’re using the 6.0 developer version, which most of you shouldn’t be using.

Apple can claim they beat Google and offer better HTML 5 support with the current stable releases, which is probably a more accurate claim.

The truth is support is still pretty crappy. Speaking of crap, Microsoft’s IE 7 and 8 are POS when it comes to HTML 5. Yeah, yeah, yeah, I know IE 9 is so much better, but nobody in their right mind would test it on their production machine. That’s assuming their production machine isn’t running XP because IE 9 won’t work on XP.

I’m too curious. I installed the IE 9 Platform Preview on my Vista laptop. IE 9 isn’t really a browser, but more of an HTML viewer. For one thing, you can install it alongside another version of IE. That’s really, really difficult to do in the real world.

As you see in the scores above, IE 9’s HTML 5 support is less than IE 8, but greater than IE 7. I’m not impressed. Here’s a screenshot showing the new, still limited support.

Submitter’s comments: My friend sent this to me when she was looking into the college. You would think with all the money they get from tuition they would be able to afford a web page that wasn’t made by an 11-year old boy.

Vincent Flanders’ comments: I could excuse the page if it were designed by an 11-year old. I should excuse it because it’s for an art school but, because some irresponsible dickhead doesn’t understand that flashing colors could cause seizures, I have to make it a Daily Sucker. Oh. The word “irresponsible” in the phrase “irresponsible dickhead” is an unnecessary modifier.

What in the hell was s/he thinking? Hopefully, outing them might cause the page to be changed.

Yale School of Art (WARNING. Could cause seizures)

Vincent Flanders’ comments: For some reason, I decided to look at the White House’s home page. The top part of the page looks fine but, as I went down the page, the old bugaboo about contrast popped up. It’s especially problematic because the White House has a link at the bottom of the page that discusses accessibility . Ironically, the link is hard to read because of the lack of contrast.

I ran the page through AccessColor and was told:

Both color difference and color brightness do not meet the recommended standard for 2.88% of the total text.

Either color difference or color brightness does not meet the recommended standard for 20.77% of the total the text.

Text on background with images is for 47.93% of the total text. (Which makes it impossible for them to figure out the contrast levels.)

Here’s a screen capture of the results for those who don’t want to rerun the test.

As far as how well the site performs, I ran the home page through Zoompf and here were the results:

Here’s a screenshot of Zoompf’s analysis.

On a more positive note: Whitehouse.gov scored 72 (C) on Yslow and scored an 81 on Page Speed.

Whitehouse.gov

I hate forms. In fact, if I’m not mistaken, WPTS is a form-free zone. However, they’re insanely important for most sites and here’s “Best Practices in Form Design,” a free, downloadable, 133-page PDF (4.37Mb) from the guy who wrote the book on forms.

Download the PDF

Today, April 20 — which is Hitler’s birthday — seems like a good time to talk about a disturbing trend in web design.

Read the article