Standards & Accessibility

20.02.2007DMFD

Digital Media: Communication and Design F2007

Comments

HomepageRequirement: include photo in index.html

(today’s assignment)Search engines

HTML validating extension for Firefox Notepad++

Digital Media: Communication and Design F2007

Goals of the lecture

Learn about the standards in the web and the W3C

Learn how to improve the accessibility of our website

Digital Media: Communication and Design F2007

Index

Web standards Accessibility

Digital Media: Communication and Design F2007

Web standards

Called “Recommendations” Set of guidelines to be used in the web HTML, XHTML, CSS…

Digital Media: Communication and Design F2007

Who publishes Recommendations

W3C = World Wide Web Consortium Co-founded in 1994 by Tim Berners-Lee Mission:

To lead the World Wide Web to its full potential by developing protocols and guidelines that ensure long-term growth for the Web

Companies: HP, Boeing, Oracle, Sun, Nokia, Microsoft, Apple, Adobe, MIT…

Digital Media: Communication and Design F2007

Digital Media: Communication and Design F2007

Why should we use standards

Accessibility is improvedDisplay of content is optimized for every

device Websites are easier to maintain

Easier to introduce changesCost is reduced

Digital Media: Communication and Design F2007

Why should we use standards II

Maximize compatibility with future browsers

No need to design different versions for different browsers

Reduced size Search engines optimization

Digital Media: Communication and Design F2007

HTML Recommendations

HTML 4.01StrictTransitionalFrames

Digital Media: Communication and Design F2007

XHTML Recommendations

XHTML 1.0StrictTransitionalFrames

XHTML 1.1Strict

XHTML 2.0

Digital Media: Communication and Design F2007

Acid2 test

Acid2 browser test Checks if the browser is compliant with the

most common web standardsOperaFirefox 3.0Safari/Konqueror

Digital Media: Communication and Design F2007

Index

Web standards Accessibility

Digital Media: Communication and Design F2007

Accessibility

“The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.” – Tim Berners-Lee

Digital Media: Communication and Design F2007

Why

The web is a very important resource: InformationEducationGovernmentCommerce

Provide equal access and equal opportunities to everybody

Digital Media: Communication and Design F2007

W3C

Web Accessibility Initiative (WAI) Strategies, guidelines, and resources to

help make the Web accessible to people with disabilities

Accessibility techniques should be planned from the beginning

Digital Media: Communication and Design F2007

Three components

ATAG Authoring Tools Accessibility Guidelines Tools used to create web content

WCAG Web Content Accessibility Guidelines

UAAG User Agent Accessibility Guidelines Web browsers, media players…

Digital Media: Communication and Design F2007

WCAG

How to make web content accessible by people with disabilities

14 guidelinesEach guideline has checkpointsEach checkpoint is assigned a priority

Guidelines Sorted by priorities

Digital Media: Communication and Design F2007

8 quick tips

1. Page organization: XHTML provides structure, CSS provides presentation

2. Images: use the alt attribute (required in XHTML 1.0)

3. Graphs and charts: use longdesc attribute to explain the contents

4. Use contrasted colours (BBC)

Digital Media: Communication and Design F2007

8 quick tips (cont’d)

5. Hypertext links: use text that has a meaning (avoid “click here”)

6. Scripts and plug-ins: information should be accessible when they are disabled

7. Frames: use the noframes element (or avoid frames at all ;)

8. Validate your code

Digital Media: Communication and Design F2007

Demo using JAWS

Digital Media: Communication and Design F2007

Coffee!!