Accesibility Report

Page 1

Accessibility Report

This report is a compilation of test results gathered using the following tools: • • • • • •

W3C Markup Validator W3C CSS Validator Google Chrome Accessibility Report Extension Fujitsy Color Selector legibility test Online Utility Readability Test WAVE – Web Accessibility Eavluation Tool


[Invalid] Markup Validation of index.html - W3C Markup Val...

http://validator.w3.org/check

Markup Validation Service Check the markup (HTML, XHTML, …) of Web documents

Jump To:

Validation Output

Errors found while checking this document as XHTML 1.0 Transitional! Result:

5 Errors, 3 warning(s) /Users/Amanda/schoolwork/Amanda Browse… Accessibility Sit

File :

Encoding :

Use the file selection box above if you wish to re-validate the uploaded file index.html

utf-8

XHTML 1.0 Doctype : Transitional Root Element: Root Namespace:

(detect automatically) (detect automatically)

html http://www.w3.org/1999/xhtml The W3C validators are developed with assistance from 2692 the Mozilla Foundation, and supported by community donations.

Donate and help us build better tools for a better web.

Options Show Source

Validate error pages

Show Outline

Verbose Output

List Messages Sequentially Messages by Type

Group Error

Clean up Markup with HTML-Tidy

Help on the options is available.

Revalidate

↑ TOP

Validation Output: 5 Errors Line 22, Column 27: there is no attribute "alt"

1 of 5

07/12/2011 17:11


[Invalid] Markup Validation of index.html - W3C Markup Val...

http://validator.w3.org/check

✉ <div class="logo" alt= " Web Accessibility Resource Center Logo"> You have used the attribute named above in your document, but the document type you are using does not support that attribute for this element. This error is often caused by incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Transitional" document type to get the "target" attribute), or by using vendor proprietary extensions such as "marginheight" (this is usually fixed by using CSS to achieve the desired effect instead). This error may also result if the element itself is not supported in the document type you are using, as an undefined element will have no supported attributes; in this case, see the element-undefined error message for further information. How to fix: check the spelling and case of the element and attribute, (Remember XHTML is all lower-case) and/or check that they are both allowed in the chosen document type, and/or use CSS instead of this attribute. If you received this error when using the <embed> element to incorporate flash media in a Web page, see the FAQ item on valid flash.

Line 22, Column 67: document type does not allow element "div" here; missing one of "object", "applet", "map", "iframe", "button", "ins", "del" start-tag

✉

<div class="logo" alt="Web Accessibility Resource Center Logo" > The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element. One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").

2 of 5

07/12/2011 17:11


[Invalid] Markup Validation of index.html - W3C Markup Val...

http://validator.w3.org/check

Line 27, Column 35: there is no attribute "alt"

<li class="visual-list" alt= " Visual Impairment Link"><a href="visual.html… You have used the attribute named above in your document, but the document type you are using does not support that attribute for this element. This error is often caused by incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Transitional" document type to get the "target" attribute), or by using vendor proprietary extensions such as "marginheight" (this is usually fixed by using CSS to achieve the desired effect instead). This error may also result if the element itself is not supported in the document type you are using, as an undefined element will have no supported attributes; in this case, see the element-undefined error message for further information. How to fix: check the spelling and case of the element and attribute, (Remember XHTML is all lower-case) and/or check that they are both allowed in the chosen document type, and/or use CSS instead of this attribute. If you received this error when using the <embed> element to incorporate flash media in a Web page, see the FAQ item on valid flash.

Line 80, Column 64: cannot generate system identifier for general entity "TopicID"

…//www.afb.org/section.asp?SectionID=4& T opicID=167" target="_new"><acronym titl… An entity reference was found in the document, but there is no reference by that name defined. Often this is caused by misspelling the reference name, unencoded ampersands, or by leaving off the trailing semicolon (;). The most common cause of this error is unencoded ampersands in URLs as described by the WDG in "Ampersands in URLs". Entity references start with an ampersand (&) and end with a semicolon (;). If you want to use a literal ampersand in your document you must encode it as "&" (even inside URLs!). Be careful to end entity references with a semicolon or your entity reference may get interpreted in connection with the following text. Also keep in mind that named entity references are case-sensitive; &Aelig; and æ are different characters. If this error appears in some markup generated by PHP's session handling code, this article has explanations and solutions to your problem. Note that in most documents, errors related to entity references will trigger up to 5 separate messages from the Validator. Usually these will all disappear when the original problem is fixed.

3 of 5

07/12/2011 17:11


[Invalid] Markup Validation of index.html - W3C Markup Val...

http://validator.w3.org/check

Line 80, Column 64: general entity "TopicID" not defined and no default entity

…//www.afb.org/section.asp?SectionID=4& T opicID=167" target="_new"><acronym titl… This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.

Line 80, Column 71: reference not terminated by REFC delimiter

…fb.org/section.asp?SectionID=4&TopicID = 167" target="_new"><acronym title="Amer… If you meant to include an entity that starts with "&", then you should terminate it with ";". Another reason for this error message is that you inadvertently created an entity by failing to escape an "&" character just before this text.

Line 80, Column 71: reference to external entity in attribute value

…fb.org/section.asp?SectionID=4&TopicID = 167" target="_new"><acronym title="Amer… This is generally the sign of an ampersand that was not properly escaped for inclusion in an attribute, in a href for example. You will need to escape all instances of '&' into '&'.

Line 80, Column 71: reference to entity "TopicID" for which no system identifier could be generated

…fb.org/section.asp?SectionID=4&TopicID = 167" target="_new"><acronym title="Amer… This is usually a cascading error caused by a an undefined entity reference or use of an unencoded ampersand (&) in an URL or body text. See the previous message for further details.

Line 80, Column 63: entity was defined here …://www.afb.org/section.asp?SectionID=4 & TopicID=167" target="_new"><acronym tit…

↑ TOP

Home

About...

News

Docs

Help & FAQ

Feedback

Contribute

This service runs the W3C Markup Validator, v1.2+hg. COPYRIGHT © 1994-2011 W3C® (MIT, ERCIM, KEIO), ALL RIGHTS RESERVED. W3C LIABILITY, TRADEMARK, DOCUMENT USE AND SOFTWARE LICENSING RULES APPLY. YOUR INTERACTIONS WITH THIS SITE ARE IN

4 of 5

07/12/2011 17:11


[Invalid] Markup Validation of index.html - W3C Markup Val...

http://validator.w3.org/check

ACCORDANCE WITH OUR PUBLIC AND MEMBER PRIVACY STATEMENTS.

5 of 5

07/12/2011 17:11


[Valid] Markup Validation of index.html - W3C Markup Validator

http://validator.w3.org/check

Markup Validation Service Check the markup (HTML, XHTML, …) of Web documents

Jump To:

Congratulations · Icons

This document was successfully checked as XHTML 1.0 Transitional! Result:

Passed Browse…

File :

Use the file selection box above if you wish to re-validate the uploaded file index.html

Encoding : Doctype : Root Element: Root Namespace:

utf-8

(detect automatically)

XHTML 1.0 Transitional

(detect automatically)

html http://www.w3.org/1999/xhtml The W3C validators are hosted on server technology donated by HP, and

2694

supported by community donations. Donate and help us build better tools for a better web.

Options Show Source

Show Outline

List Messages Sequentially

Group Error Messages by Type

Validate error pages

Verbose Output

Clean up Markup with HTML-Tidy

Revalidate

Help on the options is available.

Congratulations The uploaded document "index.html" was successfully checked as XHTML 1.0 Transitional. This means that the resource in question identified itself as "XHTML 1.0 Transitional" and that we successfully performed a formal validation of it. The parser implementations we used for this check are based on OpenSP (SGML/XML) and libxml2 (XML). "valid" Icon(s) on your Web page

To show your readers that you have taken the care to create an interoperable Web page, you may display this icon on any page that validates. Here is the HTML you could use to add this icon to your Web page: <p> <a href="http://validator.w3.org/check?uri=referer"><img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Transitional" height="31" width="88" /></a> </p>

A full list of icons, with links to alternate formats and colors, is available: If you like, you can download a copy of the icons to keep in your local web directory, and change the HTML fragment above to reference your local image rather than the one on this server. See also our help items related to documents transferred over secure protocols for these icons and the "uri=referer" feature. Validating CSS Style Sheets

If you use CSS in your document, you can check it using the W3C CSS Validation Service. ↑ TOP

1 of 2

09/12/2011 00:23


[Valid] Markup Validation of index.html - W3C Markup Validator

Home

About...

News

Docs

http://validator.w3.org/check

Help & FAQ

Feedback

Contribute

This service runs the W3C Markup Validator, v1.2+hg. COPYRIGHT © 1994-2011 W3C® (MIT, ERCIM, KEIO), ALL RIGHTS RESERVED. W3C LIABILITY, TRADEMARK, DOCUMENT USE AND SOFTWARE LICENSING RULES APPLY. YOUR INTERACTIONS WITH THIS SITE ARE IN ACCORDANCE WITH OUR PUBLIC AND MEMBER PRIVACY STATEMENTS.

2 of 2

09/12/2011 00:23


Accessibility Extension - List of Accessibility Issues Summary

chrome://accessext/content/Template.html

Accessibility Extension List of Accessibility Issues Summary FAE Violations Rule

Message

Class

Warn

1

The words contained in each h1 element should match a subset of the words contained in the title element. Words (%1) in h1 elements should also be in the title element.

Title

Warn

1

Each map, ul or ol element that precedes the last h1 element and appears to be a navigation bar should be immediately preceded by a heading element, preferably an h2.

Menu and Navigation Bars

Fail

1

Each page must have a lang attribute on its html element whose value or initial subtag is a valid two-character language code.

Language Changes

Fail

3

Heading elements that follow the last h1 should be properly Headings nested.

Warn

15

Ensure that links that point to the same HREF use the same Links link text.

Date: 12/7/2011 23:00 PM URL: file:///Volumes/cocoapuffs/Users/Amanda/schoolwork/Amanda%20Accessibility%20Site /index.html

1 of 1

07/12/2011 23:00


Color Selector - Body Copy Test

Â


Tests Document Readability

http://www.online-utility.org/english/readability_test_and_im...

OnlineUtility.org Utilities for Online Operating System

Online Utility

English Language

Text

Math

Webmaster

Other

Tests Document Readability Readability Calculator This free online software tool calculates readability : Coleman Liau index, Flesch Kincaid Grade Level, ARI (Automated Readability Index), SMOG. The measure of readability used here is the indication of number of years of education that a person needs to be able to understand the text easily on the first reading. Comprehension tests and skills training. This tool is made primarily for English texts but might work also for some other languages. In general, these tests penalize writers for polysyllabic words and long, complex sentences. Your writing will score better when you: use simpler diction, write short sentences. It also displays complicated sentences (with many words and syllables) with suggestions for what you might do to improve its readability.

Advertise Here

Number of characters (without spaces) : 1,244.00 Number of words : 231.00 Number of sentences : 12.00 Average number of characters per word : 5.39 Average number of syllables per word : 1.87 Average number of words per sentence: 19.25 Indication of the number of years of formal education that a person requires in order to easily understand the text on the first reading Gunning Fog index : 15.84 Approximate representation of the U.S. grade level needed to comprehend the text : Coleman Liau index : 14.36 Flesch Kincaid Grade level : 13.93 ARI (Automated Readability Index) : 13.56 SMOG : 14.51 Flesch Reading Ease :

29.45

List of sentences which we suggest you should consider to rewrite to improve readability of the text : Web accessibility initiative (WAI) guidelines The WAI makes no restriction on the style and layout of your site as seen in a mainstream browser, but requires that the site is constructed in such a way as to allow people to view the site using a text based browser. Web accessibility encompasses all disabilities that affect access to the Web, including visual, auditory, physical, speech, cognitive, and neurological disabilities. The document "How People with Disabilities Use the Web" describes how different disabilities affect Web use and includes scenarios of people with disabilities using the Web.

1 of 2

07/12/2011 17:16


Tests Document Readability

http://www.online-utility.org/english/readability_test_and_im...

Instant Grammar Checker Correct All Grammar Errors And Enhance Your Writing. Try Now! www.Grammarly.com/Grammar_Checker Learn English Find Top Rated English Language Courses & Programs Online Now! openlessons.com/ESL Download Burner Software # 1 Free Burner. 2 Minute Install. Full Version. No Registration. Burn.AlwaysDownloads.com

2 of 2

07/12/2011 17:16


Tests Document Readability

http://www.online-utility.org/english/readability_test_and_im...

OnlineUtility.org Utilities for Online Operating System

Online Utility

English Language

Text

Math

Webmaster

Other

Tests Document Readability Readability Calculator This free online software tool calculates readability : Coleman Liau index, Flesch Kincaid Grade Level, ARI (Automated Readability Index), SMOG. The measure of readability used here is the indication of number of years of education that a person needs to be able to understand the text easily on the first reading. Comprehension tests and skills training. This tool is made primarily for English texts but might work also for some other languages. In general, these tests penalize writers for polysyllabic words and long, complex sentences. Your writing will score better when you: use simpler diction, write short sentences. It also displays complicated sentences (with many words and syllables) with suggestions for what you might do to improve its readability.

Advertise Here

Number of characters (without spaces) : 1,388.00 Number of words : 287.00 Number of sentences : 15.00 Average number of characters per word : 4.84 Average number of syllables per word : 1.64 Average number of words per sentence: 19.13 Indication of the number of years of formal education that a person requires in order to easily understand the text on the first reading Gunning Fog index : 13.79 Approximate representation of the U.S. grade level needed to comprehend the text : Coleman Liau index : 11.12 Flesch Kincaid Grade level : 11.24 ARI (Automated Readability Index) : 10.92 SMOG : 13.10 Flesch Reading Ease :

48.58

List of sentences which we suggest you should consider to rewrite to improve readability of the text : The down side to special browsers is that they may not support the hottest new animations, security, or other innovations you want to use on your site. Website headers, buttons, navigation links, graphical information, and video content are some of the elements which often pose problems for the visually impaired. More and more frequently we find that the activities that use to take us out of our homes are becoming avaiable to us right at our fingertips through the world wide web. Some may say that being able to do our banking, shopping, read the news and even earn a degree from home is advantagous to those with visual impairments.

1 of 2

07/12/2011 17:17


Tests Document Readability

http://www.online-utility.org/english/readability_test_and_im...

Instant Grammar Checker Correct All Grammar Errors And Enhance Your Writing. Try Now! www.Grammarly.com/Grammar_Checker Learn to Read Reading Fun Cartoon reading lessons that really work. Guaranteed. Try it here free! www.Headsprout.com Download Burner Software # 1 Free Burner. 2 Minute Install. Full Version. No Registration. Burn.AlwaysDownloads.com

2 of 2

07/12/2011 17:17


W3C CSS Validator results for style.css (CSS level 2.1)

http://jigsaw.w3.org/css-validator/validator

The W3C CSS Validation Service W3C CSS Validator res ults for s ty le.css (CSS level 2.1)

Jump to:

Errors (116)

Warnings (3)

Validated CSS

W3C CSS Validator results for style.css (CSS level 2.1) Sorry! We found the following errors (116) URI : style.css

1 of 15

23

Value Error : font-family Property font-family doesn't exist in CSS level 2.1 but exists in [css1, css2, css3] : ChaparralPro-Regular

24

Property src doesn't exist : url('ChaparralProRegular.otf')

27

Value Error : font-family Property font-family doesn't exist in CSS level 2.1 but exists in [css1, css2, css3] : ChaparralPro-Bold

28

Value Error : font-weight Property font-weight doesn't exist in CSS level 2.1 but exists in [css1, css2, css3] : bold

29

Property src doesn't exist : url('ChaparralPro-Bold.otf')

32

Value Error : font-family Property font-family doesn't exist in CSS level 2.1 but exists in [css1, css2, css3] : 'Century Gothic'

33

Property src doesn't exist : url(Century Gothic )

34

Property src doesn't exist : local('Century Gothic' ),url(Century Gothic )

47 h2

Property text-shadow doesn't exist in CSS level 2.1 but exists in [css2, css3] : 1px 1px 2px #4a494a

48 h2

Parse Error color=#4a494a, offx=1, offy=1)

52 h2

Property -webkit-box-shadow doesn't exist : 1px 1px 2px 0 #9c9c9c

53 h2

Property -moz-box-shadow doesn't exist : 1px 1px 2px 0 #9c9c9c

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

2 of 15

http://jigsaw.w3.org/css-validator/validator

54 h2

Property box-shadow doesn't exist in CSS level 2.1 but exists in [css3] : 1px 1px 2px 0 #9c9c9c

60 h3

Property text-shadow doesn't exist in CSS level 2.1 but exists in [css2, css3] : 1px 1px 2px #4a494a

116 #search-input

Property -webkit-border-radius doesn't exist : 5px

117 #search-input

Property -moz-border-radius doesn't exist : 5px

118 #search-input

Property border-radius doesn't exist in CSS level 2.1 but exists in [css3] : 5px

131 .container

Property -webkit-box-shadow doesn't exist : 1px 1px 27px 1px #247373

132 .container

Property -webkit-box-shadow doesn't exist : 0 0 27px 0 #a2cccc

133 .container

Property -moz-box-shadow doesn't exist : 0 0 27px 0 #a2cccc

134 .container

Property box-shadow doesn't exist in CSS level 2.1 but exists in [css3] : 0 0 27px 0 #a2cccc

176 .read-text

Property -webkit-box-shadow doesn't exist : inset 0 0 2px 0 #9c9c9c

177 .read-text

Property -moz-box-shadow doesn't exist : inset 0 0 2px 0 #9c9c9c

178 .read-text

Property box-shadow doesn't exist in CSS level 2.1 but exists in [css3] : inset 0 0 2px 0 #9c9c9c

180 .read-text

Value Error : background Too many values or values are not recognized : -moz-lineargradient(top,#977c97 0%,#785d78 100% )

181 .read-text

Value Error : background Too many values or values are not recognized : -webkit-gradient(linear,left top,left bottom,color-stop(0%,#977c97 ),colorstop(100%,#785d78 ) )

182 .read-text

Value Error : background Too many values or values are not recognized : -webkit-lineargradient(top,#977c97 0%,#785d78 100% )

183 .read-text

Value Error : background Too many values or values are not recognized : -o-linear-gradient(top,#977c97 0%,#785d78 100% )

184 .read-text

Value Error : background Too many values or values are not recognized : -ms-linear-gradient(top,#977c97 0%,#785d78 100% )

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

185 .read-text

Value Error : background Too many values or values are not recognized : linear-gradient(top,#977c97 0%,#785d78 100% )

186 .read-text

attempt to find a semi-colon before the property name. add it

186 .read-text

Property progid doesn't exist : DXImageTransform

186 .read-text

Parse Error DXImageTransform.Microsoft.gradient( startColorstr='#977c97', endColorstr='#785d78', GradientType=0 );

199 offx

Parse Error [: 2px; -moz-border-radius: 2px; borderradius: 2px; text-align:center; padding:3px 0 4px 0; float:right; margin:-25px 20px 0 0; font-family:'Century Gothic'; font-size:13px; font-weight:bold; color:#ffffff; text-shadow: 1px 1px 2px #4a494a; filter: dropshadow(color=#4a494a]

199 offx

Parse Error offx=1, offy=1);

200 offx

Parse Error }

.read203 text:hover

Value Error : background Too many values or values are not recognized : -moz-lineargradient(top,#7c607b 0%,#7c607b 53%,#675067 100% )

.readtext:hover

Value Error : background Too many values or values are not recognized : -webkit-gradient(linear,left top,left bottom,color-stop(0%,#7c607b ),colorstop(53%,#7c607b ),color-stop(100%,#675067 ) )

.readtext:hover

Value Error : background Too many values or values are not recognized : -webkit-lineargradient(top,#7c607b 0%,#7c607b 53%,#675067 100% )

.read206 text:hover

Value Error : background Too many values or values are not recognized : -o-linear-gradient(top,#7c607b 0%,#7c607b 53%,#675067 100% )

207

.readtext:hover

Value Error : background Too many values or values are not recognized : -ms-linear-gradient(top,#7c607b 0%,#7c607b 53%,#675067 100% )

208

.readtext:hover

Value Error : background Too many values or values are not recognized : linear-gradient(top,#7c607b 0%,#7c607b 53%,#675067 100% )

209

.readtext:hover

attempt to find a semi-colon before the property name. add it

204

205

3 of 15

http://jigsaw.w3.org/css-validator/validator

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

209

.readtext:hover

.read209 text:hover 210

4 of 15

.readtext:hover

http://jigsaw.w3.org/css-validator/validator

Property progid doesn't exist : DXImageTransform Parse Error DXImageTransform.Microsoft.gradient( startColorstr='#7c607b', endColorstr='#675067', GradientType=0 ); Parse Error /* IE6-9 */ }

216 .header

Value Error : background Too many values or values are not recognized : -moz-linear-gradient(top,#ffffff 0%,#e8fafa 83% )

217 .header

Value Error : background Too many values or values are not recognized : -webkit-gradient(linear,left top,left bottom,color-stop(0%,#ffffff ),color-stop(83%,#e8fafa ) )

218 .header

Value Error : background Too many values or values are not recognized : -webkit-linear-gradient(top,#ffffff 0%,#e8fafa 83% )

219 .header

Value Error : background Too many values or values are not recognized : -o-linear-gradient(top,#ffffff 0%,#e8fafa 83% )

220 .header

Value Error : background Too many values or values are not recognized : -ms-linear-gradient(top,#ffffff 0%,#e8fafa 83% )

221 .header

Value Error : background Too many values or values are not recognized : linear-gradient(top,#ffffff 0%,#e8fafa 83% )

222 .header

attempt to find a semi-colon before the property name. add it

222 .header

Property progid doesn't exist : DXImageTransform

222 .header

Parse Error DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e8fafa', GradientType=0 );

223 .header

Parse Error /* IE6-9 */ }

.visual313 list:hover

Value Error : background Too many values or values are not recognized : -moz-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

.visual314 list:hover

Value Error : background Too many values or values are not recognized : -webkit-gradient(linear,left top,left bottom,color-stop(0%,#e8f9f9 ),color-stop(100%,#ffffff ))

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

5 of 15

http://jigsaw.w3.org/css-validator/validator

315

.visuallist:hover

Value Error : background Too many values or values are not recognized : -webkit-lineargradient(top,#e8f9f9 0%,#ffffff 100% )

316

.visuallist:hover

Value Error : background Too many values or values are not recognized : -o-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

317

.visuallist:hover

Value Error : background Too many values or values are not recognized : -ms-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

.visual318 list:hover

Value Error : background Too many values or values are not recognized : linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

319

.visuallist:hover

attempt to find a semi-colon before the property name. add it

319

.visuallist:hover

Property progid doesn't exist : DXImageTransform

319

.visuallist:hover

Parse Error DXImageTransform.Microsoft.gradient( startColorstr='#e8f9f9', endColorstr='#ffffff', GradientType=0 );

320

.visuallist:hover

Parse Error /* IE6-9 */ }

.auditory327 list:hover

Value Error : background Too many values or values are not recognized : -moz-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

.auditory328 list:hover

Value Error : background Too many values or values are not recognized : -webkit-gradient(linear,left top,left bottom,color-stop(0%,#e8f9f9 ),color-stop(100%,#ffffff ))

.auditory329 list:hover

Value Error : background Too many values or values are not recognized : -webkit-lineargradient(top,#e8f9f9 0%,#ffffff 100% )

.auditory330 list:hover

Value Error : background Too many values or values are not recognized : -o-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

.auditory331 list:hover

Value Error : background Too many values or values are not recognized : -ms-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

.auditory332 list:hover

Value Error : background Too many values or values are not recognized : linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

333

.auditorylist:hover

attempt to find a semi-colon before the property name. add it

333

.auditorylist:hover

Property progid doesn't exist : DXImageTransform

.auditory333 list:hover

Parse Error DXImageTransform.Microsoft.gradient( startColorstr='#e8f9f9', endColorstr='#ffffff', GradientType=0 );

334

.auditorylist:hover

Parse Error /* IE6-9 */ }

341

.motorlist:hover

Value Error : background Too many values or values are not recognized : -moz-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

.motorlist:hover

Value Error : background Too many values or values are not recognized : -webkit-gradient(linear,left top,left bottom,color-stop(0%,#e8f9f9 ),color-stop(100%,#ffffff ))

342

.motor343 list:hover

Value Error : background Too many values or values are not recognized : -webkit-lineargradient(top,#e8f9f9 0%,#ffffff 100% )

344

.motorlist:hover

Value Error : background Too many values or values are not recognized : -o-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

345

.motorlist:hover

Value Error : background Too many values or values are not recognized : -ms-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

.motor346 list:hover

Value Error : background Too many values or values are not recognized : linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

347

.motorlist:hover

attempt to find a semi-colon before the property name. add it

347

.motorlist:hover

Property progid doesn't exist : DXImageTransform

347

.motorlist:hover

Parse Error DXImageTransform.Microsoft.gradient( startColorstr='#e8f9f9', endColorstr='#ffffff', GradientType=0 );

348

.motorlist:hover

Parse Error /* IE6-9 */ }

.cognitive355 list:hover

6 of 15

http://jigsaw.w3.org/css-validator/validator

Value Error : background Too many values or values are not recognized : -moz-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

.cognitive356 list:hover

Value Error : background Too many values or values are not recognized : -webkit-gradient(linear,left top,left bottom,color-stop(0%,#e8f9f9 ),color-stop(100%,#ffffff ))

.cognitive357 list:hover

Value Error : background Too many values or values are not recognized : -webkit-lineargradient(top,#e8f9f9 0%,#ffffff 100% )

.cognitive358 list:hover

Value Error : background Too many values or values are not recognized : -o-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

.cognitive359 list:hover

Value Error : background Too many values or values are not recognized : -ms-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

360

.cognitivelist:hover

Value Error : background Too many values or values are not recognized : linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

361

.cognitivelist:hover

attempt to find a semi-colon before the property name. add it

361

.cognitivelist:hover

Property progid doesn't exist : DXImageTransform

.cognitive361 list:hover 362

.cognitivelist:hover

.globalization369 list:hover

7 of 15

http://jigsaw.w3.org/css-validator/validator

Parse Error DXImageTransform.Microsoft.gradient( startColorstr='#e8f9f9', endColorstr='#ffffff', GradientType=0 ); Parse Error /* IE6-9 */ } Value Error : background Too many values or values are not recognized : -moz-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

370

.globalizationlist:hover

Value Error : background Too many values or values are not recognized : -webkit-gradient(linear,left top,left bottom,color-stop(0%,#e8f9f9 ),color-stop(100%,#ffffff ))

371

.globalizationlist:hover

Value Error : background Too many values or values are not recognized : -webkit-lineargradient(top,#e8f9f9 0%,#ffffff 100% )

372

.globalizationlist:hover

Value Error : background Too many values or values are not recognized : -o-linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

373

.globalizationlist:hover

Value Error : background Too many values or values are not recognized : -ms-linear-gradient(top,#e8f9f9

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

http://jigsaw.w3.org/css-validator/validator

0%,#ffffff 100% ) .globalization374 list:hover 375

.globalizationlist:hover

attempt to find a semi-colon before the property name. add it

375

.globalizationlist:hover

Property progid doesn't exist : DXImageTransform

.globalization375 list:hover 376

8 of 15

Value Error : background Too many values or values are not recognized : linear-gradient(top,#e8f9f9 0%,#ffffff 100% )

.globalizationlist:hover

Parse Error DXImageTransform.Microsoft.gradient( startColorstr='#e8f9f9', endColorstr='#ffffff', GradientType=0 ); Parse Error /* IE6-9 */ }

401 .footer

Value Error : background Too many values or values are not recognized : -moz-linear-gradient(top,#ffffff 0%,#f6f6f6 47%,#ededed 100% )

402 .footer

Value Error : background Too many values or values are not recognized : -webkit-gradient(linear,left top,left bottom,color-stop(0%,#ffffff ),color-stop(47%,#f6f6f6 ),color-stop(100%,#ededed ) )

403 .footer

Value Error : background Too many values or values are not recognized : -webkit-linear-gradient(top,#ffffff 0%,#f6f6f6 47%,#ededed 100% )

404 .footer

Value Error : background Too many values or values are not recognized : -o-linear-gradient(top,#ffffff 0%,#f6f6f6 47%,#ededed 100% )

405 .footer

Value Error : background Too many values or values are not recognized : -ms-linear-gradient(top,#ffffff 0%,#f6f6f6 47%,#ededed 100% )

406 .footer

Value Error : background Too many values or values are not recognized : linear-gradient(top,#ffffff 0%,#f6f6f6 47%,#ededed 100% )

407 .footer

attempt to find a semi-colon before the property name. add it

407 .footer

Property progid doesn't exist : DXImageTransform

407 .footer

Parse Error DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 );

408 .footer

Parse Error /* IE6-9 */ }

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

http://jigsaw.w3.org/css-validator/validator

↑ TOP

The W3C validators rely on community support for hosting and development. Donate and help us build better tools for a better web.

2692

Warnings (3) URI : style.css

25

No declarations in the rule

30

No declarations in the rule

35

No declarations in the rule ↑ TOP

Valid CSS information @charset "UTF-8"; #skip a { position : absolute; left : -10000px; top : auto; width : 1px; height : 1px; overflow : hidden; } #skip a:focus { position : static; width : auto; height : auto; } @font-face { { } } @font-face { { } } @font-face { { } }

9 of 15

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

http://jigsaw.w3.org/css-validator/validator

a { text-decoration : none; } li { list-style : none; } .copy { text-align : center; font-family : 'ChaparralPro-Regular'; color : #333; font-size : 13px; margin-bottom : 30px; display : block; } h2 { font-family : 'Century Gothic'; font-weight : bold; font-size : 18px; text-transform : uppercase; color : #ffffff; display : inline-block; padding : 5px 15px 5px 15px; background-color : #927292; margin-left : -50px; margin-top : -15px; } h3 { font-family : 'Century Gothic'; } h4 { font-family : 'Century Gothic'; color : #333333; margin : 8px; } h5 { font-family : 'Century Gothic'; color : #333333; margin-left : 16px; } * { margin : 0; padding : 0; } body { background-color : #f4fbfb; } .top-nav { height : 41px; width : 960px; margin-right : auto; margin-left : auto;

10 of 15

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

http://jigsaw.w3.org/css-validator/validator

} .top-nav ul { width : 710px; padding-left : 350px; } .top-nav li { display : inline-block; margin-right : 34px; margin-top : 30px; float : left; font-family : 'ChaparralPro-Regular', serif; font-size : 14px; } .top-nav li a { text-decoration : none; color : #4b4b4b; } .top-nav li a:hover { border-bottom : 1px solid #4b4b4b; } .search-bar { display : none; width : 250px; height : 44px; background-image : url(images/search-tab.png); margin-top : 13px; float : right; } #search-input { margin-top : 9px; margin-left : 13px; height : 50%; } .search-bar input { background-image : url(images/search-icon.png); background-repeat : no-repeat; background-position : [right]; } .container { width : 960px; margin-right : auto; margin-left : auto; clear : both; } .content-area { width : 960px; margin-bottom : 30px; background-color : #ffffff; padding-top : 36px; } .content-area p {

11 of 15

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

}

http://jigsaw.w3.org/css-validator/validator

margin : 20px; font-family : 'ChaparralPro-Regular'; font-size : 16px; color : #282828;

.content-area li { font-family : 'ChaparralPro-Regular'; margin-left : 20px; font-size : 16px; color : #282828; } .half { width : 430px; float : left; } .half-last { border-left : 1px dotted #aa9aaa; width : 430px; float : left; margin-top : 20px; padding-left : 10px; } .fourth { width : 206px; float : left; padding : 4px; margin : 0 5px 0 5px; } .read-more { padding-top : 20px; } .logo { width : 295px; height : 115px; background-color : #448b8b; background-image : url(images/accessability-design.jpg); float : left; } .logo h1 { display : none; } .content-block { width : 880px; background-color : #f1edf1; margin-right : auto; margin-left : auto; padding-bottom : 30px; } .icon-nav li { display : inline-block; margin-right : -5px; }

12 of 15

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

http://jigsaw.w3.org/css-validator/validator

.icon-nav li a { font-family : 'Century Gothic'; text-decoration : none; color : #4b4b4b; display : block; text-transform : uppercase; text-align : center; line-height : 160px; } .visual-tab { width : 101px; height : 102px; border-bottom : 13px solid #a2cccc; background-image : url(images/visual-icon.png); } .visual-tab:hover { border-bottom : 13px solid #7bb1b1; background-image : url(images/visual-icon-h.png); } .auditory-tab { width : 113px; height : 102px; border-bottom : 13px solid #a2cccc; background-image : url(images/auditory-icon.png); } .auditory-tab:hover { border-bottom : 13px solid #7bb1b1; background-image : url(images/auditory-icon-h.png); } .motor-tab { width : 158px; height : 102px; border-bottom : 13px solid #a2cccc; background-image : url(images/motor-icon.png); } .motor-tab:hover { border-bottom : 13px solid #7bb1b1; background-image : url(images/motor-icon-h.png); } .cognitive-tab { width : 123px; height : 102px; border-bottom : 13px solid #a2cccc; background-image : url(images/cognitive-icon.png); } .cognitive-tab:hover { border-bottom : 13px solid #7bb1b1; background-image : url(images/cognitive-icon-h.png); } .globalization-tab { width : 174px; height : 102px; border-bottom : 13px solid #a2cccc;

13 of 15

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

}

http://jigsaw.w3.org/css-validator/validator

background-image : url(images/global-icon.png);

.globalization-tab:hover { border-bottom : 13px solid #7bb1b1; background-image : url(images/global-icon-h.png); } .focus { border-bottom : 13px solid #7bb1b1; } .visual-list { width : 101px; height : 102px; } .auditory-list { width : 113px; height : 102px; } .motor-list { width : 158px; height : 102px; } .cognitive-list { width : 123px; height : 102px; } .globalization-list { width : 174px; height : 102px; } .clearfix:after { content : "."; display : block; clear : both; visibility : hidden; line-height : 0; height : 0; } .clearfix { display : inline-block; } html[xmlns] .clearfix { display : block; } * html .clearfix { height : 1%; } .footer ul {

14 of 15

07/12/2011 17:12


W3C CSS Validator results for style.css (CSS level 2.1)

}

http://jigsaw.w3.org/css-validator/validator

margin-left : 20px;

.footer li { list-style : none; padding : 2px; font-family : 'ChaparralPro-Regular'; font-size : 14px; color : #333; } .container a:hover { text-decoration : underline; cursor : pointer; } .footer a:hover { text-decoration : underline; cursor : pointer; } .foot-header { border-bottom : 1px solid #333; } ↑ TOP

Home

About

Documentation

Download

Feedback

Credits

COPYRIGHT © 1994-2009 W3C® (MIT, ERCIM, KEIO), ALL RIGHTS RESERVED. W3C LIABILITY, TRADEMARK, DOCUMENT USE AND SOFTWARE LICENSING RULES APPLY. YOUR INTERACTIONS WITH THIS SITE ARE IN ACCORDANCE WITH OUR PUBLIC AND MEMBER PRIVACY STATEMENTS.

15 of 15

07/12/2011 17:12


WAVE report of Web Accessibility

http://wave.webaim.org/report

skip navigation

about

contact/feedback

english

Browse…

español

WAVE this file!

or enter a web page address Errors, Features, and Alerts

Structure/Order Text-­‐only

Outline

icons key toolbar help blog

Uh oh! WAVE has detected 2 accessibility errors

disable styles

Skip to Main Content Search Site

About the Project Site Map Overview Guides

Web Accessibility Resource Center visual auditory motor skills cognitive globalization

Why Care about accessibility standards ? Web accessibility means that people with disabilities can use the Web. More specifically, Web accessibility means that people with disabilities can perceive, understand, navigate, and interact with the Web, and that they can contribute to the Web. Web accessibility also benefits others, including older people with changing abilities due to aging. Web accessibility encompasses all disabilities that affect access to the Web, including visual, auditory, physical, speech, cognitive, and neurological disabilities. The document "How People with Disabilities Use the Web" describes how different disabilities affect Web use and includes scenarios of people with disabilities using the Web. Millions of people have disabilities that affect their use of the Web. Currently most Web sites and Web software have accessibility barriers that make it difficult or impossible for many people with disabilities to use the Web. As more accessible Web sites and software become available, people with disabilities are able to use and contribute to the Web more effectively.

Web accessibility initiative (WAI) guidelines The WAI makes no restriction on the style and layout of your site as seen in a mainstream browser, but requires that the site is constructed in such a way as to allow people to view the site using a text based browser. The full text of their guidelines is available from W3C.org Checklist of Checkpoints for Web Content Accessibility Guidelines. Their guidelines are catagorised in three levels. Read more on standards Level A This is the basic level which should be achievable with any website. If your site adheres to level A guidelines then it

1 of 2

07/12/2011 17:14


WAVE report of Web Accessibility

http://wave.webaim.org/report

should work reasonably well in a text only browser, and hence most disabled people should be able to use your site. Any images, videos, or sounds etc should have a text alternative for browsers that are not enabled for these media. It should be possible to see all links in a text only browser, so redundant text links should be added where a site uses image maps for navigation. Level AA The main recommendation for this level is to use html code correctly. Use style sheets to control layout and presentation of pages. Style sheets (referred to as CSS or Cascading Style Sheets) control font size, positioning, background, and boarders. A text based browser will ignore the style sheet, and if the page has been written correctly the page will still be readable. Level AAA The final level recommends many details that will make the page easier to use for disabled people. A speech reader might not be able to differentiate between two adjacent links, so some text should be included between the links (see the navigation bar at the bottom of this page). The WAI recommends the use of navigation bars for clear navigation together with markers to show visitors where they are on the site. Other details include creating a logical order for links and forms to allow a visitor using the tab key to tab down the page, and the inclusion of place holding characters in forms. Site Map Visual Impairments Auditory Impairments Motor Impairments Cognitive Impairments Globalization Sources W3C Yahoo! Accessibility Library Organizations WAI DSGWG AFB Guidelines Visual Guidelines Auditory Guidelines Motor Guidelines Cognitive Guidelines Globalization Guidelines Š 2011 Amanda Lynn Ferry

2 of 2

07/12/2011 17:14


WAVE report of Web Accessibility Resource Center

http://wave.webaim.org/report.php

skip navigation

about

contact/feedback

Browse…

english

español

WAVE this file!

or enter a web page address Errors, Features, and Alerts

Structure/Order Text-­‐only

Outline

icons key toolbar help blog

WAVE has detected no accessibility errors ...but you must still check your page to ensure it is actually accessible.

disable styles

Skip to Main Content About the Project Site Map Overview Guides

Web Accessibility Resource Center visual auditory motor skills cognitive globalization

Why Care about accessibility standards ? Web accessibility means that people with disabilities can use the Web. More specifically, Web accessibility means that people with disabilities can perceive, understand, navigate, and interact with the Web, and that they can contribute to the Web. Web accessibility also benefits others, including older people with changing abilities due to aging. Web accessibility encompasses all disabilities that affect access to the Web, including visual, auditory, physical, speech, cognitive, and neurological disabilities. The document "How People with Disabilities Use the Web" describes how different disabilities affect Web use and includes scenarios of people with disabilities using the Web. Millions of people have disabilities that affect their use of the Web. Currently most Web sites and Web software have accessibility barriers that make it difficult or impossible for many people with disabilities to use the Web. As more accessible Web sites and software become available, people with disabilities are able to use and contribute to the Web more effectively.

Web accessibility initiative (WAI) guidelines The WAI makes no restriction on the style and layout of your site as seen in a mainstream browser, but requires that the site is constructed in such a way as to allow people to view the site using a text based browser. The full text of their guidelines is available from W3C.org Checklist of Checkpoints for Web Content Accessibility Guidelines. Their guidelines are catagorised in three levels. Read more on standards Level A This is the basic level which should be achievable with any website. If your site adheres to level A guidelines then it should work reasonably well in a text only browser, and hence most disabled people should be able to use your site.

1 of 2

09/12/2011 00:22


WAVE report of Web Accessibility Resource Center

http://wave.webaim.org/report.php

Any images, videos, or sounds etc should have a text alternative for browsers that are not enabled for these media. It should be possible to see all links in a text only browser, so redundant text links should be added where a site uses image maps for navigation. Level AA The main recommendation for this level is to use html code correctly. Use style sheets to control layout and presentation of pages. Style sheets (referred to as CSS or Cascading Style Sheets) control font size, positioning, background, and boarders. A text based browser will ignore the style sheet, and if the page has been written correctly the page will still be readable. Level AAA The final level recommends many details that will make the page easier to use for disabled people. A speech reader might not be able to differentiate between two adjacent links, so some text should be included between the links (see the navigation bar at the bottom of this page). The WAI recommends the use of navigation bars for clear navigation together with markers to show visitors where they are on the site. Other details include creating a logical order for links and forms to allow a visitor using the tab key to tab down the page, and the inclusion of place holding characters in forms. Site Map Visual Impairments Auditory Impairments Motor Impairments Cognitive Impairments Globalization Sources W3C Yahoo! Accessibility Library Organizations WAI DSGWG AFB Guidelines Visual Guidelines Auditory Guidelines Motor Guidelines Cognitive Guidelines Globalization Guidelines © 2011 Amanda Lynn Ferry *Valid XHTML 1.0 Transitional*

2 of 2

09/12/2011 00:22


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.