Review of www.aspe.hhs.gov

FireShot Screen Capture #013 - 'ASPE I Office of The Assistant Secretary for Planning and Evaluation' - aspe_hhs_gov

The Office of the Assistant Secretary for Planning and Evaluation or ASPE, recently launched their new website, http://aspe.hhs.gov/.

The mission of this agency is to ‘advise the Secretary of the Department of Health and Human Services on policy development in health, disability, human services, data, and science; and provides advice and analysis on economic policy.’

Below is Caught in the Web Consulting’s review of the new website.

Homepage

The new homepage for aspe.hhs.gov is outstanding. The rotator is prominent and easy to navigate with clear, navigational cues/arrows. The rotator executes best practices for 508 compliance across the board.

As the highlight of their content is informative data, the IA does a great job of segmenting the graphs by popular areas such as most viewed and level of interactivity.

The Twitter feed on the homepage is one of the strongest we’ve seen-providing users with the ability to scroll through additional Tweets without having to leave the page to venture away from their site.

While the social media icons are clear and easier to find, a data-driven website should include a larger search bar, and the ability to sign up for emails sits too far below the fold.

One of the strengths of the homepage is the strong usage of white space to break up the data sets.

The fat footer of the site is outstanding and the inclusion of clear icons for the contact options is excellent.

Top Navigation

The site implements best practices of top navigation by not exceeding seven main headings and simple uses four. The top nav headings are clear to understand and are easier to grasp. While the site does a great job of organizing content themes under Topics and Offices under About, the site should provide more categories for Publications as opposed to making users have to sort through over 10 pages of publications that are not sorted in any particular structure.

Interior Pages

For the exception of the About section, the great balance of white space and content hierarchy is not extended to the interior pages of the site which is unfortunate.

Topics

While the list of topics provides users with a solid understanding of the information ASPE provides, the pages are extremely difficult to follow. Under Affordable Care Act Research, the audience is introduced to ‘current publications’ yet some of them are over four years old. This page would be better structured with a drop down menu that enabled users to find publications by date/year. This would also help prevent all of the unnecessary scrolling.

The interior pages are inconsistent in their structure.   Again under topics, pages like Alzheimer’s/Dementia and Early Childhood are short in length.   However, the poverty section introduces sorting/filter functionality that does not exist under the Affordable Care Act Research content, yet would be well-suited for the page.

The Teen Pregnancy Prevention Evidence Review appears to be a different sub-domain, has a dated look and feel, and introduces different navigation. The site should provide the same disclaimer that’s used for youth.gov in the Topics drop down to let visitors know they’re visiting another site to avoid confusion.

Site Search

Publications and Data and Tools both give site visitors the opportunity to ‘search in table for’- this should be the default for each section and should use additional filtering as shown in the Poverty section under Topics.   The Glossary section under Data and Tools would be easier to use if the ability to toggle through by letter as is done for most .gov sites under A-Z topics.

Mobile

The mobile display of ASPE’s site should be further enhanced. The mobile version of the site uses three lines to spell out the agency’s name which pushes down the search and menu which are key header elements for mobile. Once you do get to the menu, it is pushed down so far that you can only see ‘about’ and not the other menu options.

Some of the visual elements look wonky on mobile. Not sure if that’s just an iPhone issue, but some graphics look distorted on an Amazon Kindle as well.

With such a great homepage, the interior pages should be revisited to make the entire site shine.

Making your web content accessible for those with disabilities

As the web evolves, it is easy for companies to get excited in regards to emerging technologies, and their desire to share them with their audience. While it is good to stay with the times in regards to emerging trends, the needs of those with disabilities must be considered as well.

As the web evolves, it is easy for companies to get excited in regards to emerging technologies, and their desire to share them with their audience. While it is good to stay with the times in regards to emerging trends, the needs of those with disabilities must be considered as well.

Imagine accessing a mobile site that requires you to click on a button while having limited usage of your hands.

Imagine trying to find information about a product you are researching, but are blind and cannot view the text that describes it.

As a member of the Deaf and Hard-of-Hearing community, I personally know how frustrating it is to reach a website that has a ton of videos that do not offer a transcript or close captioning.

It is also important to note that as larger groups of older Americans are embracing the web, they may face an array of vision and hearing-related impairments that can impact their web experience.

Section 508 of the Rehabilitation Act of 1973 requires federal agencies (including .gov websites) to provide software and website accessibility to all people with disabilities.

What is 508-compliance?

508 compliance means that all web users, regardless of disability status, can access technology. In the same way that a building offers signage in Braille, an elevator or ramp for wheelchair users- 508 reduces barriers to access for all people online, despite their disability.

What can you do to make your site’s content 508 compliant?

Logical and Cohesive—Plain Language

The order of content on the page should be logical and cohesive. This is to ensure that those with cognitive impairments, as well as those with vision impairments can comprehend content through reading, or through text reader software/application.

It is also important to note that for American Sign Language uses a different syntax structure from English making plain language imperative to the Deaf and Hard-of-Hearing audience as well. Jargon and slang should be avoided to prevent misunderstandings.

Treatment of Hovers and Clicks

You should also ensure that all content on your pages is accessible.   This means that all interactive content on the page (dropdown menus, etc.) are truly usable with only the keyboard (no mouse hover or click).

Instructions

Ensure instructions do not rely solely on sensory characteristics.

Magnification

For those with vision impairments, be sure to use the magnification tool in your browser to zoom in on the page and ensure that fonts and other objects increase in size correctly and consistently. We are seeing more and more issues of this with the emergence of mobile websites, especially in rotators/carousel slides where content headings are too small to read.

Consider Color

Ensure that your designers’ color contrast ratio is 4.5:1 to enhance legibility of content against backgrounds. They can use the Colour Contrast Analyser tool

Videos and Carousels/Sliders

If your website offers videos or carousels (sliders), all videos and slide shows must have visible tools to access:

  • Play/pause button
  • Audio controls
  • Closed captions
  • Provide a text transcript for audio-only presentation
  • Slide navigation tool
  • Ensure that audio does not disrupt text to speech functionality

Forms

Whether you present a basic contact us form, a checkout or donation process, here are some best practices that you should apply to your site.

  • All form elements should be appropriately-described
  • Audio information should not be the only method used to indicate completion or an error on your site
  • Ensure instructions do not rely solely on sensory characteristics
  • Form field constraints should be clearly indicated
  • Form elements should include explicit labels
  • Ensure that instructive text is placed at the beginning of a form, and is accessible as the user continues the completion process

Videos and Carousels/Sliders

If your website offers videos or carousels (sliders), all videos and slide shows must have visible tools to access:

  • Play/pause button
  • Audio controls
  • Closed captions
  • Provide a text transcript for audio-only presentation
  • Slide navigation tool
  • Ensure that audio does not disrupt text to speech functionality

Mobile and touch screen devices

With Google’s recent change to their algorithm in regards to mobile-friendly sites, many site owners are paying close attention to elements that can negatively impact their search performance. Not only are too many links bad under the new algorithm as they can cause user error (aka fat fingers!), they are also difficult for those with vision impairments, or with impaired motor skills to access. Instead, larger, well-labeled buttons should be used.

However you should ensure that:

  • Touch screen actions are triggered on removal and not on initial touch
  • Your mobile display provides inactive space around touch screen elements and sufficient size for touch screen elements

Offline support

Be sure to train your help desk or customer service team to utilize plain language when assisting customers with disabilities where communication is impacted.  There are numerous apps for the Deaf and HoH (hard of hearing) that allow text to speech translation and video relay communications. Please also consider that the TTY is now the equivalent of a rotary phone in the Deaf community (aka old skool), and video relay services such as Sorenson are highly-preferred.

Is your website already 508 compliant? Not sure? You can visit 508checker.com to test your site. Caught in the Web Consulting, LLC serves many .gov and non-profit websites that follow strict 508-compliance.

Need help in making your site 508 compliant? Contact Caught in the Web Consulting today.

This article was written with research obtained from: Mobile.Va.Gov