Section508.gov as Analogue to Section 508 Refresh

Screen shot of Section508.gov with Chrome developer tools highlighting outline styles.
Screen shot of Section508.gov with Chrome developer tools highlighting outline styles.

I was thrilled to see the incredibly and wildly inaccessible Section508.gov web site get re-launched recently (here’s an example of the old site from March). The site is dedicated to accessibility information and resources for the federal government and is provided by the GSA. Sadly, the government’s own commitment to Section 508 was accurately reflected in the mess that was the old site.

Unlike the folks at 18F, the GSA team that posts its efforts onto GitHub (but makes no mention of Section508.gov on its own site), the Section 508 site does no such thing. Which means if a user has an issue, that user has to rely on old-fashioned means of being ignored.

I filed a bug on WebCompat (for the old Section 508 site) mostly so that I could track issues without writing a snarky blog post. I also hoped to have a place where I could point someone responsible for the site should I ever find that person.

My satisfaction of seeing the new site was tempered by some obvious issues, so I opted to email the contact listed for the site, Helen Chamberlain (her Twitter account is effectively dead). I wrote an email outlining a keyboard accessibility issue on the home page.

The response, sadly, was spam. Not just a generic spam message, but one that was sent as an auto-reply to my request. With the subject IMPORTANT ANNOUNCEMENT ABOUT THE MICRO PURCHASE COURSE!!!! Re: Issues on new Section508.gov site. You can see my original subject tacked on at the end.

I sent a follow-up note (also asking not to be spammed) and received the same spam.

This morning I also received a response from a human that read as canned as an email could while still responding to me directly. But at least it acknowledged that there is an issue. Sort of.

I feel that this is the perfect analogue to the Section 508 Refresh. Something for which we have been waiting since 2008.

The Emails

For those who are curious about the content of my emails…

My Original Email

Ms. Chamberlain,

I was pleased to see the Section508.gov site has re-launched and is far more accessible than its prior version.

However, there is still an issue with keyboard-only accessibility on the site. When navigating solely with a keyboard, the images do not indicate focus in any way. This makes the home page very hard to use for sighted non-mouse users (this includes many users with physical impairments).

In addition, the title attributes on those images are not adding any value for any users and are potentially going to override the alt text for some of the images.

Finally, the #region-content part of the page is showing a horizontal scrollbar in (at least) Chrome on Windows, probably owing to a percentage width that is just a bit too wide.

I am happy to offer further feedback, code snippets, or have a conversation with your team to help debug and resolve these issues.

Issues on new Section508.gov site; Wed, Aug 5, 2015 at 5:13 PM EST

My Follow-up Email

Ms. Chamberlain,

I did not write for information on Section 508 micro purchase training. I have no interest.

I wrote to offer my congratulations on the launch of the new Section508.gov site with its vastly improved accessibility and to note a couple issues right on the home page.

Since it’s possible my last email did not offer enough actionable detail, let me provide some more:

If you go to the home page and try to navigate using strictly the keyboard, visual focus is lost as soon as you get into the image links in the middle of the page.

You can rectify this with the following changes in the CSS:

In this file:
http://section508.gov/sites/default/files/css/css_7Zm-__T-_BMsdxTKMPHiKgvZwzhQ7yb09IElsrSWiG0.css

Remove this style:
:focus{outline:0;}

In the same file, edit the following style:
a,p,ul,ol,li,img,span,strong,em{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;font:inherit;}

…to remove outline:0; so it is this instead:
a,p,ul,ol,li,img,span,strong,em{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;font:inherit;}

Because the files are minified I cannot offer line numbers (the styles are all on one line), but this should be enough information to effect the necessary changes to make the image links accessible (ideally via search-and-replace).

Alternatively, you can still remove the outline and satisfy accessibility best practices and requirements by replacing the outline with a highly visible and device-agnostic indicator. I am not offering code for that option as I don’t believe it is the fastest method to get your home page functional again.

I would also recommend removing the title attributes from those images altogether.

As I stated in my previous email, I am happy to offer further feedback, code snippets, or have a conversation with your team to help debug and resolve these issues.

IMPORTANT ANNOUNCEMENT ABOUT THE MICRO PURCHASE COURSE!!!! Re: Issues on new Section508.gov site; Wed, Aug 12, 2015 at 5:47 PM EST

No comments? Be the first!

Leave a Comment or Response

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>