Web Standards
- The World Wide Web Consortium (W3C) is an international consortium where Web standards are developed. Mission : To lead the WWW to its full potential by developing protocols and guidelines that ensure long-term growth for the Web
- A major chunk of the population suffers from some of the impairment. The target segment for accessibility includes – Visual, Hearing, Old age, low Literacy, low bandwidth connections
- Web Content Accessibility Guidelines (WCAG) - Explains to Web content developers how to make content accessible for people with disabilities
- Section 508 and ADA (American with Disabilities Act) are laws that govern Web accessibility in US
Browser Compatibility
- Different web browsers are created by different organizations, user-interface enhancements. The designer must devise a strategy that accounts for this possible variation to ensure that a website can still be used without the enhancement or only use features that are supported by ‘all’ browsers.
- Testing the Browser Compatibility of Web sites across various browsers and operating systems
Readability
- Readability is the measure of how easy to read and comprehend a document
- Reading level algorithms only provide a rough guide, but can give a useful indication as to whether you've pitched your content at the right level for your intended audience
- Gunning Fog, Flesch Reading Ease, and Flesch-Kincaid are reading level algorithms that can be helpful in determining how readable your content is
Web Page Speed Analysis
- Web page speed is based on page size, composition, and download time.
- Page weight is a measurement of the file size of a Web page that includes the combined size of all the elements of the page, including HTML files, images, audio or video, Flash animation, etc.
- Reducing the page weight obviously improve the performance of the web site
Tools Usage
| Tools | Description |
| HTML Validator | To check the HTML code as per W3C standards. This validator checks the markup validity of Web documents in HTML, XHTML, SMIL, MathML etc |
| Link Checker | To check the Link navigations as per W3C standards. Link Checker looks for issues in links, anchors and referenced objects in a Web page, or recursively on a whole Web site |
| CSS Validator | To check the CSS as per W3C standards |
| HTML WDG | To check the HTML code as per WDG standards |
| Juicy Studio | To check the readability of the content of the website |
| Page Speed Report | To analyze Web page speed |
| WAVE | To check for accessibility errors as per WCAG standards |
All these evaluators are available with Web Accessibility Tool Bar (WAT) 2.0 for IE.
WAT 2.0 is a Free Ware provided by Web Accessibility Tools consortium. The tool aids in manual examination of web pages for a variety of aspects of accessibility. The functions are
1.Identify components of webpage
2.Provide access to alternate views of page content
3.Facilitate use of 3rd party online applications
Along with these evaluators, WAT2.0 also features tools such as Lynx viewer, Grey scale, FAE, Contrast analyzer, Vischeck color blindness simulator, Resize etc
Other Tool
http://www.webshot.org – Free Online Tool used for Cross Browser Testing
Analysis for a XXX Website
This case study provides the effective usage of free online tools available to test the XXX Website
| Evaluator | Standards | Errors | Warning |
| HTML | W3C | 123 | 107 |
| Link Checker | W3C | 1 | 110 |
| CSS | W3C | 49 | 203 |
| HTML | WDG | 30 | 21 |
Not an issue: Though these errors are reported, it doesn’t affect the core functionality.
Nice to have: The ease of displaying in various browsers, PDA, Pagers etc.
* All the results reported were w.r.t the XXX Website
Accessibility analysis using WAVE
| Web pages | No of Errors |
| Home page | 29 |
| Collection page | 55 |
| Product page | 46 |
| Shopping Cart | 27 |
| Sign in - check out | 24 |
| Recipient page | 36 |
| Billing page | 48 |
| Review order page | 79 |
Not an issue: Within a given system configuration we will not have any issues.
Nice to Have: The web page is assured to meet WCAG standards and also accessible at any situation. (The errors reported are “Alt text” missing for the images, links, form labels. The error will be critical to access, if the page is not fully loaded.)
* Refer appendix for screen shot of WAVE Tool
Browser Compatibility
| Browser | Versions | Browser | Versions |
| Avant | 11.7 | K-Meleon | (1.1.4), (1.5.0) |
| Chrome | (0.2.149.30), (1.0.154.65), (0.3.154.9), (0.4.154.25) | Konqueror | 4.2 |
| Epiphany | 2.22 | Minefield | (3.1), (3.2), (3.6) |
| Firefox | (0.8), (0.9), (1.0.8), (1.5),(2.0.0.4), (3.0.1), (3.1) | MSIE | (5.01), (6.0), (7.0) |
| Flock | (1.2.6), (2.03) | Navigator | 9.0.06 |
| Galeon | 2.0.4 | Safari | (3.2.1), (4.0) |
| Iceweasel | 3.0.4 | SeaMonkey | (1.1.14), (2.0) |
| Kazehakase | 0.5.2 | Shiretoko | (3.1), (3.5) |
| Opera | (8.0), ( 9.25), (10.0), (7.03), (7.11), (7.54), (8.54), (9.26), (9.27), (9.6), (9.62), (9.63), (9.64) |
47 browsers showed positive results for the XXX Website. Almost all the widely used browsers were able to access the site
| Evaluator | Value |
| Gunning Fox Index | 10.89 |
| Flesh Reading Ease | 52.04 |
| Flesh Kincaid Grade | 6.92 |
- Gunning Fox index and Flesh Kincaid, the value represents number of schoolings required to read the content. For example if the value is sixteen, the sixteen years of schoolings is required to read the content
- For Flesh Reading Ease, the result is an index number that rates the text on a 100-point scale. The higher the score, the easier it is to understand the document. 60 – 70 is standard value and we stand at only 52.04 (Almost Near but still can reach the Standards)
Web Page Speed Analysis
| Test | Units | Remarks | Status |
| Total HTML | 1 | The Total HTML should be 1 | Pass |
| Total Objects | 93 | The Optimum number of object should be <20 | Warning |
| Total Images | 69 | The images should be lowered for quick loading | Warning |
| Total CSS | 5 | The CSS should be lowered for quick loading | Caution |
| Total Size | 735Kb | The optimum size should be < 100Kb | Warning |
| Total Script | 18 | The total script should be lowered for quick loading | Warning |
| HTML Size | 67Kb | The Optimum HTML size should be <50Kb | Caution |
| Image Size | 390Kb | The Optimum Image size should be <100Kb | Warning |
| Script Size | 223Kb | The Optimum Script size should be <20Kb | Warning |
| CSS size | 55Kb | The Optimum CSS Size should be <55Kb | Warning |
| Multi Size | 0 | The Multimedia size should be < 10Kb | Pass |
Nice to Have: The Page size – Images, CSS, HTML can be decreased so that the pages gets loaded faster
Note: This depends on parameters like bandwidth, System Configuration etc..
Merits
The benefits on rectification of these errors are,
Clean code – Any developer could analyze the code easily.
Search Engine friendly – Search engines can track our website with ease
Faster Page Loading – A minor change can help in loading the pages quickly
Standard compliance - Publishing the standard compliance the Client can win the customer confidence
Accessibility – Easy accessibility of website across the various category of people
Once the site is W3C standard compliant, then the site shall have the W3C logo
Conclusion
- The Accessibility can be improvised to WCAG standard and open a new path for Disabled customers
- Writing web pages in accordance with the standards shortens site development time and makes pages easier to maintain. Debugging and troubleshooting become easier, because the code follows a standard
- Cross Browser testing can ensure that the Website can be used by the largest possible audience, with minimal variation in the user-experience
- The Readability Test provides prediction of the reading ease of the document with respect to sentence length and polysyllabic words. The results shall be used with Good writing style guidelines to increase the readability
- Lower page load times create more comfortable visitors. The Website brand perception will be enhanced.
Screen Shots
Web Accessibility Tool bar 2.0
WAVE report
0 comments:
Post a Comment