---
title: accesskey
slug: Web/HTML/Global_attributes/accesskey
tags:
  - Global attributes
  - HTML
  - Reference
  - 단축키
translation_of: Web/HTML/Global_attributes/accesskey
---
<div>{{HTMLSidebar("Global_attributes")}}</div>

<p><span class="seoSummary"><code><strong>accesskey</strong></code> <a href="/ko/docs/Web/HTML/Global_attributes">전역 특성</a>은 현재 요소에 대한 키보드 단축키를 생성할 때 사용할 힌트를 제공합니다.</span> <code>accesskey</code> 속성의 값은 반드시 출력 가능한 단일 문자(키보드로 입력할 수 있는 글자)여야 합니다.</p>

<div>{{EmbedInteractiveExample("pages/tabbed/attribute-accesskey.html","tabbed-shorter")}}</div>

<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>

<div class="note">
<p><strong>참고</strong>: WHATWG 명세는 <code>accesskey</code>의 값에 공백으로 구분한 여러 개의 문자를 사용할 수 있고, 브라우저는 그 중 지원하는 첫 번째 문자를 사용한다고 되어 있습니다. 하지만 대부분의 브라우저는 이렇게 동작하지 않습니다. 단, 다른 명령과 충돌하지 않는 경우, IE/Edge에서는 지원되는 첫 번째 문자를 문제 없이 사용합니다.</p>
</div>

<p>단축키를 활성화하는 방법은 브라우저와 플랫폼에 따라 다를 수 있습니다.</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>Firefox 57 이상에서는 <kbd>Control</kbd> + <kbd>Option</kbd> + <kbd><em>key</em></kbd> 또는 <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd><br>
    Firefox 14 이상에서는 <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>key</em></kbd><br>
    Firefox 13 이하에서는 <kbd>Control</kbd> + <kbd><em>key</em></kbd></td>
  </tr>
  <tr>
   <th>Internet Explorer</th>
   <td rowspan="3" style="text-align: center;"><kbd>Alt</kbd> + <kbd><em>key</em></kbd><br>
    <kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd><em>key</em></kbd></td>
   <td colspan="2" rowspan="1" style="text-align: center;">없음</td>
  </tr>
  <tr>
   <th>Edge</th>
   <td style="text-align: center;">없음</td>
   <td rowspan="3" style="text-align: center;"><kbd>Control</kbd> + <kbd>Option</kbd> + <kbd><em>key</em></kbd><br>
    <kbd>Control</kbd> + <kbd>Option</kbd> + <kbd>Shift</kbd> + <kbd><em>key</em></kbd></td>
  </tr>
  <tr>
   <th>Google Chrome</th>
   <td style="text-align: center;"><kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd><em>key</em></kbd></td>
  </tr>
  <tr>
   <th>Safari</th>
   <td colspan="2" style="text-align: center;">없음</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"><kbd>Shift</kbd> + <kbd>Esc</kbd>를 통해 접근 가능한 단축키 목록을 열고, 그 중에서 <kbd>key</kbd>를 눌러 선택합니다.</td>
  </tr>
 </tbody>
</table>

<h2 id="접근성_고려사항">접근성 고려사항</h2>

<p><code>accesskey</code> 특성은 빈약한 브라우저 지원을 포함해, 사용하기 전 고려해야 할 수많은 사항이 있습니다.</p>

<ul>
 <li><code>accesskey</code> 값은 시스템이나 브라우저 키보드 단축키 또는 보조 기술 기능과 충돌할 수 있습니다. 운영 체제, 보조 기술, 브라우저의 어떤 조합에서 동작하는 키가 다른 조합에서는 동작하지 않을 수 있습니다.</li>
 <li>특정 <code>accesskey</code> 값은 특정 키보드에 존재하지 않을 수 있으며, 국제화가 중요한 경우 많은 키보드 종류로 인해 문제가 될 가능성이 커집니다. 따라서 특정 언어에 맞추는 것은 미래의 문제를 유발할 수 있습니다.</li>
 <li>숫자에 의존하는 <code>accesskey</code> 값은, 해당 숫자와 그 동작에 연관성이 없는 경우 인지력 문제를 겪고 있는 사용자에게 혼란스러울 수 있습니다.</li>
 <li>사용자에게 <code>accesskey</code>가 존재한다고 알리세요. 시스템에 해당 기능을 알리는 기능이 없다면, 사용자가 실수로 <code>accesskey</code>를 사용할수도 있습니다.</li>
</ul>

<p>이러한 문제로 인해, 일반적인 목적을 갖는 웹 사이트와 웹 앱에서는 <code>accesskey</code>를 사용하지 않는 것을 권장합니다.</p>

<ul>
 <li><a href="https://webaim.org/techniques/keyboard/accesskey#spec">WebAIM: Keyboard Accessibility - Accesskey</a></li>
</ul>

<h2 id="명세">명세</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">명세</th>
   <th scope="col">상태</th>
   <th scope="col">코멘트</th>
  </tr>
  <tr>
   <td>{{SpecName('HTML5.2', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
   <td>{{Spec2('HTML5.2')}}</td>
   <td>실제로 구현된 것에 대한 더 현실적인 동작 설명.</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML WHATWG', "interaction.html#the-accesskey-attribute", "accesskey")}}</td>
   <td>{{Spec2('HTML WHATWG')}}</td>
   <td>최신 W3C {{SpecName('HTML5.1')}} 스펙으로부터 변경 사항 없음.</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML5.1', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
   <td>{{Spec2('HTML5.1')}}</td>
   <td>{{SpecName('HTML5 W3C')}} 로부터 변경 사항 없음.</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML5 W3C', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
   <td>{{Spec2('HTML5 W3C')}}</td>
   <td>{{SpecName('HTML4.01')}} 로부터, 일부 문자들은 <code>accesskey</code> 로 설정될 수 있음. 또한, 모든 엘리먼트에서 설정될 수 있음.</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML4.01', "interact/forms.html#h-17.11.2", "accesskey")}}</td>
   <td>{{Spec2('HTML4.01')}}</td>
   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("label") }}, {{ HTMLElement("legend") }}, {{ HTMLElement("textarea") }} 에서만 지원됨.</td>
  </tr>
 </tbody>
</table>

<h2 id="브라우저_호환성">브라우저 호환성</h2>



<p>{{Compat("html.global_attributes.accesskey")}}</p>

<h2 id="함께_보기">함께 보기</h2>

<ul>
 <li>{{domxref("Element.accessKey")}}</li>
 <li>{{domxref("HTMLElement.accessKeyLabel")}}</li>
 <li>모든 <a href="/ko/docs/Web/HTML/Global_attributes">전역 특성</a>.</li>
 <li><code><a href="https://www.w3.org/TR/wai-aria-1.1/#aria-keyshortcuts">aria-keyshortcuts</a></code></li>
</ul>