SF State - Accessible Technology Initiative (ATI)

Image: Photos of the SF State campus and students using a headset, a braille keyboard and a blind cane

SF State Web Accessibility Standards - Tutorials and Resources

Check Point a Check Point b Check Point c Check Point d
Check Point e Check Point  f Check Point g Check Point h
Check Point i Check Point j Check Point k Check Point l
Check Point m Check Point n Check Point o Check Point p
Check Point 1 Check Point 2 Check Point 3 Check Point 4
Check Point 5 Check Point 6 Check Point 7 Check Point 8

 

The primary tutorials referenced on this pager are from Lynda.com and WebAim. As an option you might prefer to check out Dev.Opera or Web Accessibility Center, (WAC)Tutorials. Perhaps you might like something on the lighter side, check out Webcredibles comic strips for a fun international take on web accessibility.


(a) A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content).

Lynda.com working with alternate text video tutorials

Linda.com tutorials can be accessed for free when at SF State or on the CSU network or a VPN connection.

Text tutorials for long description

Text tutorial for working with images

Back to top


 

(b) Equivalent alternatives for any multimedia presentation shall be synchronized with the presentation.

Text tutorials for multimedia

Back to top


 

(c) Web pages shall be designed so that all information conveyed with color is also available without color, for example from context or markup.

Text tutorials for color

Back to top


(d) Documents shall be organized so they are readable without requiring an associated style sheet.

Text tutorials for cascading style sheets

Back to top


 

 (e) Redundant text links shall be provided for each active region of a server-side image map.

SF State does not support the use of server-side image maps.

Text tutorial for server-side image maps

Back to top


 

(f) Client-side image maps shall be provided instead of server-side image maps except where the regions cannot be defined with an available geometric shape.

Text tutorial for image maps

Back to top


(g) Row and column headers shall be identified for data tables.

Lyndia.com working with tables video tutorials

Linda.com tutorials can be accessed for free when at SF State or on the CSU network or a VPN connection.

Text tutorials for working with tables

Back to top


 

(h) Markup shall be used to associate data cells and header cells for data tables that have two or more logical levels of row or column headers.

Text tutorials for working with tables

Back to top


 

(i) Frames shall be titled with text that facilitates frame identification and navigation.

Text tutorials for frames

Back to top


 

(j) Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz.

Text tutorials for screen flicker

Back to top


 

(k) A text-only page, with equivalent information or functionality, shall be provided to make a web site comply with the provisions of this part, when compliance cannot be accomplished in any other way. The content of the text-only page shall be updated whenever the primary page changes.

San Francisco State does not endorse the use of text only equivalent.

Text tutorial for text only pages

Back to top


 

(l) When pages utilize scripting languages to display content, or to create interface elements, the information provided by the script shall be identified with functional text that can be read by assistive technology.

Text tutorial for JavaScript

Back to top


 

(m) When a web page requires that an applet, plug-in or other application be present on the client system to interpret page content, the page must provide a link to a plug-in or applet that complies with §1194.21(a) through (l).

Text tutorial for applets and plug-ins

Back to top


 

(n) When electronic forms are designed to be completed online, the form shall allow people using assistive technology to access the information, field elements, and functionality required for completion and submission of the form, including all directions and cues.

Text tutorial for forms

Back to top


 

 (o) A method shall be provided that permits users to skip repetitive navigation links.

Text tutorials for skip link navigation

Back to top


 

 (p) When a timed response is required, the user shall be alerted and given sufficient time to indicate more time is required.

Text tutorial for timed response

WAC Tutorial: Using Time Out Scripts

Back to top


 

Additional SF State Accessibility Guidelines


(1) Validate your HTML

Pages should pass HTML validation (from W3C). If they do not pass, you need to give a reason why the code cannot validate. You can use this link to run validation tests on your website.

http://validator.w3.org/

Back to top


 

(2) Create meaningful page titles

Page titles should contain unique, short and meaningful descriptions of the content or purpose of the page.

Text tutorialsw for meaningful page titles

Back to top


 

(3) Use meaningful and unique text for links

Every link on your page should contain unique and meaningful text for that link. Rather than using text like, "Click Here" provide the full title of the website or document that you are linking to on the page.

Web Access Center: Links

Jim Thatcher: Click Here and Other Link Text

SSB BART Group: On the Accessibility of Links

Back to top


 

(4) Ensure there is adequate color contrast on the page

Lyndia.com color contrast video tutorials

Linda.com tutorials can be accessed for free when at SF State or on the CSU network or a VPN connection.

Text tutorial for working with color contrast

Back to top


 

(5) Inform the user about pop-ups or new windows

The user should be informed when a link will open in a new window.

Text tutorials for pop-up windows

Back to top


 

(6)Create accessible PDF, Word and PowerPoint Files

Text tutorials for accessible documents

Back to top


 

(7) Create structured content

Text tutorials for structured content

Back to top


 

(8) Ensure logical reading order of layout tables

Webaim: Linearization

 

Back to top

SF State Home