Flickr’s Relevant Photo Group Collections

Last updated: March 7, 2015

Note:  All links going to other websites will open in the same window. Use the Back button to return to our site.

Flickr has several groups that contain interesting images related to accessibility and technical communication. Log on to Flickr and go to the Groups tab to see a list of all groups and search for a group. You'll be sure to find something that is relevant or gives you a good laugh. Some groups we like are

  • Usability & Accessibility – Photos from the UPA.
  • This Is Broken – Photos about the brokenness (bad design) of items, places, etc. … see

    https://goodexperience.com/tib/ for more.
  • !Rock That Disability! – This is a group for anyone with a disability, physical, mental or otherwise. (But not just them!) Pictures you want to share.
  • Crutches, Wheelchairs and Canes – The beauty of people who use crutches, wheelchairs, or canes to get around. We welcome pictures of these items being used.
  • Design: Oohs & Aaughs – Photos of both praiseworthy and inadequate design. These are products, objects, and experiences (good or bad), which impact us enough to stop and take notice (and take a photo, too).
  • Public Computer Errors – Computer crashes, errors and other horrors as viewed by those of us innocently traveling along in life.
  • Accessible Travel – Photos of accessibility in tourism hot spots around the world. This includes wheelchair access, Braille signage, sound, markers for the hearing impaired, accessible and inaccessible intersections, public transportation, maps, lodging, restaurants, bathrooms, telephones and communication infrastructure, museum signage, best practices/worst practices, You (!) enjoying a public place with superb accessibility.
  • Wheelchair Accessible Trails – Photos taken on wheelchair accessible or paved hiking trails.
  • Rolling Rains – Travel with a Disability – This group gives travelers with disabilities, their travel companions, friends, and allies of the disability community a place to post about travel. Sometimes we see (or use other senses) differently; sometimes not. To publish your work here you don't need to snap a shot of every curb cut or Braille road sign – aesthetics counts – but somehow weave in insights about accessibility as you tell your story. The combination of photos, firsthand commentary, and the ability to contact the poster provides a unique and ever-changing consumer-level guide for the disability community on to where to go for a good time.
  • Old Wheelchairs, Gurneys, & Outdated Medical Equip – Photographs of outdated/decayed/found Medical Equipment/Devices. The older the better.
  • Writing Machines – Photos of typewriters, printing presses, and movable type—anything to do with the mechanical reproduction or creation of the written word.
  • Writing – Photos about writing and the life of writers. If you are a writer/journalist, you can show fragments of your writing life. Includes photos of handwritten pieces, pens, notebooks, Moleskines, and so on. Photos of people writing and artworks if the theme is "words, writing, writers".
  • Written In Stone – Photos of inscriptions (i.e., words, phrases, names) carved into stone such as on tombs, monuments, and buildings.

If you encounter another group you think we should add, please send us a note with the name of the Flickr group.

Putting Accessibility into Infographics

Last updated: May 27, 2016

Note:  All links going to other websites will open in the same window. Use the Back button to return to our site.

Infographics are the new black. It feels like Twitter is full of infographics being touted and flaunted. From Twitter, I also get the impression that you aren't worthy of calling yourself a technical communicator if you don't use more visuals – illustrations, photos, videos – because people prefer visuals. I won't debate what sighted people prefer. I do want to debate where this move leaves those with little or no sight. How are they supposed to benefit in this mad rush to turn everything into videos or images?

There's hope. Someone just made an accessible infographic to celebrate – appropriately enough – the 22nd anniversary of a U.S. civil rights law called the Americans with Disabilities (ADA) Act. Go review The Whole Brain Group's ADA infographic.

Kudos to them!

Don't forget WebAim. I think the first accessible infographic that I saw on the Web was the WebAIM infographic about web accessibility for designers.

The Story Behind This Story

A few months ago, Steve Faulkner tweeted about an infographic describing the accessibility challenges in email design. He wrote

Accessibility Challenges in Email Design – potentially useful, but in an image without appropriate text alternative

(I removed the link for an easier read. A link to the tweet with the complete text and infographic link is listed at the end of this posting.)

So… I decided to try making that infographic accessible at a basic level. This is my transcription.

Transcription of the Infographic: Accessibility Challenges in E-mail Design

(An image of a corner of the Gmail mail program is displayed next to the title.)

Nearly 49 million Americans have some type of disability. These disabilities can range from color blindness and full blindness to cognitive and neurological disorders. Like most people, these users utilize e-mail and the web on a daily basis, presenting some interesting challenges when it comes to designing web and e-mail content. We take a look at these obstacles and offer tips for designing with these Americans in mind.

Types of Disabilities

Visually disabled – visually disabled users range from those who are partially colorblind to those who are fully blind. Colorblind individuals find it hard to distinguish differences in some colors or design elements, such as red and green. Those with visual impairments will likely use screen readers for e-mails, making it essential to create content that is compatible with the screen reader.

Physically disabled – those with physical limitations can find e-mails with busy design schemes or multiple elements particularly troublesome. Physically disabled users are often incapable of using a mouse. Therefore, the content in their e-mail should inform them of a new event, sale, etc. without the need to click through to a secondary website.

Cognitively and neurologically disabled – for users with this type of disability, receiving e-mails that have overly complex design, inconsistent navigation, or distracting elements could potentially hinder their ability to comprehend the e-mail. Individuals with these disabilities may suffer from dyslexia, autism, strokes, etc.

The Disabled Population

Americans with disabilities occupy a far greater percentage of our nation's population than originally thought; 19.4% of non-institutionalized civilians in the U.S. live with a disability. Image: a pie chart where a segment identifies the 19.4% which is also equated with 48.9 million.

The number of those considered to be blind with no residual vision is nearly 2 million. Image: a circle with a drawing of an eye superimposed which connects to the text "2 million".

8% of males and 1% of females are colorblind. Image: two pie charts are shown. The left pie chart has a sliver marked and labeled 8% male, and the right pie chart has a very tiny sliver marked and labeled 1% female.

Designing for Disabilities

  1. Text-Only Option. Ensure your e-mails are sent in multipart MIME format, and offer both plain text and HTML options when your user signs up to receive your e-mails. The HTML version will load an e-mail that contains images while the plain text version will load text-only content. This will allow your user to decide which is the most comfortable format to read.
  2. Be Mindful of Colors. Color brings vivacity to an e-mail. However, for those with color vision deficiencies, complex color schemes in an e-mail can be confusing or painful. Consider how content and copy may appear in an e-mail to color deficient users. For example, if black copy is set against dark red, the elements will become indistinguishable to those afflicted with achromatopsia. Use colors with high contrasts to help elements stand out from one another.
  3. Know Your Hierarchy. Establishing a clear hierarchy is particularly important when designing for those with cognitive or neurological disabilities. Placing important information higher in the e-mail or following a predictable flow will help users focus and navigate through the e-mail more easily.
  4. Clickable Links. Clickable links should be large and placed in an obvious location. The size of the link will be particularly beneficial to those who cannot control a mouse with precision. Those with partial visual impairment should not have to struggle to find a clickable link among other distracting images.
  5. Text Size. Use larger font sizes to accommodate visually impaired users. Anything below 14 points on a browser screen requires some effort to read. When selecting the typeface that you will be using in your e-mail, choose ones that are evenly spaced and not too condensed.
  6. Keep It Ragged. Avoid using justified copy in your e-mail. Some users may find the harsh rivers and breaks in the paragraph too difficult to follow. Allowing the text to left align and produce a "rag" will alleviate this. Also ensure that line lengths don't become too long; 50-70 characters per line is a good guidance.
  7. Screen Readers. While sighted users can visually skim or skip over nonrelevant content, blind users must listen to the entire content of the e-mail, one e-mail at a time. With this in mind, ensure a healthy balance of text and images in your design, and tailor the written content in your e-mail to deliver the main message. Also consider how compatible your design is with popular screen readers such as JAWS or Window-Eyes.
  8. Harmful Content. Content that flashes at certain rates or in patterns can cause photosensitive seizures in some individuals. Avoid flashing content or including links to videos that may have similar content.

Image: The design of these eight tips is an illustration of an e-mail placed between the first four design tips and text the last four. There are eight callouts on the illustration; they reference the eight design tips. The first tip about text only is placed at the very top of the illustration. The second tip about color points to an image in the upper left corner of the mail. The third tip concerns the first message in the mail which is just to the right of the image mentioned. Just under this image is a call to action button, which is the fourth tip. A section of text in this image of an e-mail refers to the fifth tip about text size. In that same text section you'll find the sixth tip about justification. The seventh call out about screen readers points to the text, too. The eighth call out about harmful content points to the bottom edge of the mail.

(In the footer of the infographic) Sources: davechaffey.com, prb.org, usability.gov, aoa.org, "Designing for Cognitive Disabilities," Ruth Ellison

This concludes the transcription.

The Transcribing Process

You can argue for and against the image descriptions. The message that someone wanted to get out was in the text. The images only enhances (or potentially distracts) from that message. I felt they should stay. Sighted people have the choice of viewing the images or focusing on the text. Why can't everyone have that choice.

Also, I made the last image quite descriptive as if I was describing it to a friend. I felt it was natural to want to convey a sense of the actual design and not just say "image of an email with eight callouts". This infographic was easy to describe – it was mostly text. Something with many overlapping images may be far more complex and tricky to break down into something coherent. That makes me often think – is the complexity necessary or is it bling? – which makes alarm bells go off inside this technical communicator's head!

The tweet that led me to the infographic was two months ago. Transcribing did not take two months. In fact, it was very easy with my Dragon Dictate for Mac doing the work! I read out the infographic and it did the typing! Finding the time to do that and then make a blog post was my priority challenge. Those who made the infographic must have had the raw text for the graphic designer. Taking that text and putting it into simple text form as I have done here should have taken very little time. Maybe they didn't think of that. That is why I wanted to write this – to point out what little effort it can take to make something completely unaccessible to some people suddenly accessible to everyone. Just take the first step and the positive reception should have you eager to take your next step.

Resources

Web typography fun with @font-face

Last updated: March 5, 2015

Note:  All links going to other websites will open in the same window. Use the Back button to return to our site.

Dear typography fans, we found a few entertaining links for your enjoyment.

"The Potential of Web Typography" is probably for the hard-core typography geek. Do as the authors say and read John Daggett's primer about @font-face first. Then read about the potential of web typography. As they say, "fine typography has always been one of the stumbling points of web design." Now, with support for @font-face in Firefox 3.5, new magic is possible.

@font-face is the reason why John is messing with fonts in different browsers. It's fun to watch his article load in the browser because the visual can change (which is exactly why John is messing with fonts. 🙂

Typekit should be mentioned, while we're discussing typography. (It's not really related to @font-face, but it is big news for anyone interested in typography.) Read the Typekit blog to discover what plans Typekit has in store. Here's a snippet from one of the first blog posts:

We've been working with foundries to develop a consistent web-only font linking license. We've built a technology platform that lets us to host both free and commercial fonts in a way that is incredibly fast, smoothes out differences in how browsers handle type, and offers the level of protection that type designers need without resorting to annoying and ineffective DRM.

It seems that typography fans have plenty to keep them busy in the near future.

Hat tip to Kate Walser for inspiring this little post with her tweet about the link to the potential of web typography article.