A website unfit for a queen

Warning This article was written over six months ago, and may contain outdated information.

To great fanfare, The Queen, in the company of Sir Tim Berners-Lee, unveiled the new British Monarchy website today. Unfortunately, what they unveiled was a real dog’s dinner.

Royal.gov.uk highlights the worst elements of the practice of web development; on only the second page I visited it became obvious that the site hasn’t been tested on any browser other than Internet Explorer, and a peek at the source code left me shocked.

The testing is the most obvious fault; the comparison shots below (IE7 is first, FF3 second) immediately betray the lack of cross-browser coding. Click each image to show a full-page screenshot.

Screenshot detailScreenshot detail

And the coding… oh my word. The markup is just plain terrible; completely non-semantic, it uses the div element to wrap everything. Everything. No joke. Page headers, text paragraphs, lists… everything. And I found closing body and html elements halfway through the document! See for yourself.

It just shows a fundamental lack of care.

Inline styles and JavaScript are used liberally throughout the site, including that persistent offender, the inline JS menu hover:

<div style="margin-left:0px;" 
class="BPL_MenuLevel0" 
OnMouseOver="PAL_MenuHover(this,true);" 
OnMouseOut="PAL_MenuHover(this,false);" 
id="TREE_972F516DD8244C8F8267312C9F26F3C2">
<a href="/TheRoyalHousehold/WorkingfortheRoyalHousehold/Whoarewe.aspx">Working for the Royal Household</a>
</div>

The home page fails HTML validation with 10 very basic errors, including <script language="javascript"> instead of <script type="text/javascript">; an internal page taken at random fails with a whopping 82 errors.

I know that legacy systems can sometimes be restrictive and lead to invalid HTML, but I find it hard to believe that any developer worth their salt would continue to use a CMS which could produce so many egregious contraventions of standards. If inline JS & CSS and massively nested divs are the best a system can manage, better to implement a new one.

The underlying structure of this site is badly dated; we stopped writing code like that ten years ago. It’s a poor flagship site from people who can afford better, and an embarrassment to Sir Tim to be associated with it.

9 comments on
“A website unfit for a queen”

  1. I know that legacy systems can sometimes be restrictive and lead to invalid HTML

    Now, it’s not as if the client was short of a bob or two ;)

  2. That is deeply, deeply bad. Any idea who’s behind it?

  3. Looks like a hasLayout bug to me. Nothing a good ol’ overflow: auto; can’t fix on the container. Either way I must admit Whitehouse.gov is winning the battle of the sites.

  4. Maybe she got one of her grandchildren to do it on the cheap?

  5. @Ade: Trying to find the name of the responsible party so I can see their other work; no-one’s taken credit as far as I can see, however.

    @Neal G: Whitehouse.gov & Number10.gov.uk are miles ahead on this. Perhaps an allegory for democracy vs monarchy ;)

  6. That site actually reminds me of what sites were like when content management systems first became popular – very boxy and impersonal.

    Run a quick TAW check on their accessibility page!

    Browsercam is your friend.

  7. Just spotted this in the Telegraph:

    Despite being set up with the help of Sir Tim Berners-Lee, dubbed the father of the World Wide Web, each royal engagement published on the British Monarchy Website is listed on the wrong day, 24 hours behind.

    The Prince of Wales and Duchess of Cornwall could face a lonely reception in York this Thursday where they are due to launch a new steam locomotive, since avid royal watchers are currently informed by the site that they will still be in London.

  8. Oops! I don’t suppose you have a link to that article do you, Heather?

  9. Hi Peter – here.
    http://www.telegraph.co.uk/news/newstopics/mandrake/4632685/Queens-website-is-behind-the-times.html