All-ages design—an overdue best practice gets a boost from the pandemic
All-ages design—an overdue best practice gets a boost from the pandemic

By on in User Experience Website Development

All-ages design—an overdue best practice gets a boost from the pandemic

Jokes about baby boomers needing their grandkids to set up their technology aside (or perhaps as a result of them), too many companies assume that the audiences for their websites and mobile applications are on the younger side. Even if that was true in the past, it’s no longer the case. The gap among older users and technology adoption has been closing, and it’s been further accelerated by COVID-19.

According to Statista, in 2016, 64% of the US 65+ population was on the internet. By 2019, that was up to 73% and the pandemic hadn’t even started.

In addition to technology becoming more popular among older users, it’s important to remember that each year, tech-savvy people get older, too. That may seem obvious, but it’s easy to forget that even digital natives can be pushing 40, the age at which your vision starts to lose its sharpness and you may find yourself reaching for reading glasses.

 


Who (young or older) could possibly intuit these share and USB icons, or the original direct message icon from Instagram, if they just arrived on the internet?

Share, menu and Instagram direct icons


 

Even the slowest to adopt are now online

A recent Bloomberg article, The “‘New Normal” for Many Older Adults Is on the Internet, described Senior Planet, an organization dedicated to bringing classes, resources and unique experiences to anyone over 60. As lockdowns started, Senior Planet asked more than 2,000 seniors what they needed to get through the isolation. The answer? Zoom tutorials, of course, but also everything from gaming programs to telemedicine to ride-sharing apps.

Closer to home, I’ve been my mom’s “IT guy” since I was 12 years old and Windows 98 terrified her with unfriendly error messages and sounds. Over the past year, however, my 76-year-old mom got online banking working on her phone, signed up for Netflix via her television, downloaded more than 15 gaming and productivity apps, and got a hearing aid that works like a more-discreet AirPod and syncs with devices across several brands. The only time she reached out to me was for help reconfiguring the internet connection on her smart TV.

Almost every service she needed had shifted to online-only, so she had no choice but to learn new digital tricks. Imagine, however, if she got stuck at step one because the text was too small? What if the hamburger menu wasn’t easy to find or the links weren’t intuitive? What if the text was too techy or the button didn’t give appropriate feedback? As I look at those questions, it seems that these aren’t just age-specific usability problems, but issues that can affect anyone when we make assumptions about what people already know.

 

A UX problem requires a UX solution

Even when a product or site’s audience includes older users, such as many states’ coronavirus vaccine sign-up sites, it seems that these considerations are often ignored by product managers and designers. Perhaps they just lack understanding of what the hurdles might be. Or that there might be hurdles at all. But now that more senior users are embracing (or tolerating) web and mobile applications, we can’t blame them for sites that are confusing and interfaces that don’t work. That’s on us. The silver economy isn’t just a huge market opportunity, it’s an overdue best practice.

 

Design and UX tips—engagement for all ages

1. Make text easy to read
  • Let people adjust text size when possible
  • Use minimum 16px fonts if possible, especially for forms
  • Avoid using multiple fonts
  • Avoid text overlaid on images or graphics
  • Clearly convey content hierarchy with type weight
  • On touch screen devices, gesture controls should be implemented with care—older users may be less eager or able to perform multi-finger gestures such as pinch or zoom
2. Magnify visibility and usability
  • Choose high-contrast colors and shading—online contrast checkers can help you ensure that your designs are easy to understand not just for older users, but for anyone with vision challenges
  • Increase button size and keep them out of corners to ease selection—on touch interfaces, buttons should be at least 9.6mm diagonally (44 × 44 pixels on an iPad) for users up to age 70, and even larger for an older audience
  • Icons and buttons should be placed with a minimum spacing of 44 pixels to allow for touching intended buttons and not placed in corners to avoid accidental actions.
  • Reduce the distance between interface elements that are likely to be used in sequence (such as form fields), having at least 2mm apart.
3. Indicate interactivity
  • Add visual cues to clickable elements in active and static states, and provide clear descriptions of the intent and the result of any interaction
  • Differentiate external links so users don’t unexpectedly find themselves in a new environment
4. Point out progress and location
  • Offer clear feedback on progress and completion for multistep forms or features
  • Avoid extensive scrolling
  • Make the way to return to the homepage or start screen clear and easy to find
  • While breadcrumbs are out of date, there are other methods of showing where the user is within a site or experience, such as clear titles and navigation indicators
5. Avoid frustrating forms
  • Increase error tolerance—we all know the feeling when one typo results in a form error, especially when it’s the result of a formatting requirement
  • Provide specific instructions for fixing any problems
  • Do not include multiple actions on a single screen
6. Skip or extend time limits on responses
  • Filling out a form or completing a purchase may require longer for some users, so ensure that if necessary, the time offered is generous
  • Remove time limits altogether if you can, unless you expect heavy traffic competing to complete transactions, such as when tickets or new products are released
7. Simplify animations
  • Use animations only when they serve a function, such as helping to convey the information architecture
  • iOS uses animations to supplement navigation, but they can be disabled in accessibility settings
8. Communicate clearly
  • Avoid abbreviations, acronyms or jargon that not everyone may know
  • Try to introduce product features or information gradually, focusing on key attributes as they’re needed
  • Find analogies to processes in the physical world to convey complex information
  • Always pair icons and symbols with text—older users tend to prefer text over symbols and colors as a medium for information and it prevents confusion for everyone
  • Include feedback messages that explain exactly what is happening as an action is completed
  • Complement voice or video content with subtitles
9. Invite user feedback

No one knows your audience better than they know themselves, so see how they interact with your content, features and forms. Bring them in to test, rather than relying on assumptions. After all, a great design isn’t a great design if nobody can use it.