{"id":257,"date":"2014-10-14T01:46:19","date_gmt":"2014-10-14T05:46:19","guid":{"rendered":"https:\/\/rachievee.com\/?p=257"},"modified":"2014-10-14T01:46:19","modified_gmt":"2014-10-14T05:46:19","slug":"intro-to-web-accessibility","status":"publish","type":"post","link":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/","title":{"rendered":"An Intro to Web Accessibility"},"content":{"rendered":"

An Intro to Web Accessibility<\/h3>\n

Did you know that there are currently only 13 themes that show up in results when you filter by the “accessibility-ready” tag in the WordPress Theme Directory?<\/a> (Checked in October, 2014)<\/p><\/blockquote>\n

Of course, this doesn’t necessarily mean that there are only 13 themes out of the 2000+ that are accessible, they may just be missing their theme tags<\/a>. However, there is\u00a0also a high\u00a0chance that a theme you’re using, or one that you’re building, is not accessible (uh oh)!<\/p>\n

Well, how do we know if our theme meet’s the accessibility guidelines<\/a> and if it doesn’t, what steps can we take to resolve that problem? This the first post in a series that will guide us\u00a0through those steps. If you have a couple of\u00a0minutes a day, we can\u00a0work on making your WordPress theme accessible together – a\u00a0few\u00a0easy steps at a time.<\/p>\n

Before we dive into code,\u00a0I’d like to briefly review\u00a0what web accessibility is, who it’s for, how it’s used and what to expect\u00a0in future posts for this series. Let’s get started.<\/p>\n

<\/p>\n

First, What is Web Accessibility?<\/h3>\n

According to Wiki<\/a>:<\/p>\n

Web accessibility<\/b> refers to the inclusive practice of removing barriers that prevent access to\u00a0websites by people with disabilities. When sites are correctly designed, developed and edited, all users have equal access to information and functionality.<\/p><\/blockquote>\n

This means that a user, regardless of age and\/or disability should be able to access your site and absorb the same information as others users do.<\/p>\n

Who is Web Accessibility for?<\/h3>\n

Using the Web Accessibility Initiative<\/a> section on W3.org<\/a> as a reference,\u00a0there is a diversity of people that benefit from sites that practice accessibility standards. A few examples of who\u00a0these people might be are:<\/p>\n

    \n
  1. People that have auditory disabilities<\/strong>, ranging from mild hearing loss to deafness. Just as an FYI, I am hard of hearing in both ears and have been that way since childhood. I’ve included a short summary about it on my “about” page if anyone’s interested. ( More about auditory disabilities…<\/a> )<\/li>\n
  2. People that have disorders involving the nervous system<\/strong> like ADHD or memory impairments. ( More about cognitive\/neurological disabilities… <\/a>)<\/li>\n
  3. People with physical disabilities<\/strong> that would prevent them from using a traditional mouse\/keyboard. ( More about physical disabilities…<\/a> )<\/li>\n
  4. People with speech disabilities such as muteness or cluttering. ( More about speech disabilities…<\/a> )<\/li>\n
  5. People with visual disabilities<\/strong>, ranging from color blindness to blindness in general. ( More about visual disabilities…<\/a> )<\/li>\n<\/ol>\n

    And let’s not forget the elderly or those that may have a combination of disabilities or impairments. Just as some food for thought:<\/p>\n

    “About 20 percent of adults in the United States, 48 million, report some degree of hearing loss.” ( hearingloss.org<\/a> )<\/p><\/blockquote>\n

    That’s a lot of people, and this is just auditory disabilities alone. Combine that with everyone else in our list above, and you can already see all the potential users your site can be missing out on if it’s not meeting accessibility standards.<\/p>\n

    What\u00a0Tools Enable These People to Access the Web?<\/h3>\n

    Some examples of tools that are used to access the web by those with disabilities are:<\/p>\n

      \n
    1. Screen Readers<\/li>\n
    2. Voice Browsers<\/li>\n
    3. Specialized hardware\u00a0that replaces or enhances a keyboard\/mouse<\/li>\n
    4. Text to Speech\u00a0hardware\/software or visa-versa<\/li>\n
    5. Perhaps only a mouse or only a keyboard<\/li>\n<\/ol>\n

      For more information on how the web is accessed depending on a user’s disability, check out the Tools and Preferences section on W3.org<\/a>.<\/p>\n

      Finally, How Can We Make Our WordPress Theme Accessible?<\/h3>\n

      In the posts following this introduction, we’ll go over some plugins that may help as well as what we can do code-wise to edit\/enhance our WordPress themes right that moment. Some examples of what we’ll go over are heading tags, skip links, the alt attribute on images, html structure and so on. Each post will be dedicated to a particular aspect of accessibility so we can focus on applying one change at a time. Making your theme accessible shouldn’t have to feel like tearing down the entire house and re-building.<\/p>\n

      My WordPress theme, Hexa<\/a>, could also use some improvements as far as accessibility goes. Therefore we’re in this together and I’m looking forward to learning with you post by post. Until next time…<\/p>\n","protected":false},"excerpt":{"rendered":"

      An Intro to Web Accessibility Did you know that there are currently only 13 themes that show up in results when you filter by the “accessibility-ready” tag in the WordPress Theme Directory? (Checked in October, 2014) Of course, this doesn’t necessarily mean that there are only 13 themes out of the 2000+ that are accessible, […]<\/p>\n","protected":false},"author":1,"featured_media":4905,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_vp_format_video_url":"","_vp_image_focal_point":[],"footnotes":""},"categories":[119,87],"tags":[168,169],"class_list":["post-257","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-accessibility-series","category-wordpress","tag-accessibility","tag-web-accessibility"],"yoast_head":"\nAn Intro to Web Accessibility - RRVasquez<\/title>\n<meta name=\"description\" content=\"In this new WordPress series, Rachel's first post is an intro to web accessibility, what it is, who it's for, and how we can apply it as theme developers.\" \/>\n<meta name=\"robots\" content=\"noindex, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"An Intro to Web Accessibility - RRVasquez\" \/>\n<meta property=\"og:description\" content=\"In this new WordPress series, Rachel's first post is an intro to web accessibility, what it is, who it's for, and how we can apply it as theme developers.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/\" \/>\n<meta property=\"og:site_name\" content=\"RRVasquez\" \/>\n<meta property=\"article:published_time\" content=\"2014-10-14T05:46:19+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/rrvasquez.com\/wp\/wp-content\/uploads\/2014\/10\/FeatAccessIntro-768x403-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"768\" \/>\n\t<meta property=\"og:image:height\" content=\"403\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"rachievee\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"rachievee\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/\"},\"author\":{\"name\":\"rachievee\",\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/#\\\/schema\\\/person\\\/3c0b465921f78585f615ea79027b8b6f\"},\"headline\":\"An Intro to Web Accessibility\",\"datePublished\":\"2014-10-14T05:46:19+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/\"},\"wordCount\":724,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/wp-content\\\/uploads\\\/2014\\\/10\\\/FeatAccessIntro-768x403-1.jpg\",\"keywords\":[\"accessibility\",\"web accessibility\"],\"articleSection\":[\"Accessibility Series\",\"WordPress\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/\",\"url\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/\",\"name\":\"An Intro to Web Accessibility - RRVasquez\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/wp-content\\\/uploads\\\/2014\\\/10\\\/FeatAccessIntro-768x403-1.jpg\",\"datePublished\":\"2014-10-14T05:46:19+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/#\\\/schema\\\/person\\\/3c0b465921f78585f615ea79027b8b6f\"},\"description\":\"In this new WordPress series, Rachel's first post is an intro to web accessibility, what it is, who it's for, and how we can apply it as theme developers.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/#primaryimage\",\"url\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/wp-content\\\/uploads\\\/2014\\\/10\\\/FeatAccessIntro-768x403-1.jpg\",\"contentUrl\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/wp-content\\\/uploads\\\/2014\\\/10\\\/FeatAccessIntro-768x403-1.jpg\",\"width\":768,\"height\":403},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/2014\\\/10\\\/14\\\/intro-to-web-accessibility\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"An Intro to Web Accessibility\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/#website\",\"url\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/\",\"name\":\"RRVasquez\",\"description\":\"Senior Web Developer & Accessibility Champion\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/#\\\/schema\\\/person\\\/3c0b465921f78585f615ea79027b8b6f\",\"name\":\"rachievee\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/e9bc4f76f3eded02f3f7dbc848af510f1771472f4b8b4e5bfe535f855a8c80b6?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/e9bc4f76f3eded02f3f7dbc848af510f1771472f4b8b4e5bfe535f855a8c80b6?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/e9bc4f76f3eded02f3f7dbc848af510f1771472f4b8b4e5bfe535f855a8c80b6?s=96&d=mm&r=g\",\"caption\":\"rachievee\"},\"sameAs\":[\"https:\\\/\\\/rrvasquez.com\\\/wp\"],\"url\":\"https:\\\/\\\/rrvasquez.com\\\/wp\\\/author\\\/rachievee\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"An Intro to Web Accessibility - RRVasquez","description":"In this new WordPress series, Rachel's first post is an intro to web accessibility, what it is, who it's for, and how we can apply it as theme developers.","robots":{"index":"noindex","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"en_US","og_type":"article","og_title":"An Intro to Web Accessibility - RRVasquez","og_description":"In this new WordPress series, Rachel's first post is an intro to web accessibility, what it is, who it's for, and how we can apply it as theme developers.","og_url":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/","og_site_name":"RRVasquez","article_published_time":"2014-10-14T05:46:19+00:00","og_image":[{"width":768,"height":403,"url":"https:\/\/rrvasquez.com\/wp\/wp-content\/uploads\/2014\/10\/FeatAccessIntro-768x403-1.jpg","type":"image\/jpeg"}],"author":"rachievee","twitter_card":"summary_large_image","twitter_misc":{"Written by":"rachievee","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/#article","isPartOf":{"@id":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/"},"author":{"name":"rachievee","@id":"https:\/\/rrvasquez.com\/wp\/#\/schema\/person\/3c0b465921f78585f615ea79027b8b6f"},"headline":"An Intro to Web Accessibility","datePublished":"2014-10-14T05:46:19+00:00","mainEntityOfPage":{"@id":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/"},"wordCount":724,"commentCount":0,"image":{"@id":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/#primaryimage"},"thumbnailUrl":"https:\/\/rrvasquez.com\/wp\/wp-content\/uploads\/2014\/10\/FeatAccessIntro-768x403-1.jpg","keywords":["accessibility","web accessibility"],"articleSection":["Accessibility Series","WordPress"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/","url":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/","name":"An Intro to Web Accessibility - RRVasquez","isPartOf":{"@id":"https:\/\/rrvasquez.com\/wp\/#website"},"primaryImageOfPage":{"@id":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/#primaryimage"},"image":{"@id":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/#primaryimage"},"thumbnailUrl":"https:\/\/rrvasquez.com\/wp\/wp-content\/uploads\/2014\/10\/FeatAccessIntro-768x403-1.jpg","datePublished":"2014-10-14T05:46:19+00:00","author":{"@id":"https:\/\/rrvasquez.com\/wp\/#\/schema\/person\/3c0b465921f78585f615ea79027b8b6f"},"description":"In this new WordPress series, Rachel's first post is an intro to web accessibility, what it is, who it's for, and how we can apply it as theme developers.","breadcrumb":{"@id":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/#primaryimage","url":"https:\/\/rrvasquez.com\/wp\/wp-content\/uploads\/2014\/10\/FeatAccessIntro-768x403-1.jpg","contentUrl":"https:\/\/rrvasquez.com\/wp\/wp-content\/uploads\/2014\/10\/FeatAccessIntro-768x403-1.jpg","width":768,"height":403},{"@type":"BreadcrumbList","@id":"https:\/\/rrvasquez.com\/wp\/2014\/10\/14\/intro-to-web-accessibility\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/rrvasquez.com\/wp\/"},{"@type":"ListItem","position":2,"name":"An Intro to Web Accessibility"}]},{"@type":"WebSite","@id":"https:\/\/rrvasquez.com\/wp\/#website","url":"https:\/\/rrvasquez.com\/wp\/","name":"RRVasquez","description":"Senior Web Developer & Accessibility Champion","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/rrvasquez.com\/wp\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/rrvasquez.com\/wp\/#\/schema\/person\/3c0b465921f78585f615ea79027b8b6f","name":"rachievee","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/e9bc4f76f3eded02f3f7dbc848af510f1771472f4b8b4e5bfe535f855a8c80b6?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/e9bc4f76f3eded02f3f7dbc848af510f1771472f4b8b4e5bfe535f855a8c80b6?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/e9bc4f76f3eded02f3f7dbc848af510f1771472f4b8b4e5bfe535f855a8c80b6?s=96&d=mm&r=g","caption":"rachievee"},"sameAs":["https:\/\/rrvasquez.com\/wp"],"url":"https:\/\/rrvasquez.com\/wp\/author\/rachievee\/"}]}},"_links":{"self":[{"href":"https:\/\/rrvasquez.com\/wp\/wp-json\/wp\/v2\/posts\/257","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rrvasquez.com\/wp\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rrvasquez.com\/wp\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rrvasquez.com\/wp\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rrvasquez.com\/wp\/wp-json\/wp\/v2\/comments?post=257"}],"version-history":[{"count":0,"href":"https:\/\/rrvasquez.com\/wp\/wp-json\/wp\/v2\/posts\/257\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rrvasquez.com\/wp\/wp-json\/wp\/v2\/media\/4905"}],"wp:attachment":[{"href":"https:\/\/rrvasquez.com\/wp\/wp-json\/wp\/v2\/media?parent=257"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rrvasquez.com\/wp\/wp-json\/wp\/v2\/categories?post=257"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rrvasquez.com\/wp\/wp-json\/wp\/v2\/tags?post=257"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}