Web Accessibility for Designers The focus of web accessibility is often on web development – the things that happen in HTML, CSS, or JavaScript after a site has been designed visually. Optimal accessibility should start much earlier, as part of the visual design process. We have created an infographic that highlights a few important principles of accessible design. Text Version Plan Heading Structure Early Ensure all content and design fits into a logical heading structure. Consider Reading Order The reading order should be the same as the visual order. Provide Good Contrast Be especially careful with light shades of gray, orange, and yellow. Use True Text Whenever Possible True text enlarges better, loads faster, and is easier to translate. Watch the Use of CAPS All caps can be difficult to read and can be read incorrectly by screen readers. Use Adequate Font Size Font size can vary based on the font chosen, but 10 point is usually a minimum. Remember Line Length Don't make it too long or too short. Design Link Focus Indicators
Appropriate use of alternative text Alternative Text Basics Alternative text provides a textual alternative to non-text content in web pages. We will be discussing alternative text for images only, though the principles can be applied to media, applets, or other non-text web content. Alternative text serves several functions: It is read by screen readers in place of images allowing the content and function of the image to be accessible to those with visual or certain cognitive disabilities. It is displayed in place of the image in browsers if the image file is not loaded or when the user has chosen not to view images. The key principle is that computers and screen readers cannot analyze an image and determine what the image presents. Alternative text can be presented in two ways: Within the alt attribute of the img element. This means that the alt attribute (sometimes called the alt tag, though technically this is incorrect) is not the only mechanism for providing the content and function of the image. Important Note Example 1
PowerPoint Accessibility You are here: Home > Articles > PowerPoint Accessibility Introduction Microsoft PowerPoint is one of the most popular tools for creating slide show presentations. It is often used to organize thoughts for a meeting or lesson, to present key points in a live presentation, and even to create handouts. This article outlines how to can make PowerPoint files more accessible on the web. Create Accessible PowerPoint Files Whether you link directly to a PowerPoint file (PPT), or display your presentation in another format like PDF, there are several things that you can do to make your file as accessible as possible. PowerPoint for Mac All versions of PowerPoint for Mac through 2008 have serious accessibility limitations. Slide layouts Every version of PowerPoint since at least 2000 contains a series of highly-accessible slide layouts. PowerPoint 2000-2003 Select or use the sidebar. PowerPoint 2007-2010 Select , or select the , and a menu of slide types will appear. Alternative text for images Notes
PDF Accessibility - Converting Documents to PDF You are here: Home > Articles > PDF Accessibility > Page 2: Converting documents to PDF Overview PDF files are not typically created in Acrobat. Microsoft Word Note The following instructions can also be used to convert PowerPoint files to PDF. The majority of the PDF files on the web were probably created in Microsoft Word. The file must be accessible. Word 2010 Adobe Add-in Important The Acrobat add-in is only available to users who have Acrobat X installed and are using the 32-bit version of Office 2010. The Adobe Add-in, also called PDFMaker, is the best choice to create high-quality tagged PDF files. Select . Or you can select from the Acrobat ribbon. Either one of these options will open the same dialog box. Save as tagged PDF natively Word 2010 allows you to create tagged PDF files without installing Acrobat. To convert to PDF using the Microsoft add-in, Select , and under Word 2007 With the Adobe add-in installed, you can export to PDF one of two ways: Or you can select from the ribbon.
Microsoft Word You are here: Home > Articles > Microsoft Word - Creating Accessible Documents Introduction Microsoft Word is currently the most widely-used word processor on the market. Because it is so common, the .doc format has become the de facto format for text documents. MS Word is often used to create PDF and HTML files for websites. Despite some gains in recent years, creating accessible web content with Word is NOT a straightforward process. About this article The following best practices are provided to help you maximize the accessibility of your Word documents. When you are ready to put these recommendations into practice, select your version of Word from the article contents, or at the bottom of this page. Headings A uniform heading structure is often the most important accessibility consideration in Word documents. Structure through hierarchy Pages should be structured in a hierarchical manner: A is usually a page title or a main content heading. "Headings" created with font styles Notes
Making Your Online Course Accessible Becoming aware of and incorporating just a few design principles is the first step in removing many potential barriers in the web-based materials you create. Providing accessible content is not only useful for students with disabilities, it helps everyone and is just good design! Here are a few introduction to web accessibility resources: Introduction to Web Accessibility from WebAIM: Web Accessibilty in Mind. The Art of Accessibility's web site has a showcase of accessible sites. Accessibility and Software Applications The following links provide information on how to make accessible documents using these applications: Videos about Accessibility Quality Copies for Course Readings 3:32Using good clean originals for course readings is important for student access to the material--especially those students who use screen readers. From Where I Sit A powerful video series of eight CSU students with disabilities who share their experiences in the college classroom. Accessibility Checkers
Teaching Online : Resources : PDF Formatting Guidelines This page will walk you through the process of creating accessible PDF documents. You can either start with a Word document and convert this document to PDF or you can make an existing PDF accessible. Please note that making an existing PDF accessible is more difficult and time consuming than starting with the original Word document. Table of Contents About PDF Documents PDF documents may be appropriate to use in your online course if the document is a form, historical document, or if the document is has a complex layout. How to Create a PDF Starting with a Word Document Step 1: Create a properly formatted Word document Apply the appropriate styles and formatting to your document provided in Step 1 of the Document Formatting Guidelines.If there are tables in your document, follow the steps below to format the tables to ensure accessibility. Step 2: Create a PDF file from your properly formatted Word document Verfiy that Adobe Acrobat Professional has the accessibility setting turned on.
Essential Components of Web Accessibility This document shows how Web accessibility depends on several components working together and how improvements in specific components could substantially improve Web accessibility. It also shows how the WAI guidelines address these components. Introduction It is essential that several different components of Web development and interaction work together in order for the Web to be accessible to people with disabilities. content - the information in a Web page or Web application, including: natural information such as text, images, and sounds code or markup that defines structure, presentation, etc. How the Components Relate Web developers usually use authoring tools and evaluation tools to create Web content. People ("users") use Web browsers, media players, assistive technologies, or other "user agents" to get and interact with the content. There are significant interdependencies between the components; that is, the components must work together in order for the Web to be accessible.