Tuesday, October 21, 2014

NAGW Slides: Responsive Web Design Primer

I just finished a webinar for the National Association of Government Web Professionals where I provided an overview of responsive design. I always struggle when I cannot see the audience, but as always my ego carries me through to the end. The slides are embedded here for any and all to see.

There are links peppered throughout, but there are so many more I could add. Feel free to suggest more if helpful.

View from my side as I ooze with confidence right before the talk.

Monday, October 20, 2014

CDC Ebola Response on Twitter Excludes Blind

Image taken from a CDC tweet to show contrast.
This is one of the images tweeted by the CDC. The text contrast is 4.53:1, so it barely passes for large text. At this scaled-down size, however, the question text would fail a contrast test for accessibility.

In the United States, the Centers for Disease Control (CDC) is (or at least is supposed to be) the first line of defense against public health threats like Ebola. It makes sense, then, that the CDC would use social media to assist its efforts to get useful information in front of as many people as possible.

The problem is that the CDC's efforts on Twitter have fallen prey to reliance on the image attachment. When Twitter proclaims that engagement goes up when images are used, and because tweets limited to 140 characters, it can be pretty compelling to use images to convey a lot more content than would otherwise fit — and it can be styled and better branded.

The CDC Emergency Preparedness and Response account started an Ebola fact campaign, framed as a Q&A series of information nuggets (which makes me think it's really an Ebola FAQ campaign, but I digress). Here is the text of these tweets so far (no images):

We put together your most common questions about Ebola. Our first #EbolaFact is about sneezing. pic.twitter.com/KO25cXKiQI

— CDC Emergency (@CDCemergency) October 17, 2014 [alt]

Our next #EbolaFact is about how long the virus lives on surfaces, a common question about Ebola. pic.twitter.com/ekLEdM4o3z

— CDC Emergency (@CDCemergency) October 17, 2014 [alt]

Our next #EbolaFact is about why health workers wear protective gear if #Ebola virus isn’t airborne. pic.twitter.com/cEzVkqPGgK

— CDC Emergency (@CDCemergency) October 18, 2014 [alt]

Today's #EbolaFact is about whether pets can transmit #Ebola. pic.twitter.com/He5WP4suXq

— CDC Emergency (@CDCemergency) October 19, 2014 [alt]

Our next #EbolaFact is about the incubation period for those exposed to #Ebola. pic.twitter.com/TIwaiga1wi

— CDC Emergency (@CDCemergency) October 20, 2014 [alt]

That's it. No answers, no context, no links to more information. If you are a blind user, you get nothing of value from these tweets.

The main CDC twitter account makes the same mistake:

Get the facts about #Ebola. Here’s what you need to know about when a person can spread the disease to others. pic.twitter.com/DxeSlNhwKE

— CDC (@CDCgov) October 17, 2014 [alt]

Don't think the White House is doing much better. While the tweets at least include URLs to get more information, the text within the image is not included in its same easily-digestible form, and the data contained in the image is scattered across a long-form article on the site.

Worth sharing: Here are the facts on #Ebola, and what we're doing to respond → http://t.co/RMFwal2IB8 pic.twitter.com/UJLnOsP7RV

— The White House (@WhiteHouse) October 16, 2014 [alt]

RT to get the word out: Here are the facts on #Ebola: http://t.co/RMFwal2IB8 pic.twitter.com/KR25pBZvaR

— The White House (@WhiteHouse) October 16, 2014 [alt]

Easy Fixes

Even if you're not the CDC, I think there is still a lesson to be learned here — putting all your tweet content into embedded images is a great way to exclude users. Thankfully the CDC can choose from one of three (four?) easy fixes.

Make Supporting Web Pages

The CDC can simply link to the content in the images as equally-short nuggets on its web site. Clear out the cruft of third-party "share" icons, remove the excessive footer, and generally pare the page down to the fastest load possible. To support these users, don't make them have to navigate to the nugget of content when landing on the page, make it the entire page.

Tweet Your Own Alternative Text

There has been a trend in the accessibility community on Twitter to include or describe images in their own tweets and sometimes in others' tweets.

It ranges from linking to a longer description, to just a quick inline description, to sometimes a reply to the tweet with the alternative text so the two stay associated within Twitter's own tweet-linkage display. You might be pleasantly surprised when people thank you.

Use a Tool Meant for This Purpose

Alternatively, look at a tool like Easy Chirp to embed the full text content within the tweet itself. It already has traction in the blind community, so those already familiar with it don't have to struggle through a learning curve.

Here's the same tweeted image as CDC's first Q&A tweet, but this time it has alternative text just one click/tap away (without losing the image for sighted users):

GIFs in Words on Twitter

This one is a bit far-fetched, but convince the @gifsinwords Twitter account to fill the gap. It's already proven pretty handy to some.

Update: October 21, 2014

These slides might prove interesting related reading (no video that I am aware of): How Companies Engage Customers Around Accessibility on Social Media

Update: October 23, 2014

It looks like both CDCEMergency and CDCgov have each improved a tiny bit in their most recent tweets, insofar as the key point of the message in in the text of the tweet (even if there is still no full alternative text):

Alternative Text (You Can Probably Skip This)

I intentionally didn't allow any of the images in the examples to embed. I think you should experience the tweets the way a blind user would (with the exception of the opening image with its low contrast). However, I also want to make sure the content is still available to readers. So I am helping the CDC here and including the text from each image above (also linked from each image above).

CDC Ebola Q&A:
Q: Can Ebola spread by coughing? By Sneezing?
A: If a person with Ebola coughs or sneezes on someone and saliva or mucus contacts that person's eyes, nose or mouth, disease may be spread.

CDC Ebola Q&A:
Q: How long does the virus live outside of body? What effectively kills it outside of body?
A: Ebola on dried on [sic] surfaces such as doorknobs and countertops can survive for several hours; however, virus in body fluids (such as blood) can survive up to several days at room temperature. Ebola is killed with hospital grade disinfectants (such as household bleach).

CDC Ebola Q&A:
Q: If Ebola isn't airborne, why do health workers wear protective gear?
A: CDC recommends Ebola healthcare workers wear protective gear due to the possibility of large amounts of blood, other body fluids, vomit, or feces present in the environment.

CDC Ebola Q&A:
Q: Can I get Ebola from my dog or cat?
A: At this time, there have been no reports of dogs or cats becoming sick with Ebola or of being able to spread Ebola to people or animals. The chances of a dog or cat being exposed to Ebola virus in the United States is very low as they would have to come into contact with blood and body fluids of a symptomatic persion sick with Ebola.

CDC Ebola Q&A:
Q: What is the incubation period for Ebola?
A: The incubation period, from exposure to when signs or symptoms appear, is to 2 to 21 days, but the average is 8 to 10 days.

Facts about Ebola
When is someone able to spread the disease to others?
Ebola only spreads when people are sick. A patient must have symptoms to spread the disease to others. After 21 days, if an exposed person does not develop symptoms, they will not become sick with Ebola.

Get the facts on Ebola:
Ebola is not spread through: Casual contact, air, water, food in the United States.

Get the facts on Ebola:
You can only get the Ebola virus through direct contact with: body fluids of a person who is sick with or has died from Ebola; objects contaminated with the virus; infected animals.

Friday, October 3, 2014

UX Singapore Slides: Selfish Accessibility

Photo of me speaking, fighting the sun, provided by Camilla Choo. Original photo on Twitter.

In a departure from the other times I have given this talk, I gutted all the slides with code samples as well as the slides on testing (although I did keep them handy and use them for the individual Q&A afterward). Instead, I added a section showing example selfish user stories, some persona bits, and other references. Overall I think it was a great fit. I met the time limit and didn't seem to overwhelm the crowd with technical bits. I hope everyone attending got something from the talk, but based on a few conversations afterward I think I struck a chord with at least a handful.

Anyway, my slides are below. If you want to see the slides I excised, then you should look at the my slides talk I gave a few days beforehand for Accessibility Camp Toronto (start at slide 46).

There was no video from this talk, so you have to take my word for it that it went well. I was warned in advance that the crowd would be tough — they wouldn't laugh at my awful jokes (nor the good ones), wouldn't ask questions, and in general might be hard to read. That was wrong. The room was great and was easy to engage. I think it helps everyone was hoping to learn something new on a topic that many hadn't considered before.


Event Photos

I've tagged all my UXSG photos on my tumblr, but I've included some of my favorites below.

Breakfast bits on the first day of #uxsg. Tasty breakfast and tea snacks continued throughout.
In Bryon Long’s #uxsg lean startup session, he identified being bald and dating as a type of problem.
#uxsg In “think like entrepreneur” session, @trentmankelow asked each of us to draw ourself.
We were also asked to add some fact unknown to the group. I mentioned my durian fascination.
Cutting my #uxsg slides down to 75 after chats today. On a rooftop bar with various animal satay and a Generously Scarlet.
The Donnie-Darko-style #uxsg Super Garang looking on after the end of the conference.

Related Links

Saturday, September 27, 2014

Accessibility Camp Toronto Slides: Selfish Accessibility

I've updated this post to include the video from the live stream, some links, and a few photos.


There was a live stream throughout the day, which was broken into a morning video and afternoon video. I've embedded the morning stream because it includes my talk. I don't feel this was one of my better performances, but I also have not watched the video yet. You are welcome to do so and wince on my behalf. If the embed doesn't start at the right place for you, you can either fast forward to 2:01:00, or you can view it set to start at that point on YouTube.

Surprisingly Flattering Tweets

I'm pleased to sat that if you only watched Twitter, it looks like I did a good job getting my point across.

Some Pics

I snapped some photos, but I'm going to lead with this awesome sketchnote (I've never had a sketchnote of one of my talks, so this is pretty exciting for me):

Sketchnote from Andrea O Pietkiewicz. View the original tweet or on her site.
Sporting an AODA hat & Kirk tie, @DavidLepofsky fits into #a11yTO pretty well.
A sneak preview of The Viking & the Lumberjack at #a11yTO. That will never air.
Whose responsibility is #a11y? @dboudreau addresses in his talk for #a11yTO.
Food-oriented, with reluctant hero, hockey. @karlgroves wins the hand with Strange Brew. @FYCGame

Related Links

Thursday, September 18, 2014

10 Years Ago: TOevolt

Photo from TOevolt.

During Buffalo WordCamp last weekend, co-organizer Ben Dunkle asked about what he said was one of the best conferences he ever attended — TOevolt. It prompted me to look up the photos I took and I discovered that it was 10 years ago today.

TOevolt was the Toronto version of an official evolt.org conference. Founded 16 years ago (1998), evolt.org was for years the de facto web site and mailing list for web developers to learn from one another. Without ever having any sponsors or corporate backers, we managed to successfully build a community where everyone seemed comfortable sharing. Looking at the names of active list members is like a who's-who of industry names today.

The same grassroots approach to everything evolt.org-related was behind TOevolt. Organized by Tara Cleveland, it was an impressive affair for having no financial support from a mother ship. It was also my first speaking gig and probably the only time I'll be on the same ticket at Dan Cederholm. The following is quoted from the announcement on the evolt.org site (a briefer announcement went to each mailing list):

We've got great speakers (Joe Clark, Jesse Hirsh, Dan Cederholm and Adrian Roselli) talking about everything from web accessibility and standards to the use of technology in politics.

I cannot find the slides from my talk on localization (I'm still looking), but I did find Joe Clark's, WCAG 2: All the sugar and twice the caffeine™

However, I do have photos from the event. Matthew Hoy's photos are missing, but his recap is still live. Javier Velasco's photos are still available, as are John Handelaar's photos. Dan Cederholm's event recap is also still online.

I really do miss the old days of evolt.org, even if it was slowly replaced with the advent of platforms like Stack Overflow, or the rise of blogging, or even near real-time support on the Twitters. Even today the evolt.org site still stands, but as a monument to those of us who cut our teeth in the early days of the web. Heck, without evolt.org, I never would have been able to get into the speaking and writing world, nominal though it is (even if I did recall yesterday my incorrect prediction for MNG as a popular file format) or met some truly awesome (and bizarre) people, let alone shared an elevator with many of them at SXSW in 2001.

Workers of the web (gone by), evolt!

Saturday, September 13, 2014

WordCamp Buffalo Slides: Selfish Accessibility

Photo of Buffalo WordCamp t-shirt.
The Buffalo WordCamp shirt was again printed by You and Who (whose logo is visible where the tag would be), which means that 1,600 meals were donated (one for each shirt) to those in need. I think every WordCamp should do this. (related tweet)

Buffalo WordCamp has just wrapped up and folks are hopefully going to take new ideas back to their own projects. There were many great talks and even panel discussions that turned into more of a WordPress support group for the audience and panelists alike. A first for Buffalo WordCamp that I hope they repeat. Also a plus, 48% of the attendees and 35% of the speakers were female, better ratios than I've seen at many other conferences.

My Slides

If you just come for my slides, then you are at the right spot. I've embedded them here, or you can go see them at SlideShare. In addition to questions and feedback from the audience, I've already gotten some feedback from the Twitterverse. In particular my use of the word "continuum" on slide 77. I am open to suggestions for a better word, so feel free to share.


I grabbed some photos from the event as well, captioned below (originally posted on my Tumblr, where they are larger).

Panoramic view of Canisius College Science Hall
This year the event was held in the new Science Hall at Canisius College. This is the atrium where lunch was served and announcements were announced (shot taken shortly after the lunch crush).
The crowd at the start of the event.
Some of the announcements being announced by announcers and co-organizers Ben Dunkle and Andy Staple.
The breakfast table.
A nice spread of pastries to get the day going. I am amazed I only ate one.
Attendees for my talk.
Accessibility talks never net a huge crowd, but at least those who did show up wanted to learn more, had good questions, and challenged me.
My shirt.
After a quick Twitter poll, I broke from my normal pattern of wearing more professional attire and went with the Montgomery Ward mechanic's shirt with the fur collar.
My badge and the schedule
The badge had the day's schedule printed on the back (handy), and they also provided a printed schedule (also handy).
View of the cemetery from one of the talks.
Buffalo skyline.
A view from the after-party at Western New York Book Arts Center.
Type bits.
Some sample type at Western New York Book Arts Center. If you've never been and you are at all interested in type, you should visit.

Sunday, August 31, 2014

One-man Focus Group for Twitter's Timeline Changes

Shows tweets with text saying 'follows,' 'favorited' (both with red X marks), and 'retweeted' (with a green check mark).

TL;DR: Twitter is showing tweets in your timeline that people you follow have favorited or just from those they follow. Way below I outline how I have been reacting.

Much has been said of Twitter's recent change to start putting more than just promoted tweets into users' timelines (such as this forewarning from Gigaom in July). Much of it was said from the "what if" perspective before it had been fully implemented. I've decided to share my experience as a user now that it's up and running.


For a little context, I first saw this happen in March and quickly got annoyed when Huffington Post (which I consider the bottom feeders of regurgitated news bites) tweets started to appear in my timeline. Considering how much time I have spent cultivating my feed, I was worried this was a new trend.

Once Twitter formalized this, some savvy people felt compelled to post a disclaimer once it became clear what they favorite could become stuffed into someone else's timeline alongside their name. Here's one example that covers my feelings pretty well:

I could link to tweet after tweet expressing frustration with this change, but posts like this one from The Next Web have already done a nice job of cataloging the changes as well as the general response.

With all the Ferguson coverage lately Twitter has come out as the best source for news — moreso than traditional media and far better than Facebook. It's been a PR boon, resulting in posts like the aptly-titled Why Facebook is for ice buckets, Twitter is for Ferguson.

Why would Twitter want to start adjusting the timeline that is garnering it so much praise, further risking a descent into being no more than an echo chamber or a marketing assault?

Observing Me

Once these changes started to appear in my timeline I mostly got annoyed and tried to ignore them. I swiped past them and mumbled. But this weekend I snapped. Saturday morning my timeline was regularly filled with cruft I have worked to avoid, from outlets such as Buzzfeed and TMZ. Since they always include photos in the tweets, it takes up half my screen with every unwanted tweet.

Knowing Twitter doesn't care about me as a single user, and clearly doesn't care about the rising voices who are against this change, I opted to do something about it for myself. I didn't start these steps with the intent of writing this post, but perhaps someone at Twitter will see how the user is routing around the problem and reconsider its position.

Steps I've Taken (So Far)

  • Blocking
  • Unfollowing
  • Not Favoriting

Detail on each follows…


I enjoy the Twitter account Saved You a Click. It has become something of a news source for things I wouldn't ever see anyway (sports, celebrities). Saved You a Click follows many accounts I would never follow, like Buzzfeed and TMZ. After tweets from those two sources appeared in my timeline, tweets that Save You a Click didn't even favorite, I decided to simply block those accounts.

I then let Buzzfeed and TMZ know that I blocked them (probably falling on deaf ears). Perhaps, however, if enough people block the accounts that are shoehorned into their timelines, those account owners might raise a stink with Twitter on the other end.

The first screen shot shows a tweet from TMZ, the second shows another from TMZ, both taking up half of my visible timeline with content I do not want. So I blocked TMZ. You may click/tap/select each image for a larger version.


Yesterday after seeing a few tweets that folks I follow had favorited, or even just from accounts that they follow, I opted to prune my following list. I cut my list from 199 people to 183 people and immediately reduced some of the items in my timeline related to sports, celebrities, and other things that don't interest me.

Having me as a follower isn't exactly a badge of honor. I'm sure none of them care very much. But we as users should all consider that we might lose followers simply because of who we follow and what we favorite (regardless of why you favorited it).

The first screen shot shows a tweet from CNN that I had already seen three hours prior (since I follow CNN), the second shows one from Buzzfeed, which I then blocked. In this case I did not unfollow the accounts from which those tweets were "sourced" (?), but I did unfollow others. Note that the second image shows two tweets, of three, that were not re-tweets nor from accounts I follow. You may click/tap/select each image for a larger version.

Not Favoriting

Tweets that I favorite might appear in someone's timeline now. I've already seen it happen to others, and just this morning I got verification that it happens for mine.

I don't like that. I don't want people seeing what I mark for later reading. I also don't want it to appear to be a re-tweet (I am so opposed to the "ideal" re-tweet model that I have only ever done one, the rest are all manual). So I have a simple solution: I will no longer favorite tweets. I'll simple send them to myself (there are tools that can do this for me, but I'll probably just email them).

Each image shows a tweet that someone I follow favorited. The tweets don't interest me, but I don't want to unfollow them. The lesson here is that I shouldn't favorite else I get unfollowed, not to mention I don't want folks to see a favorite as an endorsement. You may click/tap/select each image for a larger version.

Other Actions

I'm now looking at the tops of tweets to see if the tweet was truly re-tweeted, or just favorited, or is just from an account that someone I follow follows in turn (see the opening image). That's annoying.

I'll probably refine this over time, either as Twitter adapts or as I find better ways to do it (like installing a third-party app that I don't hate).


I'd prefer if Twitter stopped this or at least made it an option I can disable. In the absence of that happening, I am taking the Internet's lead and routing around the problem.

In time I may simply check out of Twitter as I have already done with Facebook for doing the exact same thing.

If you are from Twitter and are reading this, I hope this post is useful as a one-person user study. I am happy to answer any questions you may have.

Update: September 4, 2014

Looks like this is just the first step in a larger change for Twitter to try to replicate the very feature that causes so many to make fun of Facebook: Twitter CFO says a Facebook-style filtered feed is coming, whether you like it or not

Since Saturday I have blocked the following Twitter accounts, solely because of Twitter's change:

  • @TMZ
  • @BuzzFeed
  • @WIRED
  • @VICE
  • @verge
  • @Slate
  • @HuffingtonPost
  • @peoplemag
  • @Adweek