Accessibility Camp Los Angeles: Towards an Accessible Web

With Accessibility Camp Los Angeles just around the corner, there’s a lot of buzz around the importance of making the web accessible for a range of individuals with or without visible disabilities.

Sign up for Accessibility Camp Los Angeles

Who is welcome to sit at your table?


Imagine you opened a restaurant. Your menu features only one item. The most delicious eclairs on the planet. Your restaurant has comfortable seating and a nice ambiance. The perfect place to take a date for dessert.

A lovely couple pay you a visit, order their eclairs and relax. You obviously need to provide them with restrooms. Can every patron use your restroom? Women? Transgendered individuals? Blind people? How about those in a wheelchair? Do you have a grab bar for the elderly?

Are you only spending extra to make your bathroom “accessible” because it’s the law? Or because you want all your patrons comfortable and safe? Perhaps you have an elderly parent, or a relative with assistive needs, and just “understand”.

In the case of a restroom, it is an easy decision to make. The law requires you to make public restrooms accessible. Similar laws are coming to the web as well. And soon enough you will need to learn to make your websites accessible. But that’s not the point of this article, and you’ll need to get into the frame of mind of inclusion to provide all users a good user experience. The spirit of the law is more important than the letter of the law.

Accessibility is about compassion. With an emphasis on passion. Compassion for the people who interact with your work and often your passions.

Coming back to the restaurant, think about the tables now. If a user comes in with a wheelchair? Or a seeing eye dog? Would you deny these patrons a seat at your table?

As a developer, you are feeding many more people than a restaurant does. If you’re paid for your work, it will be seen by thousands if not millions. For those working at Twitter, Facebook and Google, we’re talking billions.

It’s a common mantra of developers that they want to “change the world”. Yet in the course of their work, most devs are missing a golden opportunity to change the world of their visitors by learning about accessibility and welcoming people with disabilities to sit at their virtual table.

Exactly what is accessibility?

Wikipedia defines accessibility as the degree to which a product, device, service, or environment is available to as many people as possible. Accessibility can be viewed as the “ability to access” and benefit from some system or entity.

Do you want your work to be viewed and usable by the widest audience possible?

Usability Testing, Power Users & Hotkeys

Thanks to seminal books like Steve Krug’s “Don’t make me think”, it has become standard practice to perform user testing before or at least after launching a site or app. But are you stopping at browser interaction? Have you thought about accesskeys for keyboard navigation?

Power users of most technologies are well aware that becoming proficient with keyboard shortcuts speeds up your work considerably. If you haven’t tried this, and are a gmail user, devote a few minutes to the following exercise. Go through your inbox the way you usually do. Read 10 emails navigating with your mouse and time yourself.

Now learn the gmail keyboard shortcuts. In fact, just learn the meaning of the ‘j’, ‘k’, ‘n’, ‘p’ keys. Combine that with the tab and arrow keys and time the next 10 emails. The difference is amazing, isn’t it?

Make it a habit to test your sites with a keyboard, and if building a web app, consider making sure every mouse interaction is available by using the keyboard alone, that the user can navigate to all focusable elements using the keyboard, and that there is always a visible focus indicator allowing the user to see where they are at all times when using the keyboard. Power users will love it and as a side effect, your site or app is instantly far more accessible!

For more on hotkeys, click here

Are there enough users for it to be “worth” making my site accessible?

If I’ve achieved my goal with this article, by the time you are finished reading, you will change your outlook about what the web is, and you won’t consider asking yourself questions like these.

But in the meantime, look at it from the perspective of someone using AT (Assistive Technology). I’m taking this concept from a blind friend I met in the accessibility community, who is also a programmer familiar with the Semantic Web.

Statistics of web views with different browsers & browser versions tell you which browser is more popular, and how frequently it is updated. Don’t make the mistake of comparing a user too lazy to upgrade their browser to a recent version, to someone who has to use AT (assistive technology) to visit your site. Doing so is discrimination.

You may object to that characterization. Setting aside that this term is used as the basis of the ADA law, it’s easy to dismiss when you don’t spend time thinking about the cost of inaccessible technology. Consider the perspective of many people dealing with the daily frustration of being shut out of vast portions of the web.

Walk a mile in another one’s shoes

Imagine the web was taken away from you today. That you can’t use Google maps when driving anymore. That you can’t make airplane reservations. That you can’t shop online. You can’t Paypal. You can’t tweet. Facebook. Look up news or questions on Google. In fact, can you even imagine trying it for a day? If you don’t need assistive technology, at least you have a choice.

But if you do need it, your self-sufficiency is often at the mercy of the know-how and concern of the developers of everyday websites. Even if you find workarounds, or an accessible site to achieve a task, failure is only an update away.

Imagine you see in the web a potential solution to so many problems you have, only to be shut down because standards for accessibility are not well known.

The situation is bad. And we as developers are the only ones who can fix it.

A final word about Statistics

According to a search I just did at Disability Statistics, 12.1% of Americans report a disability of some sort. Disabled In Action reports 18%, > 50 Million people and claims 12% are severely disabled. The fact is, 100% of the population will have a disability at some point. The only chance that it won’t affect your life is if the disability kills you first.

We all age. With age comes disability. Blocking this fact from your consciousness makes it no less true. The person you are enabling might very well be YOU!

Walled Gardens vs Open Platforms

Our industry faces cycles. There are advantages to walled gardens. And advantages to Open Platforms. Rich Desktop Applications (RDA’s) appeared to rule the world. Then the web arrived, at first with crude interfaces that “only” allowed you to share information. Or in other words, that made information “accessible”. It beat the pants off RDA’s.

Eventually, Rich Internet Applications (RIA’s) became available and popular. At first, the cost was semantics and accessibility. It was difficult to crawl this content. Javascript and Ajax made it hard for AT (Assistive Technology) to interact with it. Sites like Twitter started breaking the url with hashbangs. Click here to enable some rich functionality.

There are good reasons for these shortsighted moves. But if we keep in mind the principle that the web is about A) creating Data and B) making data accessible, we will be more likely to have a better, more semantic and accessible web for all.

The web catches up to RIA

In order to deal with the short term problems that Ajax and rich interactive web apps and sites created, new technologies emerged. For example, the semantic web world came up with JSON-LD, and the accessibility community came up with WAI-ARIA which is now a W3C recommendation.

JSON-LD provides semantic markup in JSON, and ARIA improves communication of rich interface and visual moving elements to be described to assistive technologies.

For example, you can tag an element like so, role=”button” aria-pressed=”true”, and it will inform the reader that this button is pressed.

Despite the heavy weight of bureaucracy on the W3C and any organization of this nature, there are many wonderful people working hard to make things accessible and semantic. The more you use these features, the more visible your content will be. To search engines, query languages, translation software, assistive technologies, to devices not invented yet!

Learn about the original vision for the web

Let’s digress for a moment with a side trip through recent history.

You may know that Sir Tim Berners Lee invented the World Wide Web in 1989. That it allowed people to share their documents around the world. Changing everything. But did you know that what we have today is only the first half of his vision for the web?

The second half was a Semantic Web. See his book “Weaving The Web” for a non-technical glimpse into the mind of this genius, and to understand his precient vision.

When I use the term “Semantic Web” in conversation, even today, most developers think I’m speaking of CSS. No. The Semantic Web promotes the inclusion of semantic, or structured content in web pages via global standards, to enable a web of data. A searchable database available right on the web, see it here.

What Google and other search engines do is crawl & index the web in an attempt to turn unstructured web pages into semantically meaningful data. But the Semantic Web builds it in by design!

Turning unstructured content into machine readable formats is the ultimate in accessibility! Not the way Google had traditionally done it, but by allowing the web page authors to explicitly structure the data.

When you use structured content in your web pages, search engines do use that data to provide better results.

The Semantic Web is a vast topic too large to cover in much detail here. But we’ll discuss enough to whet your appetite, inspire you to learn more on your own, and tie it back into accessibility.

The Shiny, SPARQLy Web

You have heard of query languages before. For example, SQL. Structured Query Language. You’ve probably seen people swipe the QL at the end and append it to the name of their own query language. From YQL (Yahoo! Query Language) to JPQL (Java Persistence Query Language).

Well the Semantic Web has its own query language called SPARQL (SPARQL Protocol and RDF Query Language). While you may not have heard about it, it is already enabling people to use Linked Data to query hundreds of interconnected datasets representing billions of entities and relationships.

Learn SPARQL here and here.

Linked Data

What is Linked Data?

Linked Data connects structured data on the web using URI’s (a generic means to identify entities or concepts in the world), HTTP to retrieve resources and resource definitions, and RDF (a generic graph-based data model). In a sense, it turns the web into a graph database.

Lean more about the world of Linked Data here.

The power of Disambiguation

SPARQL? Linked Data? What’s the big deal?

It’s a big deal because it’s powerful. An example.

Have you heard of Michael Jackson? He was so popular in Los Angeles in the 80’s. On the radio every morning. He read every single newspaper cover to cover each morning. Had fascinating guests. When authors would appear on his show, he always had read their book. And everyone respected him for it.

Confused? Well besides Michael Jackson the singer, there was a talk show host by the same name on KABC talk radio. Can you imagine trying to find everything on the web about Michael Jackson the radio host rather than the singer? Even Google would find this challenging.

The Semantic Web has a solution to disambiguate terms. Data is stored in RDF (Resource Description Framework) as triples (subject-predicate-object statements). Triples use the entity-attribute-value (EAV) data model found in many formats.

What is different about RDF is the use of global identifiers to uniquely identify the subjects and relationships. So instead of just using the text “Michael Jackson” to identify someone and relying on a human to figure it out using the context, you can use a global identifier in the metadata.

So now, you can definitively point to:

Michael Jackson the talk show host

Michael Jackson the eminent computer scientist

Michael Jackson the beer and whiskey expert

…or even a pop singer by the same name.

No longer do accomplished people have to be hidden in plain sight due to the limitations of a semantic-free, context-free search.

A Wikipedia of Data

You may have heard of DBPedia. It is a Semantic project to take unstructured data from Wikipedia and turn it into structured, queryable data. Wikipedia was inspired by DBPedia to produce something similar called Wikidata.

For an example of the type of problems they have, imagine New York elects a new Mayor. Wikipedia has entries for the Mayor’s name in every known language. This change needs to be manually changed in every translation of every page referring to him.

Another sample problem. Wikipedia maintains population counts of cities. A city’s population changes? Every page about it changes. In every language. Manually. Wouldn’t it be wonderful if this were a data field rather than text that has meaning only to a human reading the article?

To solve this problem, Wikipedia has begun a project called Wikidata to turn Wikipedia into a structured dataset.

Freebasing the Knowledge Graph, & Siri

In its own quiet way, the Semantic Web has been the hidden ingredient powering many ubiquitous technologies in use today.

You may have heard of Knowledge Graph. It powers the little infobox Google shows next to queries about people, places and things. The engine behind Knowledge Graph is Freebase, a technology Google bought when aquiring Semantic startup Metaweb for an estimated $600 Million Dollars.

Apple bought Semantic company Siri in 2010 for an estimated $200 Million Dollars to power voice-activated semantic search commands.

Google, Bing, Yahoo and Yandex have partnered up to collaborate on a project called to provide a formal markup language for web developers to semantically markup their content.

It amazes me how an underlying technology manages to have so much penetration and still stay under the radar among excellent developers.

What does Semantics have to do with accessibility?

It may seem strange to devote so much time to semantics in an article about accessibility. I have done so because I see both communities as complementary. It is about an Ethos.

If you view the web as a place to share pictures, make pretty apps, dump unstructured documents, generate pixel perfect designs for a particular device, you are shutting down so much potential.

However if you embrace the Ethos that the web, specifically the Open Web, is about putting your data online, then you will find your work being used widely and in wonderful ways you never dreamed of.

Your content will live longer because it becomes portable and usable to future devices. Or in other words, it becomes accessible.

Also, by making your data machine processable within your web pages via microdata or RDFa, new applications can translate the information into accessible forms automatically. By making the semantics explicit and machine-processable, you will be making it easier to consume in different contexts.

Background of GAAD

The direct impetus for me to write my blog post that turned into GAAD was watching my Dad unable to access basic data in his Citibank account. I customized the background colors for him on Firefox, a browser he long ago learned how to use. For some reason a yellow background helped him see the web page. But he had gotten phished, couldn’t hear well, couldn’t see well, and received a message from his bank.

Calling the voicemail hell wasn’t possible. Going to the bank required a full day of buses as he could no longer drive. And he couldn’t trust emails from the bank. His own banking information became completely unusable to him.

His mail was even worse. All the buttons were invisible with that yellow background. And it made me so sad. So many of us in this profession work so hard to get things right, yet we are failing people who need us the most. People we might love. So I issued a call to action. At first to web developers, to learn about accessibility and make it part of our workflow. All I expected was to be ignored, like most of my posts.

The accessibility community weighs in

Instead, after reading my blog post, accessibility advocate and now dear friend, Jennison Asuncion reached out to me and encouraged me to make the event happen, with his invaluable help. To my utter shock, it became a global viral “thing”.

The very first year, months after writing the post, it turned into a semi-governmental event in India. People celebrated across the globe. My little hometown of Montreal had it covered in the newspaper. The story was syndicated throughout Canada in fact.

The following year, shortly after my Father passed away from battling Cancer, we had the second annual event. I barely even helped due to grief. But it grew beyond any expectation. We had about a tweet a minute, small companies and large corporations running public and private events. The FCC blogged about it and tweeted all day with the #GAAD hashtag.

The purpose of GAAD

The point of Global Accessibility Awareness Day is not to tell you what to do. Nor to guilt trip you into doing anything. It’s to make you aware of a world out there you may not know exists.

In that spirit, I will end this article with some ideas on how you can celebrate the day and learn more about accessibility and semantics.

What is a screen reader?

This video by Victor Tsaran, a blind programmer then working for Yahoo got me interested in accessibility first. He shows how a screen reader, the device blind people use to surf the web and interact with software, would read every link on a page. Imagine if you went to CNN’s site and had to click through every single headline on the page before deciding which one to click?

Here is a more recent video by Tommy Edison, the Blind Film Critic, who shows how blind people use computers.

How to celebrate GAAD?

If you would like to celebrate GAAD, see if there’s already an event in your area. If not, consider hosting one yourself! We are always happy to help if we can, and will list your event if you let us know about it. Email us at, tweet us @gbla11yday, or post to Global Accessibility Awareness Day.

Even if there’s no event, you can celebrate at home! Follow the #GAAD hashtag on twitter.

Go Mouseless For An Hour

We encourage you to visit a site you were involved in creating and take it for a test-drive without a mouse. Unplug your mouse and only use your keyboard alone (tab/shift tab, arrow keys, enter and spacebar) to navigate and interact with your website. If you use a touchpad, trackpad or similar input method, disable it, and use the keyboard instead.

Surf The Web With A Screen Reader For An Hour

Windows users: there are a number of free/open source screen readers available. One of the more popular ones is NonVisual Desktop Access (NVDA). Take some time to download the software and learn some of NVDA’s documented basic keystrokes before you begin.

Mac/iPhone/iPad users have a built-in screen reader called VoiceOver. Familiar yourself with turning on Voiceover and the basic keystrokes: for the Mac, for iPhone/iPad.

Don’t forget to turn off your screen

Blind users cannot see the screen of course. Imagine hearing only synthesized speech when using your website.

Resources for further research

Here are some resources where you can learn more about the topics discussed:

Global Accessibility Awareness Day

WCAG (Web Content Accessibility Guidelines)

WebAIM has lots of articles and resources to get you started in learning about and implementing accessibility

CSUN hosts the largest accessibility Conference

Here is a breakdown of the wonderful presentations and posts coming out of the CSUN 2014 Conference

Article about ARIA

2010 ADA Standards for Accessible Design

Semantic Web

Semtech Biz conference about the Semantic Web

Sign up for Accessibility Camp Los Angeles