16f6c0aecf
Inline adoc files when they are included exactly once. Also fix language tags because this inlining gives us better information on what language the code is written in.
74 lines
2.8 KiB
Plaintext
74 lines
2.8 KiB
Plaintext
== Why is this an issue?
|
||
|
||
Offering the same experience with the mouse and the keyboard allow users to pick their preferred devices.
|
||
|
||
Additionally, users of assistive technology will also be able to browse the site even if they cannot use the mouse.
|
||
|
||
|
||
This rule raises an issue when:
|
||
|
||
* an HTML element with an ``++onMouseover++`` attribute doesn't also have an ``++onFocus attribute.++``
|
||
* an HTML element with an ``++onMouseout++`` attribute doesn't also have an ``++onBlur attribute.++``
|
||
* an HTML element with an ``++onClick++`` attribute doesn't also have one of the following attributes: ``++onKeyDown++``, ``++onKeyUp++``, ``++onKeyPress++``.
|
||
|
||
Note that in the case of ``++onClick++``, the equivalent keyboard handler should support both the "Enter" and "Space" keys as these are usually used by screen-readers.
|
||
|
||
|
||
=== Noncompliant code example
|
||
|
||
[source,html]
|
||
----
|
||
<div onClick="doSomething();" ...> <!-- Noncompliant - 'onKeyDown/onKeyUp/onKeyPress' missing -->
|
||
<a onMouseover="doSomething();" ...> <!-- Noncompliant - 'onFocus' missing -->
|
||
<a onMouseout="doSomething();" ...> <!-- Noncompliant - 'onBlur' missing -->
|
||
----
|
||
|
||
|
||
=== Compliant solution
|
||
|
||
Note that setting the ``++tabindex++`` attribute is necessary to make the ``++<div>++`` element focusable.
|
||
|
||
[source,html]
|
||
----
|
||
<div onClick="doSomething();" onKeyDown="doSomething();" tabindex="0" ...> <!-- Compliant -->
|
||
<a onMouseover="doSomething();" onFocus="doSomething();" ...> <!-- Compliant -->
|
||
<a onMouseout="doSomething();" onBlur="doSomething();" ...> <!-- Compliant -->
|
||
----
|
||
|
||
|
||
=== Exceptions
|
||
|
||
For the following elements, https://www.w3.org/TR/WCAG20-TECHS/SCR35.html[pressing a key will trigger the ``++onClick++`` attribute]: ``++<input type="button">++``, ``++<input type="submit">++``, ``++<button>++``, ``++<a>++``. Thus no issue will be raised when an ``++onClick++`` attribute is found in these elements without a ``++onKeyDown/onKeyUp/onKeyPress++``.
|
||
|
||
|
||
An issue will still be raised for https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/button_role[elements with the ``++role="button"++`` attribute] as they don't behave the same way.
|
||
|
||
|
||
== Resources
|
||
|
||
* https://www.w3.org/TR/WCAG20-TECHS/SCR2.html[SCR2: Using redundant keyboard and mouse event handlers]
|
||
|
||
|
||
ifdef::env-github,rspecator-view[]
|
||
|
||
'''
|
||
== Implementation Specification
|
||
(visible only on this page)
|
||
|
||
=== Message
|
||
|
||
Add a '{0}' attribute to this {1} tag.
|
||
|
||
|
||
'''
|
||
== Comments And Links
|
||
(visible only on this page)
|
||
|
||
=== on 20 Jun 2013, 14:52:17 Dinesh Bolkensteyn wrote:
|
||
http://www.w3.org/WAI/GL/WCAG20/tests/test102.html
|
||
|
||
=== on 8 Jul 2013, 18:26:26 Freddy Mallet wrote:
|
||
Is implemented by \http://jira.codehaus.org/browse/SONARPLUGINS-2944
|
||
|
||
endif::env-github,rspecator-view[]
|