Videos

Website Accessibility and Edlio CMS

Added Dec 13, 2017 •

Copy this URL:
Embed code:	<iframe class="edlio-embed-player" type="text/html" width="640" height="360" src="//help.edlio.com/apps/embed/?v=168943" frameborder="0" allowfullscreen></iframe> Change dimensions

Learn about the key guidelines for making your website accessible to all. We go over ADA, Section 508, and what it means for your school or district (spoiler alert: follow WCAG!). Plus, you’ll see how Edlio’s CMS helps ensure your content meets these standards.

Show Transcript

Hi, good afternoon. I'm Brian and I am with Edlio. Thank you so much for joining us today, definitely appreciate it as we learn a little bit more about website accessibility. It's really important, so I wanted to be able to share this presentation to you and give you some tips and suggestions, and how we're helping schools and districts nationwide. Feel free to ask any questions you want to. Just chat me those questions and I'll go ahead and get those answered for you. If I don't have the answer, cause I don't know everything, but our tech team does and they can definitely help you out with any questions you may have. We're Edlio, we have been around for 17 years. We partner with over 8,500 schools and districts nationally. We have a CMS; it is super easy to manage and update. We also have a parent communication app called Sangha. Sangha allows parents to sign forms, make payments, direct messaging the school and the teachers right from their handheld. So what is web accessibility? Well, let's take a look at that. First thing is, we all heard of No Child Left Behind. In this case it is nobody left behind. In fact, accessibility refers to the inclusive practice of removing barriers that prevent interaction with or access to websites. In other words, anyone that comes to your website should be able to access everything on it. Equal access for everyone. That includes even those 2% of the population that is using a screen reader. So, making sure that everyone has access to your website. So, what's the current legislation? Section 508, which I'm sure you're familiar with, Amendment to the Rehabilitation Act of 1973. There's also Section 504 of the Rehabilitation Act, and, of course, ADA, Americans with Disability Act. What's the enforcement? Hopefully none of you have, but some of you may have received a letter from OCR, Office of Civil Rights, telling you that you are in violation because your website is not accessible. I was at a county office yesterday which will go unnamed, but a county office that actually received a notification from OCR as well. So, we're getting calls from districts and schools just about every day asking for our help, so that's why we're having this webinar, to help you understand just what it means and what you can do to make sure your website is accessible. So, ADA compliance. Did you know that there is absolutely no official definition of web accessibility under ADA? You have probably heard that. Yet, multiple DOJ-negotiated lawsuits have been settled, even without that definition. Today's best practice: aim to meet level AA standards set out by the Web Content Accessibility Guidelines, or, known as WCAG 2.0. And, of course, as you know, 2.1 is in the works. So, we have 30 minutes, in fact, I have about 23 minutes left. So, to talk about it in detail; that's really kind of impossible. So, that's not going to happen. So, I'm just going to share with you what it means. First, WCAG is based on these principles. Perceivable. Can all content be processed by all visitors? That's those who are using accessibility helps, it's those that are color blind. Can it be seen by all visitors? All content, not just some of it. We're talking about all content. Operable. Can all visitors navigate and interact with your website? If they can't do that then your website is not accessible. Is it understandable? Is your content and website functionality clearly understandable? Guess what, if it's not, you do not have an accessible website. Is it robust? Does your website work well with assistive technology? And we'll talk a little bit more about that, but does your website work well with assistive technology. Cause if it doesn't, guess what, you're not accessible. So, let's talk about this alternative text images. I'm sure many of you know what that is; some of you may not. We find that most schools and districts are really getting in trouble for not having alternate text for the images. So, alternative text is a description behind a picture, or even a document, a description of what that picture or document is. It's always on top of the do list  for accessibility. Provide alternate text, alt text for short, for non-text objects on the page, and like I said, images. Those who are visually impaired use screen readers to read the webpage for them. Screen readers cannot see the content of an image. So, you may have a beautiful picture of your students working or taking a test or whatever the case may be, and guess what? The screen reader's not going to pick that up unless there's a description or an alt text behind that. The trick is to use them correctly. So, now you ask, "Okay, so how do we use them correctly?" First off, consider the context. Next, don't repeat text from elsewhere on the page. And if the image is purely decorative, leave Alt blank. So if it's just a decorative piece, there to make your site look pretty, make sure you leave that Alt Text blank. And once again, Edlio will help you out with that. We have a setting to ensure all images uploaded to your site are given Alt Text before publishing. Skip navigation link. Screen readers always start at the top of the page and read down. Hearing the site menu is, of course, necessary to navigate the site, but don't read it all out on every single page. Give them the option to skip the header and go straight to the page's content. Usually head down the initial load of your site but can also be styled as a feature for all visitors to use. And again, Edlio has you covered with skip navigation link. Proper page structure. Did you know that accessibility also is talking about the coding on the back end of it? When you're designing a website it's vital, excuse me, that your audience is able to access the pages. That's why it's so important to think about page structure. You especially want to make sure your website is usable to visitors using screen readers. Some things to keep in mind are, the order of your content visually should match how it is presented in code. In other words, it should make sense, not only on the front, but also on the coding section, making sure that it matches. Headers and bullet points, as well as column headers in tables are essential. Don't leave those out. Always make sure to have those headers and bullet points, as well as those column headers. All images and PDFs that we just talked about need alt text. And older pages should be reviewed to bring them up to date according to W3C. And again, Edlio will help you out with that, cause we design every single one of our sites with accessibility in mind. Keyboard navigation. For visitors who cannot use a mouse, ensure all of your content is accessible by keyboard. Have you ever tried that? Have you ever tried to go a few minutes, maybe even 20 minutes or so, just without a mouse? Try it sometime, cause it's really, really difficult. We actually did that as a team, we actually challenged ourselves to turn away the mouse for an hour. Yeah, we pulled out our hair cause it is so difficult. It is eye-opening. It seems difficult and look longer to do everything. One of our employees said it was just weird. And then that last one. At first, I could only imagine how hard it could be but to experience the limitations and frustrations firsthand certainly allowed me to have a great appreciation for an accessible website. My friend Donald, and this is a true story, my friend Donald was born without hands and without feet and he has to use adaptive technology. He can't use the mouse, he has to use a keyboard to navigate a website. So, try that sometime, and see how difficult that is, and is your website, is that navigable by your keyboard and keyboard alone? If it is, great job, you have an accessible website. Needless to say, Edlio sites are keyboard accessible. Color contrast. Tell you another story, my nephew Eric is colorblind. He cannot see certain colors such as red. He cannot see red. So I've seen many sites where they try to bring attention to the items on a website by having it in red. Guess what, my nephew's not going to see that. And many of us men, I don't know what it is, but a lot of men are color blind, so keep that in mind as well. None of us are perfect vision, mine has been changing through the years. Every time I go to the optometrist something's different. I certainly can't read yellow text on the right, however, there is a happy medium between using only black text on a white background and a site that is colorful but hard to read. So, what are the guidelines? Well, WCAG has defined specific contrast levels to follow for small and large text. This applies to text displayed over images. Edlio designs every single site with color contrast in mind, making sure that the correct contrast is used. Like I said, don't rely on color alone. Right here on the right hand side we see homepage alerts, email sender. Well, my nephew Eric, he's not going to see those. So, if something's important, don't use red. Those who are colorblind, like I said, will never ever see the difference. Use bold text, underline things, restructure your content. An easy way to test your page is to view it in black and white. Is important text still standing out? Are error messages or alerts clearly defined? And if they're not, guess what, your website is not accessible. Again, we have you covered. Our designers and product team always test for this. Captions and transcripts for videos. As you notice, right here it says edit closed captions. Are text version of what is spoken in the video, usually displayed within the video player. You go to a lot of video stations now and a lot of those will actually have closed captioning. It's really important, and if your videos do not have closed captioning, then you go ahead and make sure that it does. Make the video accessible to those who cannot hear or hard-of-hearing. I saw a question there, if you have questions just go ahead and feel free to chat that over to me and I'll go ahead and get that answer for you. I will send you over an email. Transcripts are plain text versions of what is spoken in the video. Is it available? If it is, that's important as well to make sure you review that transcript. A lot of time, since it is automated, it may have some funny sayings in it that don't really make sense, so you want to check for correctness as well. And make the content of the video accessible to those who are deaf and blind. Guess what, if you're not using closed captioning, your website is not accessible and you can possibly get a letter from OCR. Forms for all. When we want a visitor to get in touch, most sites offer a contact form. Make sure it's accessible to all, or your prospective family may move on to the next school. A few things to consider: are the fields clearly labeled? It says over here on the right: first name, last name, street address, are they clearly labeled? Can you tab through each field, cause remember, there maybe those filling out this form that only is using the keyboard. So, can you tab through it? Are error messages clear, even for those that are colorblind? So, remember the colors we use. Are those messages clear? And of course, Edlio, we meet those standards. Don't forget your PDFs. [no audio] This one we find is especially tricky for schools. We know you love to scan and upload, and as many sites as we look at, there are so many sites we continually add forms, add PDFs. Some quick guidelines to keep in mind: first, your PDFs need to be as accessible as your web pages. So, let's repeat that. Your PDFs need to be as accessible as your web pages. That means alt text, proper headings, text that can be read by a screen reader. At minimum, a visitor needs to know what is contained in the PDF without actually seeing it. I'll repeat that one. At minimum, a visitor needs to know what's contained in the PDF without actually seeing it. So in other words, with the title, when you title a PDF make sure that it is exactly what it says it is. Make sure you rename those, make sure that you name those properly. And collect user feedback. Last on our list today in accessibility statement you should always add to your site. When passing the statement, make sure that you make it clear to everyone your commitment to providing an accessible website for everyone. Include a point of contact at your school that people can call or email with concerns or suggestions for improving your website. Link to the statement on all pages. I'll repeat that. Link to the statement on all pages. And once again, as we customize our websites, we are sure to make sure that that statement is on there for you, the Statement of Accessibility. So, what's in it for you? A better user experience. Better accessibility equals better user experience. You may have noticed some best accessibility standards overlap with the best practices for user experience. This is one of the reasons we're so passionate about accessibility. When you focus on accessibility, your whole community will benefit from a site that's presented clearly and is easy to navigate. It's so true. So remember, your website should be accessible to everyone. Equal access. Better SEO. Remember, Google is blind, deaf and can't use a mouse. Making your site more accessible means better access for Google, which means your site search engine rankings may improve. All those images with alt text equals more content for your search engines to crawl. Those headers? Well, make sure they contain your top keywords. And those video transcripts? Content, content, and content. Remember, with SEO, Google is looking for updated content. Your numbers will soar through the roof when your content is current. That's making sure that your content on everything you use, even those header or even those video transcripts, even that alt text is there. A better site. When you have an accessible website, everyone benefits. Your whole community can learn about your school or district, enjoy your videos, fill out a contact form, engage with your site and be delighted. It's important as well to make sure your website is a responsive website. Make sure that it responds to whatever device is being used, whether that's a smartphone, an Android, whatever other device you have. Making sure that your visitors are having an optimal experience as they go online using their devices as well. Not all CMS platforms are created equal. We design and code up your site according to WCAG 2.0 AA standards. We create site navigations as accessible by keyboard. We include a skip to main content link. We use color contrast, as I said. We make all sites responsive, like I was just speaking about. Built-in tools include automatic transcripts, alt text, pages that are structured logically, a form builder that automatically adds required labels and has instructions and error handling already included. A lot to digest, right? We did that in 19 minutes, so if you have 11 minutes of questions, that's fine, just go ahead and send those over to me. You can feel free to email me at brian@edlio.com. Feel free to call me as well at 310-573-8920. Thank you so much for your time, we look forward to partnering with you and if you are partnered with us already, thank you very much, we look forward to years of helping you help your parents help their students be successful. Thank you very much, appreciate your time today. Reach out to me if you have any questions.

28:22 [Edlio Webinar] Teacher Pages Featured
Join Edlio for a 30-minute webinar about Teacher Pages. We cover how to create and update Pages, best practices for sharing content, and everything else you need to know to use your Pages to effectively reach parents and students.
Uploaded Mar 20, 2020
30:05 [Edlio Webinar] Teacher Pages Refresher Featured
Join Edlio to learn the ins and outs of the Edlio CMS! You'll leave with actionable steps your school or district can take today to update your website, better engage with parents, and more. Bring your questions for a Q&A session at the end!
Uploaded Jan 24, 2020
27:58 [Edlio Webinar] Teacher Pages for the New School Year Featured
In this 30-minute webinar about Teacher Pages we cover how to create Pages, best practices for sharing content, and everything else you need to know to use your Pages to communicate with parents and students for this upcoming school year, whether classes are held in-person or virtually.
Uploaded Jul 23, 2020. Also listed in Back-to-School
19:29 The Beginner's Guide to Building Pages [Edlio Webinar] Featured
Are you new to Edlio? Or do you want to learn how to improve your skills building Pages? This webinar is for you! In this beginner-friendly session, you'll learn how to:

- Create and update Pages
- Share content effectively
- Organize your Page Management based on your needs

We'll also cover best practices for building Pages that are both informative and engaging.
Uploaded Jun 02, 2023
30:03 [Edlio Webinar] Overview for Administrators Featured
In this Edlio, we highlight how administrators can best use their school or district’s Edlio Website. We share website tips that are easy to implement and can have a big impact on your school or district’s communication with parents and students.
Uploaded Mar 25, 2020

Videos

Website Accessibility and Edlio CMS

More videos in My Edlio Webinars