Is Your Site Accessible? Validating Your Web Site.

Slides:



Advertisements
Similar presentations
AHEAD HTML Accessibility Topics: Keyboard Accessibility Content and Structure Links Headings and Lists Images in HTML Pages Tables Forms.
Advertisements

Designing Websites Using HTML and FrontPage A Typical Webpage View Source A webpage is a text file containing instructions to tell a computer how the.
Authoring Languages and Web Authoring Software 4.01 Examine web page development and design.
HTML5 and CSS3 Illustrated Unit B: Getting Started with HTML
Introduction to Web Accessibility. What is Web Accessibility Web accessibility means that people with disabilities can use the Web Disabilities including.
Introduction to Web Site Development Steven Emory Department of Computer Science California State University, Los Angeles Lecture 4: Tables and Frames.
COMP101 – Exploring Multimedia and Internet Computing LA2 (Thur 14:00 – 16:50) TA: Jackie Lo.
Building Accessibility Into The Workflow Rick Ells Computing & Communications University of Washington Seattle, Washington
Web Accessibility Tests Using the Firefox Browser ACCESS to Postsecondary Education through Universal Design for Learning.
CM143 - Web Week 11 Accessibility Priority Checkpoints.
Making The Web Usable By Everyone (Including people with disabilities, people with slow net connections, people with broken mice, etc.) Gregory C. Lowney,
ETT 429 Spring 2007 Web Design I.
IV. “Regular” Web Pages: HTML A Web Accessibility Primer: Usability for Everyone Office of Web Communications.
Glencoe Digital Communication Tools Create a Web Page with HTML Chapter Contents Lesson 4.1Lesson 4.1 Get Started with HTML (85) Lesson 4.2Lesson 4.2 Format.
Chapter 14 Introduction to HTML
Unit 2, Lesson 5 Website Development Tools AOIT Web Design Copyright © 2008–2012 National Academy Foundation. All rights reserved.
Universal Design & Web Accessibility Iain Murray Kerry Hoath Iain Murray Kerry Hoath.
Creating Tables in a Web Site Using an External Style Sheet
Creating a Simple Page: HTML Overview
HTML & CSS A brief introduction. OUTLINE 1.What is HTML? 2.What is CSS? 3.How are they used together? 4.Troubleshooting/Common problems 5.More resources.
_______________________________________________________________________________________________________________ E-Commerce: Fundamentals and Applications1.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
Alternative Views of the Web Jon Gunderson, Ph.D. Division of Rehabilitation-Education Services University of Illinois at Urbana/Champaign.
Planning an Accessible Website: Beyond Alt Tags Stephanie M. Randolph School of Health, Physical Education, and Recreation Indiana University.
Chapter 18 Web Design April 16 th & 17 th. Content The most essential element of any Web page is the content Before you begin a Web page you want to know.
Lesson 4: Using HTML5 Markup.  The distinguishing characteristics of HTML5 syntax  The new HTML5 sectioning elements  Adding support for HTML5 elements.
The Internet Writer’s Handbook 2/e Web Accessibility Writing for the Web.
Website Development with Dreamweaver
Learning Web Design: Chapter 4. HTML  Hypertext Markup Language (HTML)  Uses tags to tell the browser the start and end of a certain kind of formatting.
Web Accessiblity Carol Gordon SIU Medical Library.
Design and Construction of Accessible Web Sites Michael Burks Chairman Internet Society SIG For Internet Accessibility for People with Disabilities June.
Visual Web Design Dreamweaver Level 2. Hospitality Restrooms Food and Drink Turn cell phones off or set to vibrate Smoking Comfort Breaks Class Hours.
Is Your Site Accessible? Web Site Testing for Accessibility Presented by: The NYS Forum IT Accessibility Committee The NYS Forum Webmasters Guild Northeast.
Everything in it’s right place Revisiting website accessibility Jeff Coburn Senior Web Specialist Institute for Community Inclusion.
Section 508 requirements for Federal Website Design Jon Brundage MDCFUG 4/10/01.
INTRODUCTION TO HTML5 Semantic Layout in HTML5.  The new semantic layout in HTML5 refers to a new class of elements that is designed to help you understand.
Overview of the web accessibility guidelines at RMIT: W3C's WAI Level A Conformance Praneeth Putlur Rajiv Pandya Rohit Sharma.
WEB ACCESSIBILITY. WHAT IS IT? Web accessibility means that people with disabilities can use the Web. Web accessibility encompasses all disabilities that.
HTML: Hyptertext Markup Language Doman’s Sections.
Ali Alshowaish. What is HTML? HTML stands for Hyper Text Markup Language Specifically created to make World Wide Web pages Web authoring software language.
Retrofitting Websites for Accessibility David Mulder, Academic Technology Services.
Louisa Lambregts, Louisa Lambregts
INTRODUCTION TO CSS. TOPICS TO BE DISCUSSED……….  Introduction Introduction  Features of CSS Features of CSS  Creating Style Sheet Creating Style Sheet.
How the Web Works Building a Website – Lesson 1. How People Access the Web Browsers People access websites using software called a web browser. To view.
INTRODUCTORY Tutorial 5 Using CSS for Layout and Printing.
Are You Smarter Than a 5 th Grader? 1,000,000 5th Grade HTML 5th Grade Syntax 4th Grade HTML 4th Grade Syntax 3rd Grade HTML 3rd Grade Syntax 2nd Grade.
Introduction to HTML. _______________________________________________________________________________________________________________ 2 Outline Key issues.
Accessibility Mohammed Alabdulkareem
CSS Cascading Style Sheets A very brief introduction CSS, Cascading Style Sheets1.
Introduction to Web Site Development John Hurley Department of Computer Science California State University, Los Angeles Lecture 4: Favicons Tables and.
A centre of expertise in digital information managementwww.ukoln.ac.uk Accessibility and Usability For Web Sites: An Introduction to Web Accessibility.
Cascading Style Sheets (CSS) EXPLORING COMPUTER SCIENCE – LESSON 3-5.
JavaScript Introduction and Background. 2 Web languages Three formal languages HTML JavaScript CSS Three different tasks Document description Client-side.
Introduction to HTML Dave Edsall IAGenWeb County Coordinator’s Conference June 30, 2007.
HTML5 and CSS3 Illustrated Unit B: Getting Started with HTML.
HTML LAYOUTS. CONTENTS Layouts Example Layout Using Element Example Using Table Example Output Summary Exercise.
Accessibility Basics on creating accessible websites Accessibility Seth Duffey presentation for MAG Telecommunications.
MIT 511- Web Design & Usability
Web Basics: HTML/CSS/JavaScript What are they?
Unit 2, Lesson 5 Website Development Tools
Introduction to Web Accessibility
Unit 2, Lesson 5 Website Development Tools
Web Programming– UFCFB Lecture 9
Web Content Accessibility Beata M. Ofianewska (DG COMM) 7 December 2006 December 2006 COMM C2.
Computer communications
Web Programming– UFCFB Lecture 9
Web Programming and Design
© 2017, Mike Murach & Associates, Inc.
HTML5 and CSS3 Illustrated Unit B: Getting Started with HTML
Presentation transcript:

Is Your Site Accessible? Validating Your Web Site

Is Your Site Accessible? OBJECTIVE: The learner will list three reasons to validate a web page

What is “validation?” Usually involves using a computer program to review the HTML code on the page, based on standards Notes deficiencies in HTML Notes deficiencies in design Notes accessibility problems

What is “validation?” If you use a page authoring program, it probably does some validation for you: As this screen shot from Macromedia’s Dreamweaver shows.

Items requiring human judgment during validation Do the page background and text colors provide sufficient contrast to be legible? Is the page using color to provide information? Will the audience be able to understand the terms and language you’re using?

Items requiring human judgment during validation Are acronyms explained? Is the navigation strategy you’re using clear to visitors? Does the site look the same in all browsers?

Items requiring human judgment during validation If the site uses a client-side SCRIPT (e.g., JavaScript), does it also include a NOSCRIPT option providing the same information or function of the script for users without script-handling capabilities? Web-enabled cell-phones and PDAs Web TV (yes, it’s still out there!) “Malware-phobes”

Items examined in validation HTML code – is it correct? Element syntax correct? Are elements requiring both opening and closing tags properly closed? Do elements span paragraphs, etc.? Are elements in proper order? Attribute syntax correct? Attribute contain valid values? Attribute allowed?

Items examined in validation Images Do they include ALT attributes? ALT attribute values sufficiently descriptive? Should the image also have a LONGDESC attribute (i.e., a link to a file containing a more detailed description than will fit in ALT attribute) Is the image being used as a link? Does all of the information still come through if you turn off images in your browser?

Items examined in validation Does the page linearize properly? If table is used for layout, does information flow in the order it is intended to? If a data table is included in page, does information flow in the order it is intended to?

Items examined in validation Do tables include contextual information? Is the SCOPE attribute used for row and column headings? Is the HEADER attribute used with ID to provide context?

Items examined in validation Can the page be understood if the visitor cannot/does not use scripts or style sheets? Can test with (some) browsers Pages relying on scripts should also include provisions for those using no scripts Pages laid out with style sheets must also make sense when user agent does not accommodate style sheets.

Why Validate? Most accessibility errors will NOT be visible on the page Validation catches HTML errors too Can you tell which images on this page are accessible and which are not?

Which images are accessible? NOT accessible! ACCESSIBLE! (HINT: What other problem might this slide have if it were a web page?)

What FREE tools are available? W3C Validator (

What FREE tools are available? Web Design Group HTML Validator

What FREE tools are available? W3C CSS Validator (downloadable)

What FREE tools are available? Bobby (single page only)

What FREE tools are available? Cynthia Says

What FREE tools are available? W3C’s Link Checker

QUIZ