A web development company that specializes in web
A web development company that specializes in web accessibility and custom software for Word. Press.
What We Do Audit, remediate and build Word. Press websites for Accessibility compliance Teach how to get compliant and stay compliant to companies who use Word. Press Give Word. Press Accessibility talks across the U. S.
OUR STORY • We've attended the (NFB) the last few years and we were very moved at how difficult it is for low-vision people to use software • After that we decided that we needed to make sure all of our sites and software were compliant. (One site at a time!) • That's when we realized how difficult it was to find any information as a developer on how to be Section 508 compliant. • We have been trying to get this information out ever since.
YOUR SEO DEPENDS ON YOUR ACCESSIBILITY AND YOU DIDN’T KNOW IT! By: Joseph
TALK OUTLINE 1. Why SEO and Accessibility are important 2. What SEO and Accessibility have in common 3. Some free tools and resources to help your web accessibility
WHAT IS ACCESSIBILITY & SEO • (WCAG 2. 1) Web Content Accessibility Guidelines - Globally recognized standard that defines how to make Web content more accessible to people with disabilities. • (SEO) Search Engine Optimization is the art and science of making web pages attractive to search engines.
A FEW FACTS: OVER 1. 3 BILLION PEOPLE WORLDWIDE HAVE SOME SORT OF DISABILITY $490 BILLION IN DISPOSABLE INCOME FOR WORKINGAGE PEOPLE WITH DISABILITIES $8 TRILLION IN INCOME OF FRIENDS AND FAMILIES OF PEOPLE WITH DISABILITIES YOU WILL BE DISABLED AT SOME POINT IN YOUR LIFE (Credit: World health organization)
• Page Title Tags • Headings • Descriptive Anchor Text ACCESSIBILITY & SEO COMMONALITIES • Alternative Text • Transcripts • Sitemaps • Good Contrast • Text Size & Spacing • Remove Broken Links • Increase usability for your users
TITLE TAGS Title tags help people and screen readers • Title tags are a way for you to give each page on your site a title. • Title tags make it easier for people using screen readers to quickly understand the differences between multiple pages. SEO Benefits • Your title tag determines your display title in SERPs so a good title can determine if someone clicks on your link. • They tell Google what your page is about • Google loves it when a user clicks a link or spends a lot of time on your page.
GOOD HEADER STRUCTURE Good header structure does the following: • Follows a logical sequence • Does not skip sections (e. g. an “H 4 does not directly follow an H 2) • Accurately describes the content below it SEO Benefits: • Google says that “it’s always beneficial to…break your content up into logical chunks. ” (Source: Google) • Content that matches a user’s intent is one of the most critical elements for good SEO, and headers are a critical element in creating that content.
ANCHOR TEXT Anchor Text Sets User Expectations and Improves Page Relevance • People using a screen reader often navigate a page skipping from link to link. SEO Benefits • Google looks at anchor text of links pointing to a page to know more about the content on the site. • It’s not as important as it use to be, but it still matters.
For a bad example of link descriptions Click Here or Read more… For an example of a good link description follow this link to Johns pool cleaning service.
ALTERNATIVE TEXT Descriptive Alt Text Provides an Opportunity for Context and Keywords • Alternative text is used to add content to all non-content items like images and unique infographics • SEO Benefits • 1/3 of all searches performed in Google are for images • 12. 5% of SERPs show Image Pack results • Google says they use “alt text along with computer vision algorithms and the contents of the page to understand the subject matter of the image. ” Image Publishing Guidelines
ADDING TRANSCRIPTS Add transcripts or closed captions to all videos with audio • Transcripts or Subtitles are very useful for individuals who are deaf SEO Benefits • Adding transcripts to websites improved organic search by 6. 68% • Turning the audio into text creates more content and more keywords • Video transcripts make video content accessible to a far broader base of people.
Create a Sitemap and make sure to submit it to Google SITEMAPS • Sitemaps allows people using a screen reader to navigate a website easily SEO Benefits • XML sitemaps allows search engines to crawl and index a website sufficiently • The more pages that they index from you, the more trust your site gains
GOOD CONTRAST • When adding new content make sure the contrast ratio is at least 4. 5: 1 with text at least 3: 1 SEO Benefits • Bad contrast will make a person leave your site much faster and Google does not like that.
TEXT SIZE & SPACING Make sure your font size is at least 16 px and is spaced 2% between paragraphs, 1. 5% between lines.
REMOVE BROKEN LINKS The most common causes of broken links are: • Making a typo when you created the link • Deleting an image, video, file or an entire web page • Renaming or moving a page and forgetting to update your internal links • Linking to content like images, videos, PDFs, that has been deleted or moved • Changing domain names and moving the site to a new URL How To Fix Broken Links • You can manually remove your broken links • There are plugins that help you remove your broken links
OUR 11 EASY STEPS TO HELP WITH COMPLIANCE 1 -Provide alternative text for non-text content 2 -Label all form elements for input fields 3 -Add closed captions to videos and audio description to animations 4 -Ensure color contrast meets minimum thresholds 5 -Make link text descriptive and underline them 6 -Do not use color as the only indication of meaning 7 -Font size is at least 16 px and spaced properly when enlarged by 200% 8 -Input errors by the user must be identified and explained in text 9 -You should be able to navigate the whole site using only your keyboard 10 -Use flexible time limits for your site, if any, or add an option for more time 11 -Provide skip navigation links to skip repetitive content such as nav menus, etc.
ACCESSIBILITY TESTING TOOLS • Axe Chrome – This is an accessibility testing tool from Deque University. • Wave. webaim. org - This also helps you know where you are having accessibility issues. • Google Lighthouse – This lets you run an accessibility scan for any website and creates a basic report for you. • Contrast Ratio Checker – This is a great contrast ratio checker. You can find it here - https: //contrast-ratio. com/ • WP Accessibility Tools & Alt Text Finder – This plugin has a missing Alt text finder, the tota 11 y testing software from Khan University, a contrast ratio checker and a WCAG 2. 1 checklist.
ACCESSIBILITY TOOLS • Userway. org - This adds a widget on the frontend of your WP site that allows users to navigate your site much easier. • Accessibility Statement Generator – This is a great tool from W 3 C that allows you to create an accessibility statement that you can put in your footer - https: //goo. gl/6 w. Fc. Qp • NVDA - NVDA (Nonvisual Desktop Access) is a free “screen reader” which enables blind and vision impaired people to use computers. www. nvaccess. org • Chrome. Vox - The Chrome. Vox (Classic) screen reader is an extension to Chrome that brings the speed, versatility, and security of Chrome to visually impaired users.
Resources Actual WCAG 2. 1 Guidelines – https: //www. w 3. org/TR/WCAG 21/ DOJ withdrawing their recommendations - https: //goo. gl/eeea. Vd List of lawsuits in the first 2 months of 2018 - https: //goo. gl/8 QEc. EP An article about the 2258 lawsuits in 2019 - https: //bit. ly/2 DAm. Rv. R Comparison table of Section 508 - https: //goo. gl/2 LPJZz Word. Press accessibility info - https: //make. wordpress. org/accessibility/ 21 st Century Integrated Digital Experience Act - H. R. 5759 - https: //goo. gl/QWMzuo Web Accessibility laws by state - http: //bit. ly/adabystate Tax Form 8826 (Disabled Tax Credit) - https: //www. irs. gov/pub/irs-pdf/f 8826. pdf
QUESTIONS?
ONE WEBSITE AT A TIME! Joe@St. Pete. Design. com @Joseph. Lo. Preste
- Slides: 28