If in 1994 you’d wanted to understand what our lives would be like right now, you’d still be better off reading a single copy of Wired magazine published in that year than all of the sceptical literature published ever since” was a classic line from an interview in The Guardian with Clay Shirky, one of the foremost thinkers about internet and society. If you’ve never heard of Shirky then read the full piece. Needless to say I agree with him – the internet is changing our society, our politics, in ways we can only just begin to understand.

It’s in that context that I’m doing the website design and strategy for Diane Abbott’s Labour leadership bid.

“From Shirky to Abbott? Is he mad?” you’re probably thinking. Let me explain.

Designing websites for politicians is what I do for a living. But I’ve done too many dull, institutionalised website projects. Sites where there’s scant little thinking about what has to be on the website, no contact whatsoever between candidate and web strategist (it’s all filtered and sanitised by the minions), and web efforts that are just a bolt on to the regular campaign.

So when the chance presented itself to work on Diane’s campaign I seized it immediately. A two-hour intense discussion and training session with her to determine the way forward sealed the deal. Most of the politicians I work for I’ve never even met!

Diane is relentlessly optimistic, amusing, engaging, interested by tech and the internet (tweets are from her, from her iPhone (apart from some automated from RSS)) and she’s willing to see the big picture and not get stressed about the shade of red on her site. Her background in television and the strong imagery of her career are the assets that I’ve drawn upon for the design of her site. The site launched today is powered by WordPress but looks nothing like any other political website yet launched in the UK.

Yet today is only the start. There’s much more information ready to be uploaded, and more interesting innovations ready to go over the next few weeks.

The site raises the bar – it is the candidate online, not simply a precursory coverage of the basics of social media as demonstrated by the other candidates, and it’s a major change from the site Joe Caluori reviewed a short while ago. So for me this is not about Diane as such – it’s more important than that. It’s about looking at how internet politics can be conducted in the UK in the future, how Labour politics can be conducted in future, and as Diane is keen to embrace the future of politics online she gets my vote – and many, many hours of my time too.

21 Comments

  1. I didn’t look at *why* it didn’t validate, just the number of errors reported. You told me it now validated, I checked, it didn’t.

    If you think I’m angry, I’m sorry to have given that impression. Not angry at all, shocked, astonished, etc. all those words I already used. But not angry.

    I don’t write critiques every day no, but if someone sings the praises of a public site that doesn’t seem to have considered accessibility and/or which explicitly works against accessibility, (WordPress is reasonably accessible out of the box, anything that makes it less so has been added to work against accessibility), then yes, I point things out. If I can offer correction I will, but as mentioned I don’t even know how you’ve managed to cause some of the problems. I didn’t even know you *could* break scrolling with the keyboard. BTW, I’ve found that it does scroll with the mouse wheel which I find bizarre! But again, it still doesn’t work for keyboard users.

    I am surprised you say “I know plenty of how to design accessible sites,” I wasn’t trying to be patronising, I honestly did not think you knew much about accessibility.
    With the issues on the site and saying the kind of things I quoted previously and below, I really thought you didn’t know and didn’t care about users with disabilities.

    But, if you think that an accessible website cannot be something other than “a dull blog style site with poor imagery”, then you still have some things to learn about accessibility. Take a look at the new http://bbc.co.uk site, it is neither dull nor has poor imagery (but nor is it as imaginative as Diane’s site), but it *is* accessible, and I can navigate around with the keyboard and fully interact with it.

    A tip: from experience, as well as all the literature, accessibility is *much* easier to build in from the beginning than to try to fix at the end.

    Now I really am done. Ignore me, go fix the site, go, go…

  2. Sorry but this is ridiculous. The page you cite did not validate because there was one, yes ONE instance of a ‘ rather than a “! (now corrected, BTW) This of course is just the same in your mind as a site like The Guardian that causes dozens of errors.

    Two wrongs don’t make a right – true. But I just do not follow the depth of anger you have against this site. Do you write similar critiques in the comments functions of dozens of sites every day?

    I know plenty of how to design accessible sites, and you do not need to patronise me. But I have also done my fair share of dreadfully, crushingly dull sites as well and – I’m afraid – there is a correlation between the two. I could have designed a dull blog style site with poor imagery for Diane – yes, the accessibility is far from perfect, and I will work on these points in as far as I can.

  3. OK. Last time…

    “Large chunk” is not the right word. My apologies for that.

    “not usable at all” is exactly the right word:

    * for anyone who has motor problems , hand tremors, etc
    * for anyone with RSI who needs to lay off the mouse for a few hours everyday
    * for any who has vision difficulties, but not enough to need a screen reader
    * for anyone who doesn’t have working hands, and has to use a sip n puff, or a head stalk, or any other enabling device (all of which emulate the keyboard)
    * for anyone with cognitive difficulties or who is so new to the web, that they only know the grey slider on the right is how you scroll the page.

    Not just for scrolling, but for all navigation, when I tab around the screen so that I can press enter to activate a link (that’s how you do it without a mouse), I cannot see which link I have active at the moment.

    If someone is looking for search on the site, they won’t find it unless they have a mouse and know where to hover it!

    When someone tabs to the comment form, which does have visual feedback in the shape of a flashing cursor, because its hidden behind a transparent overlay, it is difficult to see. For someone with vision difficulties it may be impossible to see.

    That’s how many people.

    You say: “the code validates” – this one doesn’t: http://diane4leader.co.uk/linda-riordan-why-im-backing-diane/ Second one I checked, I stopped looking after that.

    You say: ” Plus if you ever use any websites that make considerable use of Flash then you will – in many circumstances – face the same issue.”
    Are you trying to say “there are worse than this, so it’s ok?”

    You say: “you can get all the content via RSS feeds” — you might as well say “there’s a plan text version”, or “someone could read it out to you”.

    Look, you don’t know me from Adam. Go find someone you know and trust who understands Accessibility and Usability, and show them my comments or just ask them to review the site. Or go do some reading here is my starting place http://delicious.com/mikelittle/accessibility

    Address the issues raised and you will have a crackin’ site that will do a great job promoting a worthy candidate.

    I give up now. I’m done. Peace.

  4. @Mike – here are a few points for you to reply to then…

    “And yet the site is not usable *at all* to a large chunk of Diane’s target audience.”

    OK, back it up then.

    If someone does not have Flash, you get a plain background. If someone has javascript blocked, it does not look especially pleasant, but everything works. If you’re on a mobile device you get a dedicated mobile version. The code validates, so if you have a browser that reads text to you it works. You can get all the content via RSS feeds.

    So your ‘not usable *at all*’ actually applies to those people that have all plugins etc. enabled, but wish to scroll with a keyboard. Can you put stats on how many people that might be? Plus if you ever use any websites that make considerable use of Flash then you will – in many circumstances – face the same issue.

    “This site does not do Diane any favours by excluding people.”

    I do not agree. It has done her plenty of favours by massively boosting the traffic to her site, and getting people to read about her that otherwise would not have done. Designing the site the way it is may be controversial, may have its downsides, but it looks like nothing yet attempted in UK politics.

    There is a shortcoming that you have identified and I acknowledge that. 3 of the other points I have fixed.

  5. @Mike – Wow. You decided to go in with both barrels blazing, eh? Despite the “harsh” message – I’m sure Jon appreciates the bug reports, and will do his best to fix them.

  6. I explained why I was harsh: I’m really not normally that abrasive. But hubris is what I read here: You are proud of a good-looking site that approaches its subject in a different way, your comments are full of pats on the back for you. And yet the site is not usable *at all* to a large chunk of Diane’s target audience.

    I read the story, and immediately clicked through to the site. Apart from the auto-play video with sound – which is always rude (but far too common) and which I could turn off in Chrome, I liked what I saw.

    I started clicking around and reading stories. When I discovered I couldn’t scroll down the page to read the rest of a story with the cursor keys — I was truly shocked! Something so fundamental, something that has worked on the web since 1994, broken! I then went to click on the scroll bar only to find it wasn’t there!

    In this century, to break accessibility and usability in such fundamental ways was just jaw-dropping.

    So, I’m sorry if it seemed that I wasn’t co-operative enough, but I pointed out some major issues, and whilst I would normally suggest fixes, I don’t know how to fix those problems (apart from the validation). I don’t even know how to *break* a website so that the cursor keys don’t scroll!

    Volunteer or not, right now, some of Diane’s visitors cannot use the site:
    * they cannot read the stories,
    * they do not know when they tab around which link they have active, because the visual feedback is gone.
    * they cannot leave feedback if the comment form is below the fold and they cannot scroll the page if they cannot use a mouse,
    * even if they manage to tab into the first field of the comment form, which at least scrolls it above the fold, they may not be able to read what they type as there is a semi-transparent overlay on top of it.

    This site does not do Diane any favours by excluding people.

  7. @Mike – further…

    Seems I cannot manage to make the backgrounds re-size with JS without having JS for the scrolling either. If you know the solution (and you seem to rather think you know what you’re doing – I’m only a volunteer for Diane after all) then do let me know.

  8. @Mike – pity you don’t take the same sort of cooperative approach than other people leaving comments here – all of which I have dealt with in a professional and calm manner. Considering it’s the first time you ever comment here and accuse me of hubris…

    Anyway, on the specific points:
    -> Keyboard and scrolling issue now fixed, scroll bar colours off
    -> Skip movie link moved to the top
    -> Site now validates (have not checked every single page – if there are more major flaws then let me know)
    -> Twitter link corrected

  9. This is harsh because I’m astonished at the hubris displayed here.

    I cannot use the site with a keyboard — try scrolling through some of the longer stories. Complete accessibility fail.

    Why are you bypassing the browser scroll bars? Replacing them with a visual element that looks like site decoration?
    Complete usability fail.

    I cannot click on the skip movie link because the social media/subscribe overlay obscures it in Firefox. Complete usability fail.

    The site does not validate! Complete standards fail!

    The twitter link on the social media overlay leads to a 404! Need I go on?

    Fix the site before you start patting yourself on the back. This site does not raise any bar. It fails on far too many levels, it especially fails Diane because too many visitors are excluded.

    Mike

  10. @Leon – thanks!

    @Paul – this is only the start… so some ideas from you for the next steps to develop it further would be most welcome!

  11. Paul Evans

    Love it! Really great implementation Jon. Glad you’re working with Diane – I was hovering around really to offer a bit of help if it were needed but I don’t think I’d ever manage anything as good as this.

    On backing Diane’s campaign though, great minds……

    http://nevertrustahippy.blogspot.com/2010/05/why-i-hope-labour-mps-nominate-diane.html

  12. Love it! Great website, a refreshing change, well done Jon. 😀

  13. @Eurogoblin – fair point in HTML 5. That’s a bit far down the to-do list though!

    Favicon now added.

  14. Great site – I love it! Maybe an HTML5 player could help with Flashblock / iPad users? And (completely nitpicking, I know) a Labour favicon wouldn’t go amiss. But it’s great to see a candidate experimenting online! Hope it’s a success!

  15. Yes, there’s a skip movie cookie as well, so you don’t get the video time after time… Click the logo at the top and then it clears the cookie and it re-plays.

    Altering the skip button – it’s on the list of many things to fix! 🙂

  16. & importantly, how these candidates can increase their breadth and confuse rather than conform stereotypes one may hold of them.

  17. K, turned off flashblock, got it running (there are some cookie based redirects so it doesn’t automatically show if you’ve seen it before?). Automatic playing with audio is something I always dislike, partially as experience of dialup dying was what prompted me to use flashblock in the first place, partially as I was doing some research at work once and couldn’t find the tab that was talking to me when the boss walked in; it was legit research, but annoying…

    (not as bad as the site I found on the same way with an embedded IM client on the frontpage that auto connected you to a sales team member who presumably gets fedup with people hitting the site by mistake and leaving the tab open for a bit).

    Anyway, “it doesn’t have to be that way”? Isn’t that a direct quote from Clegg? Oh wait, she says “same old way”, still, close enough 😉

    But yes, removing the ‘skiop movie’ flash would be good, especially if it’s a page I’ve already got past.

  18. It’s a file called background.swf that plays a file called diane.flv. If Flash is not installed you should just get a black background… Ideally then it should remove the ‘Skip Movie’ button – will do that when I find a moment.

  19. Now that is a different implementation. Problems, because, y’know…

    Frontpage has a Flash video of some sort. I have flashblock, so it doesn’t run or display, but, for the first time ever, I can’t just click the ‘f’ to get the flash to display anyway, I can.t figure out what’s causing it, and if I turn off CSS it isn’t there at all.

    I dislike the use of flash within designs, but recognise it can have uses, some way of dealing with that problem (especially I suspect a problem for JS blockers and iPad users as well as me) is good, some sort of background image is good.

    Beyond that, nicely done, not sure I, personally, like it, but given I’m definitely not the core audience, my personal preference matters less.

    If I had a vote, it’d be between her and MiliEd at the moment, but she’s the only one I’ve much respect for or could see us working with long term, so hope it helps.

  20. Nice site!

  21. Wow! Impressive website Jon! Well done!

Leave a Comment

Your email address will not be published. Required fields are marked *