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
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
|
---
title: accesskey
slug: Web/HTML/Global_attributes/accesskey
tags:
- Atributos globais
- Referências
translation_of: Web/HTML/Global_attributes/accesskey
---
<div>{{HTMLSidebar("Global_attributes")}}</div>
<p>O <a href="/en-US/docs/Web/HTML/Global_attributes">atributo global</a> <code><strong>accesskey</strong></code> fornece uma dica para gerar um atalho de teclado no elemento atual. O valor do atributo deve consistir em um único caracter imprimível (que inclui caracteres acentuados e outros caracteres que podem ser gerados pelo teclado).</p>
<div>{{EmbedInteractiveExample("pages/tabbed/attribute-accesskey.html","tabbed-shorter")}}</div>
<div class="hidden">O código fonte desse exemplo interativo está armazenado em um repositório no GitHub. Se você deseja contribuir com o projeto de exemplos interativos, por favor clone o repositório: <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> e nos envie uma solicitação de recebimento.</div>
<div class="note">
<p><strong>Nota</strong>: Na especificação do WHATWG, diz que você pode especificar vários caracteres separados por espaço, e o navegador usará primeiro o que ele suportar. No entanto, isso não funciona na maioria dos browsers. O IE/Edge usa o primeiro que ele suporta sem problemas, desde que não haja conflitos com outros comandos.</p>
</div>
<p>A maneira de ativar a tecla de acesso depende do navegador e de sua plataforma:</p>
<table class="standard-table">
<tbody>
<tr>
<th></th>
<th>Windows</th>
<th>Linux</th>
<th>Mac</th>
</tr>
<tr>
<th>Firefox</th>
<td colspan="2" rowspan="1" style="text-align: center;"><kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd><em>key</em></kbd></td>
<td>No Firefox 57 ou mais recente: <kbd>Control</kbd> + <kbd>Option</kbd> + <kbd><em>key</em></kbd> or <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd><br>
No Firefox 14 ou mais recente: <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd><br>
No Firefox 13 ou mais antigo: <kbd>Control</kbd> + <kbd><em>key</em></kbd></td>
</tr>
<tr>
<th>Edge</th>
<td><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
<td colspan="2" rowspan="1">N/A</td>
</tr>
<tr>
<th>Internet Explorer</th>
<td><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
<td colspan="2" rowspan="1">N/A</td>
</tr>
<tr>
<th>Google Chrome</th>
<td colspan="2" rowspan="1" style="text-align: center;"><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
<td><kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
</tr>
<tr>
<th>Safari</th>
<td><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
<td>N/A</td>
<td><kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
</tr>
<tr>
<th>Opera 15+</th>
<td colspan="2" rowspan="1" style="text-align: center;"><kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
<td><kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd></td>
</tr>
<tr>
<th>Opera 12</th>
<td colspan="3" rowspan="1">
<p><kbd>Shift</kbd> + <kbd>Esc</kbd> abre uma lista de conteúdos acessíveis pela tecla de acesso e, em seguida, pode escolher um item pressionando <kbd><em>key</em></kbd></p>
</td>
</tr>
</tbody>
</table>
<h2 id="Preocupações_com_acessibilidade">Preocupações com acessibilidade</h2>
<p>Além do baixo suporte ao navegador, existem inúmeras preocupações com o atributo <code>accesskey</code>:</p>
<ul>
<li>Um valor de <code>accesskey</code> pode entrar em conflito com uma tecla de atalho do sistema ou do navegador, ou alguma funcionalidade de tecnologia assistida. O que pode funcionar para uma combinação de sistema operacional, tecnologia assistida e navegador pode não funcionar com outras combinações.</li>
<li>Certos valores de <code>accesskey</code> podem não estar presentes em alguns teclados, especialmente quando a internacionalização é uma preocupação. Portanto, a adaptação a idiomas específicos pode causar problemas adicionais.</li>
<li>Os valores de <code>accesskey</code> que dependem de números podem ser confusos para indivíduos com problemas cognitivos, onde o número não tem uma associação lógica com a funcionalidade que aciona.</li>
<li>Informar o usuário que <code>accesskey</code> estão presentes, para que eles estejam cientes da funcionalidade. Se o sistema não tiver o método de o usuário dessa funcionalidade, ele poderá ativar acidentalmente as teclas de acesso (<code>accesskeys)</code>.</li>
</ul>
<p>Devido a esses problemas, geralmente não é aconselhável usar o <code>accesskey</code>s para a maioria dos sites e aplicativos da web.</p>
<p><a href="https://webaim.org/techniques/keyboard/accesskey#spec">WebAIM: Keyboard Accessibility - Accesskey</a></p>
<h2 id="Especificações">Especificações</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Especificação</th>
<th scope="col">Status</th>
<th scope="col">Comentário</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('HTML5.2', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
<td>{{Spec2('HTML5.2')}}</td>
<td>Comportamento mais realista descrito para o que é implementado na realidade.</td>
</tr>
<tr>
<td>{{SpecName('HTML WHATWG', "interaction.html#the-accesskey-attribute", "accesskey")}}</td>
<td>{{Spec2('HTML WHATWG')}}</td>
<td>Nenhuma alteração das últimas especificações do W3C {{SpecName('HTML5.1')}} .</td>
</tr>
<tr>
<td>{{SpecName('HTML5.1', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
<td>{{Spec2('HTML5.1')}}</td>
<td>Nenhuma alteração em {{SpecName('HTML5 W3C')}}.</td>
</tr>
<tr>
<td>{{SpecName('HTML5 W3C', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
<td>{{Spec2('HTML5 W3C')}}</td>
<td>A partir da {{SpecName('HTML4.01')}}, vários caracteres podem ser definidios como teclas de atalho. Além disso, pode ser definido em qualquer elemento.</td>
</tr>
<tr>
<td>{{SpecName('HTML4.01', "interact/forms.html#h-17.11.2", "accesskey")}}</td>
<td>{{Spec2('HTML4.01')}}</td>
<td>Suportado apenas em {{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("label") }}, {{ HTMLElement("legend") }} e {{ HTMLElement("textarea") }}</td>
</tr>
</tbody>
</table>
<h2 id="Compatibilidade_com_Browsers">Compatibilidade com Browsers </h2>
<div class="hidden">A tabela de compatibilidade desta página é gerada de dados estruturados. Se você quiser contribuir com os dados, por favor, verifique em <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> e nos envie uma solicitação de recebimento.</div>
<div class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
<p>{{Compat("html.global_attributes.accesskey")}}</p>
<h2 id="Veja_também">Veja também</h2>
<ul>
<li>{{domxref("Element.accessKey")}}</li>
<li>{{domxref("HTMLElement.accessKeyLabel")}}</li>
<li>All <a href="/en-US/docs/Web/HTML/Global_attributes">global attributes</a>.</li>
</ul>
|
