-
Notifications
You must be signed in to change notification settings - Fork 106
/
help.html
90 lines (74 loc) · 3.73 KB
/
help.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<head>
<title>Help- PayPal Accessibility Tool</title>
<meta charset="utf-8">
<link href="/css/lib/bootstrap.min.css" rel="stylesheet">
<link href="/css/lib/bootstrap-accessibility.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" media="print" href="/css/home-print.css">
<link rel="stylesheet" type="text/css" href="/css/home.css">
<style>
.helpContainer{
color: #18243B;
font-size: 14px;
line-height: 20px;
text-align: justify;
text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5);
}
</style>
</head>
<body>
<div class="" style="width: 970px;margin: 20px auto;position: relative; ">
<div style="">
<a href="/getURL"><img src="/img/AATT_a11y-edge_sticker.png" height="100" width="100px" border="0" alt="PayPal Opensource"></a>
</div>
<!--div style="position: absolute; bottom: 0;left:800px">
<a id="loginButton" data-toggle="modal" href="#myModal" style="text-decoration:underline;font-size: 16px;">Login</a>
<a id="logoutButton" class="hideLoginButton" href="./logout" style="text-decoration:underline;font-size: 16px;">Log Out</a>
<a href="./help" style="text-decoration:underline;font-size: 16px; ">Help</a>
</div-->
</div>
<hr style="width: 1070px;">
<!--div class="test-area-header" style="width: 970px;margin: 20px auto;position: relative;">
<a href="https://ppaccessibility"><img src="/img/logo_347x50_PPa11y.png" height="50" width="347" border="0" alt="PayPal Accessibility"></a>
|
</div-->
<div class="helpContainer">
<h1>Help</h1>
<p>Use the Automated Accessibility Testing Tool to test web applications for conformance to the Web Content Accessibility Guidelines (WCAG) 2.0.
AATT provides a custom UI and accessibility API for <a href="http://squizlabs.github.io/HTML_CodeSniffer/">HTML CodeSniffer</a>. Find a list of the WCAG 2.0 rules checked on the <a href="http://squizlabs.github.io/HTML_CodeSniffer/Standards/WCAG2/">HTML CodeSniffer WCAG Standard: Summary </a> page.
</p>
<h2>AATT Features</h2>
<ul><li>Can test pages, html code snippets, and logged in experiences.</li>
<li>Results are displayed as a table that can be exported as a CSV file.</li>
<li>Available as an API to integrate with other quality tools. </li>
</ul>
<h2>How to use</h2>
<ul>
<li><strong>Test page by address</strong>: Provide a stage or live URL, then click the Test Page button.</li>
<li><strong>Test HTML</strong>: paste html code (currently supports a small code sample) then click the Test Page button. </li>
<li><strong>Test logged in pages</strong>: </li>
<ol>
<li>click the "Login" button. </li>
<li>Provide the user name, password and Stage URL. </li>
<li>Click the Login button. Creates a cookied experience so you can test logged in pages by entering a URL.</li>
</ol>
</ul>
<p>The results show:</p>
<ul>
<li>WCAG principle: perceivable, operable, understandable, or robust. You can use these principles to help prioritize issues.</li>
<li>Error description </li>
<li>Code snippet</li>
<li>WCAG 2.0 techniques to help developers fix the issue. </li>
<li>Optionally, captures a screen snap of the html page.</li>
<li>You can configure whether or not to show only errors, or include warnings and notices. Warnings and notices require manual inspection to determine the severity of the issue noted.</li>
</ul>
<hr style="height: 1px;">
<footer>
<a href="http://paypal.github.io" alt="PayPal Open Source">PayPal Open Source</a>
</footer>
</div>
</body>
</html>