Jump to Content

Posts Tagged ‘WordPress’

the art of web accessibility – Year One

October 27th, 2009 by Steve | No Comments | Filed in art of web accessibility update

I just realized that I’m fast approaching my one year anniversary of blogging about web accessibility. Time sure flies! I’ve learned a lot about the subject, discovered many very impressive, admirable figures through other blogs and social media like Twitter, and all around have had a lot of fun.

Here are just a couple of the lessons and insights I’ve gained about web accessibility, blogging, and developing a web presence in general. I’ll be posting more over the days leading up to November 12th, one year after I made my first entry.

Blogging is not as easy as it sounds
I figured that getting into a routine and blog-blog-blogging away would be a breeze. I’ve since learned  that effective, consistent blogging is a commitment. The challenge of posting often — but posting quality material — can be overwhelming.

I asked a few bloggers what the magic number is for volume of posting. I got one answer that 2-3 per week was a good, realistic goal. Another answer was 2-3 per month. The former struck me as too much; the latter too infrequent.

I set my own goal to be one post per week. There have been stretches of time I’ve been really good about it; there have been plenty in which I’ve faltered. In particular, since late July I’ve really slowed down. Life, work, and all that good stuff gets in the way.

WordPress is awesome
My foray into blogging showed me firsthand how great WordPress is. From the easy-as-can-be dashboard to slick plugins like Akismet (holy cow does the spam come pounding at the gates!), All in One SEO Pack, Sociable and Bookmarkify, WordPress really has impressed me.

All I did was find a simple enough theme, and work my own design into the markup and CSS. In the matter of a couple days, my blog was designed and ready to go. Using GoDaddy as hosting made it even easier, since WordPress is one of many applications they have an auto-download feature for.

Currently, I’m trying WordPress as a CMS for a non-blog site I’m designing and creating, for a freelance project. In that scenario, it’s been easy going as well.

Google Analytics offers a whole lot for a free product
Despite never having been a “math guy”, I’ve always had a weird fascination with stats and numbers. When I was a kid, I used to run entire seasons of a made-up 30-team baseball league with Micro League Baseball II on my Mac Plus. Not only that, I manually kept track of all the stats for  every team, every game! Similarly, to this day, one of the aspects I dig most about games like Madden NFL is the tracking of stats season to season

I’m glad that I set up Google Analytics right away on this blog. My traffic has been modest, and goes up and down (currently down because of the aforementioned mini-hiatus I’ve taken!), but it’s always interesting to track how many visitors I’m getting, what countries they hail from, what keywords they are using, and what browsers and operating systems power their journey.

“web accessibility iphone” and “expedia accessibility” have by far been my top keywords, but 664 total have enabled visitors to reach this neck of the woods.

More thoughts and insights to come soon. For those of you reading this entry, I give tremendous thanks for the time, attention and interest!

Share This Post:
    Twitter Facebook Digg del.icio.us StumbleUpon Google Bookmarks Technorati LinkedIn Design Float Diigo FriendFeed Ping.fm Yahoo! Bookmarks

Tags: , , ,

Making this WordPress Site More Accessible

March 18th, 2009 by Steve | 2 Comments | Filed in art of web accessibility update, Web Accessibility 101 series

As I eluded to in my post about getting accepted into the Guild of Accessible Web Designers, I had to make some edits to this site to strength its overall accessibility.

Some of these changes stemmed from WordPress limitations and others were just things I missed or wasn’t aware of. All in all, though none of the changes were out-of-this-world complex or obscure, it was an excellent learning experience for me. While this site’s accessibility no doubt isn’t “perfect” yet (is such a thing possible?), I feel better knowing that I’ve made definitive strides forward.

Here are some of the changes that were recommended to me by GAWDS:

Skip Navigation option
This is perhaps less of a must-have on a site like mine without header navigation, but it is advisable to provide an option at the top of your site for skipping straight to the main content.

Screen readers read from top down, and as such, when a visually-impaired navigator hits each page of a site, he or she has to hear the navigation spoken aloud before getting to the meat of the page. Providing the ability to skip past that to the meaningful content makes the experience much more straightforward and less tedious.

What I did: I added the “Jump to Content” anchor link you see at the top right of this page.

Proper Header Order
Correct usage of header tags (<h1>…<h2>…<h3>…etc) provides greater accessibility on a couple fronts. One, screen readers like JAWS offer a key command for reading off headers in order. They also announce the number of headers up front.

The WordPress template I’m using followed proper procedures like having only one <h1> tag, and subsequent <h2> and <h3> tags. However, there were a few instances, based on certain content showing in certain situations, where <h2> was missing. Skipping from an <h1> to an <h3> can cause confusion for screen reader users.

What I did: I straightened out some of the inconsistencies to ensure that on all pages of this site there is one <h1> followed by <h2>’s. I didn’t find the need to go beyond <h2>’s.

Link Focus
For those navigating through a site via a keyboard, making it obvious what link they are focused upon is good accessibility. The unformatted dotted-line box around the focused-upon link isn’t the most visually discernible, across the major browsers.

What I did: I chose a distinctive orange color to clearly denote what link you are focused on when you tab through the site.

a:focus, a:active {
text-decoration : none;
background: #ffce00;
}

Color Contrast
When you have text on top of a background image or solid background color, if there isn’t a strong enough contrast between the respective colors, certain visual disabilities such as color blindness may prevent users from properly differentiating the elements.

WCAG 2.0 call for a minimum contrast ratio of 4.5:1 (3:1 for large text).

What I did: Using an online contrast ratio calculator, I followed the most stringent Level AAA WCAG requirement by ensuring that my “the art of web accessibility” header text was at least a 7:1 ratio from the blue cloud background image.

Likewise, I made sure that my aforementioned link focus background color adhered to a 7:1 ratio from the text on top of it.

Ambiguous Linking
Last and certainly not least, the WordPress usage of “No Comments” or “X Comments” linkage for all blog posts is a link that provides no clear-cut direction as to where it will take the user. Links on the same page should also be worded uniquely and specific to the target.

When you see “No Comments”, you don’t intuitively know that clicking on it is your avenue to posting a comment on a specific topic, much less when there are 5 identical “No Comments” on the same page.

What I did: Given the handy code below, I changed the offending link in the Main Index Template so that, as you can now see on any post on this site, it reads something like “Comment on X topic”. That way, it is more obvious from the link that clicking on it takes you where you can post a comment on the specific post “X topic”.

<?php if('open' == $post->comment_status) : ?><p
class="comment_link"><?php comments_popup_link('Comment on
'.$post->post_title, '1 Comment on '.$post->post_title, '% Comments on
'.$post->post_title,'postcomment','Comments are off for
'.$post->post_title); ?></p><?php endif;?>

I made a few minor tweaks here and there, but these suggestions from GAWDS were very helpful and set me in a good direction for making this site closer to practicing what it preaches.

Share This Post:
    Twitter Facebook Digg del.icio.us StumbleUpon Google Bookmarks Technorati LinkedIn Design Float Diigo FriendFeed Ping.fm Yahoo! Bookmarks

Tags: , , , , , , , , , , ,

Guild of Accessible Web Designers

March 10th, 2009 by Steve | 2 Comments | Filed in art of web accessibility update

Guild of Accessible Web Designers logo
I’m excited to say that today I was accepted into the Guild of Accessible Web Designers. Upon submission of my application, I received a number of suggestions on how to make the art of web accessibility more compliant with WCAG 2.0.

As I’ve mentioned, I knew when I went the content management system route that I was putting my accessibility, in part, in others’ hands….and I really appreciated getting some meaningful feedback from an accessibility expert. And again, to their credit, WordPress does seem to take accessibility seriously.

And so, I knocked out the problem areas (I may recap them in a future post) and my application was approved.

Though I still would rank myself as more of a novice in web accessibility, I’ve learned a ton in the past months. In the time to come, I’ll be learning a lot more!

Share This Post:
    Twitter Facebook Digg del.icio.us StumbleUpon Google Bookmarks Technorati LinkedIn Design Float Diigo FriendFeed Ping.fm Yahoo! Bookmarks

Tags: , , ,

Accessibility and Content Management

January 13th, 2009 by Steve | 4 Comments | Filed in Content Management

Experienced web designers and developers control their own destiny when building sites from scratch, as it relates to web accessibility. How much (or how little) they choose to adhere to accessibility standards depends on their coding acumen and knowledge.

That’s fine and well for web site development from the ground up, but many people are opting to use trusted content management systems (CMS) for blogging, site upkeep, etcetera. I myself have been in the web industry for over a decade, but opted to use WordPress for this blog instead of taking the extra time to come up with something from scratch.

When you utilize such products, accessibility is at the mercy of their developers, not you, especially when it comes to custom templates.

For starters, let’s look at three of the big players in free CMSs, and see how they tackle the issue of web accessibility. At a later date, I’ll cover some of the bigger commercial tools, such as SharePoint.

WordPress
(accessibility statement
WordPress states that it is, out of the box, web accessibility compliant. However, and it perhaps should come as no surprise, it cannot stand behind how well or how poorly people who create their own WordPress templates keep that accessibility intact.

Their accessibility standard then proceeds to do a nice job providing basic guidelines for template creators, covering topics such as alt and title tags, color blindness, browser and mobile considerations, and testing for accessibility. 

Joomla
(accessibility statement)
 Joomla’s accessibility statement appears to be somewhat dated. It states that Joomla’s front end will be web accessibility compliant, as it pertains to WCAG and Section 508, by version 1.5 (which has been out for some time now). However, beyond that, there is no confirmation or detail about the efforts they have or will make.

It then explains how the coding necessary to make the back-end WCAG compliant is intensive and requires ground-up rework, and therefore is targeted to be tackled in the 2.0 versioning.

Like WordPress, Joomla cannot stand by the accessibility of templates that 3rd parties create.

Drupal
I was unable to find an accessibility statement for Drupal, but there is an Accessibility Group. Therein are articles and posts discussing various accessibility tips and topics. Drupal by its nature is very clean and simple — so while I haven’t ripped the cover off enough to get a true feel for its accessibility, the prognosis is positive.
 

If you have any experiences with these or other free CMSs, as it pertains to web accessibility, please feel free to share. I myself have used WordPress (as this blog would indicate!), and soon will be using Drupal and/or Joomla for projects. I’ll delve deeper in a follow-up post later on.

Share This Post:
    Twitter Facebook Digg del.icio.us StumbleUpon Google Bookmarks Technorati LinkedIn Design Float Diigo FriendFeed Ping.fm Yahoo! Bookmarks

Tags: , , , , , ,