⠀㠀 㠀尩 586-0780 -...

25

Transcript of ⠀㠀 㠀尩 586-0780 -...

Page 1: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility
Presenter
Presentation Notes
Presentation by: Blaine Fergerstrom, Technical Analyst Program Management Center for Excellence Enterprise Technology Services pmce.Hawaii.gov [email protected] (808) 586-0780
Page 2: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Aloha and thank you for joining me this morning My name is Blaine Fergerstrom, I work for the state

Enterprise Technology Services project management office I have been a commercial webmaster in the Hawaii market

since 1994, having built some of the earliest commercial websites in the state

I have no official authority to speak for the State of Hawaii; I have no authority to set policy

I am not a lawyer; I don’t consider myself an accessibility expert, just a very experienced webmaster

My presentation includes information on how I try to accommodate my customers, whenever possible

For official State of Hawaii guidance on website accessibility, please see CIO memo of Jun. 29, 2015 and Comptroller memo of Aug. 2010.

http://pmce.hawaii.gov/wp-content/uploads/2015/10/OIMT-CORR_15.0070-150630.pdf

About This Presentation

Page 3: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Overview (The Right Attitude) Basic Website Accommodations

Accessibility Page Site Map

Content: Alt Tags on Images Descriptive text on links Color and contrast

Uploaded Media Uploaded Microsoft Office documents Uploaded PDFs Scanned Documents Video (& Audio) Transcripts & Closed Captioning

Topics

Page 4: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Information should be made available to all constituents, equally

The state endeavors to service all customers in the best way possible

Make a reasonable effort to accommodate all constituents

Inclusiveness

Page 5: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Accessibility link at the top of every site Leads to a statement of accessibility page Includes specific contact person’s name, phone number, email info This person will assist in providing access to a document or

information should a client request it Page could include link to a “Site Map” page with text links to all

pages and posts on site (simplified site navigation page)

Basic Website Accommodations

Page 6: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Basic Website Accommodations

Page 7: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Basic Website Accommodations

Page 8: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Basic Website Accommodations

Page 9: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

“Alt Tag” on every image The “alt tag” appends a text explanation to an image on a website The image contains no text, even if it is a picture of some text The alt tag adds text associated with the image to the website code

which displays the image in the background An alt tag is looked for and read by screen reading equipment which

vocalizes website content (for blind site visitors) With no associated alt tag, screen reading equipment simply states:

“Image,” to the blind site visitor, who then has no idea of the image content or importance

Accessible Content

Page 10: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Accessible Content: Alt Tags

Page 11: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Accessible Content: Alt Tags

Page 12: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Accessible Content: Alt Tags

Page 13: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Accessible Content: Alt Tags

Page 14: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Don’t create links which say only, “Click Here” [Click Here]

You should always tell the site visitor where they will be taken if they click your link Download a PDF version of this document

Descriptive Link Text

Page 15: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Website visitors may be colorblind Never use color as the sole indicator of importance

or for a call to action Only the red items are required; green items are optional

Choose site colors mindfully, avoiding low contrast between foreground and background colors

Offer simple navigation alternatives (like the Site Map page)

Color & Contrast

Page 16: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

The list below is a summary of the topics to address while creating an accessible Word document. For more details read Microsoft's Word accessibility guide.

Add alternative text for all objects and images (images, tables, charts, clip art, shapes, SmartArt graphics, groups, embedded objects, ink, video, and audio.

Specify column header rows in tables. Use styles in long documents. Use short titles in headings. Use heading styles in the correct order. Use meaningful and descriptive hyperlink text. Web URLs are acceptable if the

document is meant to be printed. Use a simple table structure. Do not use blank table cells for formatting. Avoid using repeated blank characters. Avoid image watermarks. Use closed captions for any audio or video.

Accessible Word Documents

http://www.cityoftacoma.org/cms/One.aspx?portalId=169&pageId=38981

Page 17: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

The list below is a summary of the topics to address while creating an accessible Excel document. For more details read Microsoft's Excel accessibility guide.

Add alternative text for all objects and images (images, tables, charts, clip art, shapes, SmartArt graphics, groups, embedded objects, ink, video, and audio.

Specify column header information in tables. Use meaningful and descriptive hyperlink text. Web URLs are acceptable if

the document is meant to be printed. Avoid using blank cells, rows, or columns for formatting. Give all sheet tabs unique names. Include closed captions for all audio and video.

Accessible Excel Documents

http://www.cityoftacoma.org/cms/One.aspx?portalId=169&pageId=38981

Page 18: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

The list below is a summary of the topics to address while creating an accessible PowerPoint document. For more details read Microsoft's PowerPoint accessibility guide.

Add alternative text for all objects and images (images, tables, charts, clip art, shapes, SmartArt graphics, groups, embedded objects, ink, video, and audio.

Specify column header information in tables. Ensure that all slides have unique titles. Use simple table structure. Use meaningful and descriptive hyperlink text. Web URLs are acceptable if the

document is meant to be printed. Avoid using blank cells for formatting. Include closed captions for all audio and video. Increase visibility for colorblind viewers. Ensure the reading order of each slide is logical.

Accessible PowerPoint Documents

http://www.cityoftacoma.org/cms/One.aspx?portalId=169&pageId=38981

Page 19: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Before saving your Office document as a PDF, you may also check its current accessibility status. From within Word, Excel, or PowerPoint:

Click File. Click Info. Click Check for Issues. Click Check for Accessibility. Use the menu on the right to navigate through and correct any accessibility

issues.

Check Office Docs for Accessibility

http://www.cityoftacoma.org/cms/One.aspx?portalId=169&pageId=38981

Page 20: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

To save an accessible Office document as a PDF:

Click the File tab. Click Save As. Select PDF from the Save as type dropdown. Click Options. Check the box for Document structure tags for accessibility. Click OK. Click Save.

Accessible PDF Files from Microsoft Office

http://www.cityoftacoma.org/cms/One.aspx?portalId=169&pageId=38981

Page 21: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

For those who have access to it, Adobe Acrobat offers very robust tools that assist in creating accessible PDFs.

Acrobat DC Accessibility Guide

Adobe Acrobat Accessibility

http://www.cityoftacoma.org/cms/One.aspx?portalId=169&pageId=38981

Page 22: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Video Transcript & Closed Captioning

• http://www.shaka.me/pmce/request/• http://www.shaka.me/pmce/request/PMCE-Request-Form.pdf

Page 23: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Video Transcript & Closed Captioning

• http://www.shaka.me/pmce/request/• http://www.shaka.me/pmce/request/PMCE-Request-Form.pdf

PowerPointSlide Notes contain script which is read with the visual as it appears in the video, making transcription simple. Offer the PowerPoint presentation with notes as the transcript.

Page 24: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Some tools and resources collected from around the web:

http://www.ada.gov/pcatoolkit/chap5toolkit.htm http://www.hhs.gov/web/section-508/ http://www.hhs.gov/web/section-508/making-files-accessible/index.html http://www.w3.org/WAI/ER/tools/ http://www.disabilityscoop.com/2014/04/17/ranking-disability-services/19288/ http://wave.webaim.org/ http://webaim.org/standards/508/checklist http://health.hawaii.gov/dcab/ada-coordination/ http://health.hawaii.gov/dcab/ada-coordination/state-of-hawaii-ada-resources/governors-directives/ http://health.hawaii.gov/dcab/ada-coordination/state-of-hawaii-ada-resources/guidance-on-web-site-

accessibility/ http://www.lynda.com/Dreamweaver-tutorials/web-accessibility-principles/448-

2.html?srchtrk=index:1%0Alinktypeid:2%0Aq:section%2B508%0Apage:1%0As:relevance%0Asa:true%0Aproducttypeid:2

http://www.bobby-approved.com/ https://www.google.com/search?q=bobby+website+accessibility&ie=utf-8&oe=utf-8 http://www.powermapper.com/products/sortsite/ads/acc-accessibility-

testing/?gclid=cmchl_x39sucfrktfgod_bgayq http://www.powermapper.com/products/sortsite/checks/accessibility-checks/ https://en.wikipedia.org/wiki/Access_key https://wordpress.org/plugins/search.php?q=ada https://wordpress.org/plugins/search.php?type=term&q=accessibility

Website Accessibility Tools

Page 25: ⠀㠀 㠀尩 586-0780 - hawaii.govitg.hawaii.gov/wp-content/uploads/2015/10/Web-Access-Presentation... · Overview (The Right Attitude) Basic Website Accommodations Accessibility

Mahalo!

Q&A

Blaine Fergerstrom, Technical AnalystProgram Management Center for ExcellenceEnterprise Technology [email protected](808) 586-0780