blob: 6e8cb06ae26ae3c3aeec16138c82e1f9e85cbe38 (
plain)
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
|
---
title: Visão geral
slug: Web/Accessibility/ARIA/widgets/Visão_geral
tags:
- Acessibilidade
- JavaScript
- Landing
- PrecisaAtualizar
translation_of: Web/Accessibility/ARIA/widgets/overview
---
<div class="warning">Aviso: precisa de atualização</div>
<h2 id="Introdução"><span class="mw-headline" id="Introduction">Introdução</span> </h2>
<h2 id="Alguns_exemplos_funcionais_e_boas_práticas_na_construção_de_widgets_acessíveis_aplicando_JavaScript.">Alguns exemplos funcionais e boas práticas na construção de <em>widgets</em><span style='font-family: "Open Sans",arial,x-locale-body,sans-serif;'> acessíveis aplicando JavaScript.</span></h2>
<h2 id="Recursos_Gerais"><span class="mw-headline" id="General_Resources">Recursos Gerais</span></h2>
<ul>
<li><a class="external text" href="http://dev.aol.com/dhtml_style_guide" rel="nofollow">Guia de Estilo DHTML</a> recomendações para interação com o teclado</li>
<li><a class="external text" href="http://www.w3.org/wai/pf/aria-practices" rel="nofollow">Guia de Práticas para criação de WAI-ARIA</a></li>
</ul>
<h2 id="Caixa_de_seleção">Caixa de seleção</h2>
<ul>
<li><a class="external text" href="http://www.paciellogroup.com/blog/?p=53" rel="nofollow">Exemplos ARIA para Alternar Botões e exemplos dos 3 estados de uma Caixa de Seleção</a> (de "The Paciello Group Blog")</li>
</ul>
<h2 id="Menu_2"><span class="mw-headline" id="Menu">Menu</span></h2>
<ul>
<li><a class="external text" href="http://yuiblog.com/blog/2007/12/21/menu-waiaria/" rel="nofollow">Usando as Funções e Estados WAI-ARIA com o Controle de Menu YUI</a></li>
</ul>
<h2 id="Deslizantes"><span class="mw-headline" id="Slider">Deslizantes</span></h2>
<ul>
<li>Do blog Paciello Group: Deslizantes ARIA - <a class="external text" href="http://www.paciellogroup.com/blog/?p=68" rel="nofollow">parte um</a>, <a class="external text" href="http://www.paciellogroup.com/blog/?p=69" rel="nofollow">parte dois</a>, <a class="external text" href="http://www.paciellogroup.com/blog/?p=76" rel="nofollow">parte três</a> (<a class="external text" href="http://www.paciellogroup.com/blog/misc/ARIA/slider/" rel="nofollow">exemplo</a>)</li>
</ul>
<h2 id="Abas"><span class="mw-headline" id="Tabs">Abas</span></h2>
<ul>
<li><a class="external text" href="http://yuiblog.com/blog/2008/07/30/tabview-aria/" rel="nofollow">Melhorando a Acessibilidade na Visão em Abas com as Funções e Estados WAI-ARIA, </a>do blog YUI</li>
<li><a class="external text" href="http://wiki.github.com/fnagel/jQuery-Accessible-RIA/tabs" rel="nofollow">Melhorando as Abas jQuery UI, de acordo com WCAG 2.0 e ARIA</a></li>
</ul>
<h2 id="Combo-box"><span class="mw-headline" id="Combobox">Combo-box</span></h2>
<ul>
<li><a class="external text" href="http://www.protofunc.com/scripts/jquery/select/" rel="nofollow">Combo-box simples (não editável) como Select-Box-Replacement</a></li>
</ul>
<h2 id="Lightbox_2"><span class="mw-headline" id="Lightbox">Lightbox</span></h2>
<ul>
<li><a class="external text" href="http://wiki.github.com/fnagel/jQuery-Accessible-RIA/lightbox" rel="nofollow">WCAG 2.0 e aplicação lightbox ARIA-</a><a class="external text" href="http://wiki.github.com/fnagel/jQuery-Accessible-RIA/table" rel="nofollow">conformant</a></li>
</ul>
<h2 id="Validação_de_Formulários"><span class="mw-headline" id="Form_Validation">Validação de Formulários</span></h2>
<ul>
<li><a class="external text" href="http://wiki.github.com/fnagel/jQuery-Accessible-RIA/formular" rel="nofollow">WCAG 2.0 e validação ativa de ARIA-conformant</a></li>
</ul>
<h2 id="Tabelas"><span class="mw-headline" id="Table">Tabelas</span></h2>
<ul>
<li><a class="external text" href="http://www.einfach-fuer-alle.de/artikel/barrierefreie-formulare-mit-html-css-und-javascript/" rel="nofollow">Tutorial alemão sobre criação de formulário acessível</a></li>
<li><a class="external text" href="http://codetalks.org/source/widgets/grid/grid.sample.html" rel="nofollow">Exemplo de grade simples em CodeTalks</a></li>
</ul>
|