Improving accessibility of this blog

I’ve been studying accessibility. After reading a whole bunch of stuff I decided I should try to make my blog as accessible as reasonably possible. This blog post chronicles some of the changes I’ve made. If this helps you enjoy my blog more, please do let me know. If I made anything worse, please also let me know 🙂

Different wordpress theme

This new theme features:

  • High-contrast design (good old black-on-white)
  • relative font sizes in CSS
  • reasonable serif font
  • clean “pure” CSS for layout
  • layout/ordering of elements of html on the page is reasonable

Different theme configuration

Some of the changes:

  • Re-ordered the widgets
  • Replaced the calendar widget with a list of archived posts
  • Added more descriptive titles to the widgets
  • Changed the custom HTML for the RSS link (relative font size, alt tag for icon)
  • Stop using drop down menus for lists of links
  • Made the blog tagline more descriptive

I also tried replacing the search widget with something more reasonable but failed to hack that up. If someone from wordpress could please make it resemble something like

<form method="get" id="search_form" action="https://lsimons.wordpress.com/">
    <div>
        <label for="s">Search:</label><br />
        <input type="text" name="s" id="s" />
        <input type="submit" value="Go" />
    </div>
</form>

that would be great. Or, if someone knows how to do an accessible search box on a wordpress.com blog, please let me know 🙂

Secondly, it would be nice if the theme could be modified to have “skip to content” and “skip to navigation” links, which I seem to have no way of doing myself.

Change of blog contents

Some of the changes:

  • Fixed some bits of broken HTML
  • Added reasonable (descriptive but less than 100 characters) alt tags to images
  • Replaced use of <h4> with <h3> in blog post contents (so that the header structure goes h1 – h2 – h3 properly)
  • Cleaned up the page navigation to have just Home and About pages
  • Cleaned up the About page, in particular getting rid of the strike-through links which seems to be a subtlety that is easily lost when using a screen reader

“Doing” accessibility using tools

I got rather depressed a couple of years ago with the complete lack of tool support, and basically just gave up. Recently I talked to some front-end engineers at the BBC (which cares a great deal about accessibility) who gave me some useful pointers. Tool support has now gotten a lot better. You should take a look around!

Here’s three links:

  • WebAIM WAVE, an accessibility validator. I feel this validator is much better than any of the others; for example it doesn’t accuse me of using ASCII art when it encounters a block of java code. It also doesn’t sounds like a stern kindergarten teacher or some haughty user experience expert.
  • Fangs, an easy-to-use firefox plugin to do “screen reader emulation”. Basically it processes a web page and then spits out text that is roughly what a screen reader would say.
  • WebAIM Screen reader simulator, gives you an idea of what a screen reader does, good to try if you’ve never seen an actual screen reader in action.

Dive into accessibility

If you’ve never bothered about accessibility before but you’re interested now, I suggest you start your reading with Dive into Accessibility, a free online book with lots of clear practical advice by someone that knows his stuff and actually builds websites out there in the real world. From the introduction:

Don’t panic if you are not an HTML expert. Don’t panic if the only web site you have is a personal weblog, you picked your template out of a list on your first day of blogging, and you’ve never touched it since. I am not here to tell you that you need to radically redesign your web site from scratch, rip out all your nested tables, and convert to XHTML and CSS. This is about taking what you have and making it better in small but important ways.

How to dive into online social media marketing

  1. Familiarize yourself with social media:
    Get a blog,
    Get on twitter,
    Get on facebook,
    look at what your competitors are doing,
    engage in conversations online,
    read the cluetrain manifesto
  2. Decide that you want to do it:
    Social media strategy advice directed at consumer companies

    1. participation
    2. integration
    3. syndication
  3. Decide what you want:
    What do you hope to accomplish?
    Who will execute on your social media strategy?
    How will they do that? What do they need?
  4. Get started with free tools:
    Define a blog policy,
    encourage employees to blog,
    Start a company blog, link to employee blogs
    Start a company twitter account, follow your customers
    Start a company facebook group, befriend your customers
  5. If you want to customize your existing website, consider buying a vendor solution:
    Forrester analysis of social networking platforms, with process explained

    1. “forrester wave” defined
    2. primary analyst talking about analysis
    3. start of analysis
    4. aside: criticism of SaaS
    5. aside: SaaS a way to circumvent IT
    6. conclusion:
      go with KickApps or Pluck
    7. register to download forrest report PDF
    8. list of white label social networking platforms
  6. Let me know how it works out!

Moving blog location (again)

I stopped updating my blog a while ago, because the publishing system behind it broke, and I could not be bothered to fix it. Solution: get some blog hosting.

So, there’s my really old blog about Australia (in Dutch), my old blog at jroller, and my self-hosted blog, and now there’s this one. I’ve tried to see if it was feasible to merge all that old stuff into this new one, but it’s really too much of a hassle (wordpress doesn’t really do XML very well).

Thanks to FeedBurner, my feed url does not change.