How to Make Your Site Senior-Friendly

Young senior using a laptop.Until we find the fountain of youth, studies show our ability to use websites will drop by 0.8% per year from age 25 to 60, making websites 43% harder for seniors (age 65 and older) to use. Declining eyesight, dexterity and memory create usability challenges that can derail a senior’s interest or online purchase.

With seniors making up Canada’s fastest-growing age group and a rising 48% of them using the Internet, an increasing number of online users face these challenges. For those who don’t start using computers until later in life, there’s the added obstacle of trying to grasp common web terms like URL, download and double-click, which may sound cryptic.

Studies also show many senior users are afraid of making mistakes or potentially ‘breaking’ something. And others may hesitate to try an alternate path, if the first fails.

While we can’t stop aging, communicators, UX designers and digital pros can tweak solutions to accommodate aging users. For maximum benefit, counter ‘ageism’ with an interface that meets seniors’ as well as younger users’ needs.

Start by incorporating the web accessibility basics outlined in Ontario’s new Accessibility for Ontarians with Disabilities Act (AODA), even if your site is exempt.

Looking at AODA requirements, I thought more could be done and took a deep dive to find out. I discovered many recommendations for accommodating seniors pertain to Jakob Nielsen’s 10 usability heuristics that should apply to interfaces for users of all ages. However, some of them are more specific to seniors or need extra diligence when designing for older users.

Thorough testing with senior subjects is also imperative for any site for this older demographic and should include ample focus testing error and recovery messages.

Key User Experience (UX) Design Recommendations

So here’s a checklist of key recommendations from varied sources for supporting seniors matched with Nielsen’s heuristics:

1. Visibly show user the system status –
• Incorporate visual cues to show users where they are in the website, such as highlighting the current menu, instead of forcing them to rely on memory.
• Display messages that tell users when a successful action must be processed before the screen refreshes to reassure them all is well.

Heart, dice and big dipper graphics to represent dating, games and horoscopes seniors can understand.
Use meaningful symbols/icons with text labels.

2. Match system objects to the real world –
• Offer familiar, tangible words with explanations as alternatives to common ‘techie’ terms that may confuse newcomers to the web. For example, use ‘picture’ instead of ‘icon.’
• Use meaningful symbols/icons but prudently to avoid image-overload and always include text labels.
• Offer a back-up visual to a standard convention to improve clarity, such as a traditional filing cabinet image along with the standard hard-disk icon.

3. Give the user control and freedom –
• Make Forward and Back arrow buttons prominent and be sure to leave ample space between them.
• Include text alternatives for all media items, not just images.

4. Strive for consistency and standard formats –
• Follow platform conventions and try to keep steps consistent for as long as possible. Conduct thorough usability research and workflow analysis upfront with seniors to give a site design optimal longevity.

5. Make it hard to screw up –
• Given seniors’ ‘fear’ of failure, take extra care to build error-reduction and quick recovery paths into solutions.
• Make forms short, easy to complete and designed to accept anticipated punctuation variations, such as phone numbers and credit card numbers with and without dashes.
• Separate hyperlinks with ample space to avoid erroneous clicks.

6. Design for recognition versus recall –
• Display relevant topic items during searches in much the same manner as Google does. (Stats suggest seniors like and use Google search more than other users.)
• Use different colours to distinguish between visited and unvisited links to help users keep track.

7. Make it flexible and efficient to use –
• Overcome dexterity challenges by offering alternatives. Offer Alt key strokes and Enter key pressing, instead of double-clicking and dragging menus. Try up and down arrow options versus scrolling.
• Offer an option for adept users to take a more proficient path (with less prompts), if they want.

Image of Everything Zoomer website as example.
For readability, use high contrast dark type on light backgrounds and avoid pattern backgrounds.

8. Opt for readability and minimalist design –
• Stick to sans serif fonts but not condensed versions.
• Ensure point size is at least 12 points. Use the scalable ‘em’ unit or percentages (e.g. 120% for big text) in cascading style sheets (CSS) to avoid coding restrictions that keep type small.
• Use high contrast dark type on light backgrounds or vice versa but avoid pattern backgrounds.
• Avoid putting yellow, blue and green together, as they’re hard for seniors to differentiate.
• Ensure designs are responsive, as many seniors are taking to tablets, including my elderly mother who finds one easier to use and less intimidating than a laptop/desktop computer.

9. Help users recognize, diagnose and recover from errors –
• Prominently position error messages and use plain language to help the user understand, then course correct. Specifically test error text with seniors to ensure clarity.

10. Offer accessible help and documentation –
• Offer a phone number option for help/support, not just an email or web page.

For more ‘how-to’ details, check these guides:
• Nielsen, Jakob, Seniors Citizens (Ages 65 and older) on the Web, 2nd Edition,NN/g, May, 2013.
• National Institute on Aging, National Library of Medicine, Making Your Web Site Senior Friendly – A Checklist, 2002.
Other Sources:
• Aula, Anne, Learning to Use Computers at a Later Age, Computer Human Interaction Information Visualization Research Group.
• Kantner, Laurie and Stephanie Rosenbaum, Usable Computers for the Elderly: Applying Coaching Experiences, Tec-Ed, Inc., 2003.
• Nielsen, Jakob, Seniors as Web Users and Define Techy Terms for Older Users. NN/g, May, 2013.
• Revera Report on Tech-Savvy Seniors: Key Findings, June, 2012.

Digital Alone is Not the Message

Home screen for niche social media network
For my senior project, I produced an interactive media prototype of a social media network for unpaid caregivers at: http://rmafpf.axshare.com/#p=home
flower store mobile wireframes.
Wireframes are a key step in developing an interactive solution. Effective ‘how it works’ notations are almost more important than well-drawn screens. Here are mobile screen wireframes I developed for a flower store site.

Despite rising focus on STEM skills, effective communications is still the gatekeeper to success. Even the most brilliant discovery or algorithm falls short if its message is missed or skewed.

To start, ‘speak’ like your audience and tell them what they care about — or why they should. Better still, embed a story to draw them in, sustain attention and boost retention.

Some say digital counters this approach. That it distracts and muffles the message. I disagree.

You can effectively integrate digital in traditional PR/MarCom strategies but only IF it brings you closer to meeting your audience and their needs. Online media rooms can help reporters meet tight deadlines with 24/7 access to photos/facts. Links to videos, articles or other sites, give readers the option to learn more, without losing time to search. With mobile, we can reach time-strapped audiences and tap into their up-to-the-moment needs.

But a ‘locked’ media room, mandatory ‘fluff’ video or cut-off text on a smart phone will kill the message before you can say: “The medium is …”

Digital can also enrich stories with its non-linear format, making multiple subplots or endings possible. And interactive media helps reach auditory and kinesthetic, as well as visual learners.

Back to School

Recognizing digital’s rising value, I disappeared for a year to immerse full-time in a post-grad interactive media management program at Centennial College and sharpen my skills.

My goal was to master technology. But the more I learned, the more I realized effective communications and empathy for the audience or end-user, are the life blood of a successful user experience (UX). Website audits and user test analysis drove this home, with rampant examples of dead ends, static buttons and broken links — sometimes on global brand sites.

Most telling was my prototype project for a niche social media network for caregivers. Technically, it works.  But I need to build in steps to reinforce users’ learning and encourage return visits.  I also need clear communications and clutter-free screens. Without these considerations, it’s just empty code.

Sure, I boosted my analytics skills, learned how to create wireframes and prototypes in OmniGraffle/Axure, mark-up HTML5 pages with Cascading Style Sheets (CSS) and edit video in Premiere Pro.

More important: I learned the value of user testing, how to optimize the UX, efficiently produce software and the necessary trade-offs.

Optimizing the UX

For example, tools like Jakob Nielsen’s 10 usability heuristics cover broad interactive design principles, such as applying real world images and conventions to interfaces. You can use them as a checklist to objectively assess any UX design and counter subjective arguments about a website or other screen. This way, they help you advocate for the end user’s best interests and set them on a path to purchase, subscribe or ‘convert’ in another desirable way.

Drawing of Agile / scrum process
Most interactive projects are developed via an Agile methodology with an iterative ‘scrum’ process focused on developing an MVP — a radical shift from PR’s typical ‘waterfall’ project management path.

Agile Efficiency

I also learned and practised ‘agile’ project management to efficiently produce software. This methodology is collaborative, fast and means striving for a minimal viable project (MVP) — a tough mandate for perfectionists.

Tough Trade-offs

Achieving an MVP also includes making trade-off decisions between:

  • Responsiveness and Resolution or how many message prompts do you need before the user reaches their goal?
  • Optimization and Ubiquity, such as deciding which screen, tablet or smart phone will offer the best experience and which will be adequate.
  • Customization and Design or drawing the line between the features you’ll let users decide and those you’ll ‘hard code’ in the design.

Turns out, the ‘Medium is the Massage’  typo-hindered phrase may be partly right. That is, the medium must be massaged  into an MVP, injected with content and tested to ensure the audience ‘gets it.’

I’ve graduated, have a part-time contract digging into app analytics and global market research for LongStory — a digital role-play game. Long-term, I’m looking for a content or digital strategy role. In the interim, I’m busy merging the best of digital with my communication skill-sets.

This blog will still focus on my discoveries and how to do the right thing well but with more of a digital twist or ‘interactive for good’ feel.

Screen Shot 2015-03-09 at 11.44.56 PM
My favourite project was a narrative between personas (audience/users) to show how a niche social media network (Senior Care Share) would make caregiving easier for them. Click through to run it.