<html xmlns:un="http://usablenet.com/namespaces/508_rules">
   <link rel="stylesheet" href="josh.css">
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
   
      <title>Detailed View for rule: Specify logical event handlers</title>
      <!--
  508/W3C Accessibility Suite OEM V2 for Macromedia Dreamweaver
  (C) Copyright 2001-2005 UsableNet Inc. All rights reserved.
  -->
   </head>
   <body bgcolor="#ffffff">
      <div id="Description">
         <table cellpadding="0" cellspacing="0" border="0" width="100%" class="main">
            <tr>
               <td valign="top" nowrap="true" class="name">Specify logical event handlers</td>
               <td valign="top" nowrap="true" class="compatibility">&nbsp;</td>
            </tr>
            <tr>
               <td colspan="2" class="divider"><img src="dwres:18084" width="100%" height="1"></td>
            </tr>
            <tr>
               <td valign="top" align="right" nowrap="true" colspan="2" class="requirements">WAI / WCAG 1.0 Priority 2 checkpoint 9.3</td>
            </tr>
            <tr>
               <td colspan="2" class="clearseparation">&nbsp;</td>
            </tr>
            <tr>
               <td colspan="2" class="clearseparation">&nbsp;</td>
            </tr>
            <tr>
               <td valign="top" colspan="2" class="description"><b>Issue Description</b><br>
                  
                  
                  <p>
                     The page contains BUTTON, INPUT, SELECT or TEXTAREA elements that
                     specify event handlers that are device dependent (i.e. they handle
                     events that can be generated by a specific input device.)
                     	 
                  </p>
                  
                  
               </td>
            </tr>
            <tr>
               <td colspan="2" class="clearseparation">&nbsp;</td>
            </tr>
            <tr>
               <td colspan="2" class="clearseparation">&nbsp;</td>
            </tr>
            <tr>
               <td valign="top" colspan="2" class="description"><b>How to fix</b>
                  
                  
                  <p>
                     In general, it is best to substitute event handlers within forms as follows:
                     	 
                  </p>
                  
                  <ul>
                     
                     <li> on INPUT (type=submit or type=reset or type=image) or BUTTON
                        remove events handlers like ONCLICK, ONDBLCLICK, ONKEYPRESS,
                        ONKEYDOWN, ONKEYUP, ONMOUSEDOWN, ONMOUSEUP and add
                        <strong>ONRESET</strong> (if type=reset) or 
                        <strong>ONSUBMIT</strong>  to the entire form;
                        
                     </li>
                     
                     <li> on checkboxes and radiobuttons, remove handlers for ONCLICK, ONDBLCLICK, ONKEYPRESS,
                        ONKEYDOWN, ONKEYUP, ONMOUSEDOWN, ONMOUSEUP and add
                        <strong>ONCHANGE</strong> (to the radiobutton or checkbox);
                        
                     </li>
                     
                     <li> on text fields, replace handlers for ONCLICK, ONDBLCLICK,
                        ONMOUSEDOWN, ONMOUSEUP with <strong>ONFOCUS</strong>;
                        
                     </li>
                     
                     <li> on SELECT lists, replace handlers for ONCLICK, ONDBLCLICK,
                        ONMOUSEDOWN, ONMOUSEUP with <strong>ONCHANGE</strong>.
                        
                     </li>
                     
                  </ul>
                  
                  
               </td>
            </tr>
            <tr>
               <td colspan="2" class="clearseparation">&nbsp;</td>
            </tr>
            <tr>
               <td colspan="2" class="clearseparation">&nbsp;</td>
            </tr>
            <tr>
               <td valign="top" colspan="2" class="description"><b>Issue Explanation</b><br>
                  
                  
                  <p>
                     The user interface offered by a web page should be perceivable and
                     operable by everyone, regardless of physical, cognitive or technical
                     disabilities. In particular it must be device-independent.
                     This is crucial for pages that include forms.
                     	 
                  </p>
                  
                  <p>
                     As defined by W3C/WAI (see <strong>Web Content Accessibility Guidelines 1.0</strong>
                     [http://www.w3.org/TR/WCAG10/wai-pageauth.html#gl-interim-accessibility#device-independent]
                     ), "device
                     independence" means that visitors must be able to interact with a
                     website using the supported input and output devices of their
                     choice and according to their needs. Input devices may include
                     pointing devices, keyboards, Braille devices, head wands,
                     microphones, and others. Output devices may include monitors,
                     speech synthesizers, and Braille devices.
                     
                  </p>
                  
                  
                  <p>
                     Note that "device-independent support" does not mean that
                     the browser must support every input or output device. It
                     should offer redundant input and output mechanisms for
                     those devices that are supported. For example, if a browser
                     supports keyboard and mouse input, users should be able to
                     interact with all features using either the keyboard or the
                     mouse.
                     
                  </p>
                  
                  
                  <p>
                     Device-independent access means that the visitor may interact
                     with the browser or document with a preferred input (or
                     output) device. For example, if a form control can only be
                     activated with a mouse or other pointing device, someone
                     using the page without sight, with voice input, or with a
                     keyboard will not be able to use the form. The form is an
                     example of device dependence, because its use would be
                     possible only through a mouse.
                     
                  </p>
                  
                  
                  <p>
                     Generally, pages that allow keyboard interaction are also
                     accessible through speech input or a command-line
                     interface.
                     
                  </p>
                  
               </td>
            </tr>
         </table>
      </div>
   </body>
</html>