접근 가능한 이름 및 설명 계산 1.2

초록

이 문서는 사용자 에이전트가 웹 콘텐츠 언어로부터 이름과 설명을 접근 가능한 객체에 대해 어떻게 결정하는지를 설명한다. 이 정보는 다시 접근성 API를 통해 노출되어 보조 기술이 이러한 객체를 식별하고 그 이름이나 설명을 사용자에게 제시할 수 있게 한다. 이름과 설명을 결정해야 하는 알고리즘을 문서화하면 서로 다른 접근성 API 간에 이러한 속성이 상호운용 가능하게 노출되도록 촉진하고, 이 정보가 작성자의 의도와 일치하는 방식으로 나타나도록 보장하는 데 도움이 된다.

접근 가능한 이름 및 설명 계산 명세는 여러 콘텐츠 기술에 걸쳐 적용되는 지원을 정의한다. 여기에는 범용 WAI-ARIA [WAI-ARIA] 역할, 상태, 그리고 속성에서 제공하는 접근 가능한 이름 및 설명뿐 아니라 개별 콘텐츠 언어에 특화된 기능도 포함된다.

이 문서는 Accessible Name and Description Computation 1.1 [ACCNAME-1.1] W3C 권고안의 접근 가능한 이름 및 설명 지침을 갱신하며, 최종적으로 이를 대체할 것이다. 이는 WAI-ARIA 개요에서 설명하는 WAI-ARIA 모음의 일부이다.

이름 및 설명 계산의 시작점은 DOM 요소이다. 출력은 평면적이고 구조화되지 않은 문자열이며, 이는 단일 단어만큼 단순할 수도 있고, 공백으로 구분된 토큰들의 문자열일 수도 있다. 예로는 Save와 Reload from disk가 있다.

중요한 요소는 요소의 역할이며, 이는 어떤 콘텐츠가 이름 문자열에 기여하는지를 결정한다. 역할은 세 가지 가능한 값을 갖는 nameFrom RDF 속성을 가진다:

author: 이름은 aria-label 및 aria-labelledby 속성과 같은 명시적 마크업 기능이나, HTML의 alt 또는 title 속성, 또는 SVG의 desc 요소와 같은 호스트 언어 레이블링 메커니즘에서 작성자가 제공한 값으로부터 생성된다.
contents: 이름은 텍스트 노드에서 생성되며, 이는 요소와 연결되어 있다. 일부 역할에서는 이것이 "author"와 함께 허용될 수도 있지만, 더 높은 우선순위의 "author" 기능이 제공되지 않은 경우에만 "content"가 사용된다. 우선순위는 텍스트 동등물 계산 알고리즘에 의해 정의된다.
prohibited: 요소에는 이름이 없다. 작성자는 요소에 이름을 부여하기 위해 aria-label 또는 aria-labelledby 속성을 사용해서는 MUST NOT 안 된다.

Accessible Rich Internet Applications (WAI-ARIA) 1.2 [WAI-ARIA] 명세는 작성자로부터 이름을 지원하는 역할, 콘텐츠로부터 이름을 지원하는 역할 및 이름을 가질 수 없는 역할의 목록을 제공한다.

사용자 에이전트는 접근 가능한 이름을 아래에 개요로 제시된 규칙을 사용하여 텍스트 동등물 계산이라는 제목의 절에서 계산해야 MUST 한다.

다음 표는 접근 가능한 설명을 계산하기 위해 적용될 수 있는 마크업의 우선순위를 제공한다. 사용자 에이전트는 마지막 열에 설명된 대로, 나열된 조건이 충족되는 표의 첫 번째 적용 가능한 항목을 사용해야 MUST 한다. 사용자 에이전트는 그 마크업이 빈 설명을 초래하더라도, 처음 발견된 관련 마크업 이외의 어떠한 마크업도 사용해서는 MUST NOT 안 된다:

우선순위	속성	적용 조건	설명 계산에 사용되는 방식
1	`aria-describedby` 속성	모든 요소에 사용	요소에서 aria-describedby가 참조하는 모든 노드에 대해 이름 계산을 수행하고, 이를 연결하며, 공백 문자로 구분한다
2	`aria-description` 속성	모든 요소에 사용	평면 문자열로 사용
3	설명 계산에 참여하는 호스트 언어 기능	고유한 호스트 언어 기능은 적용 가능한 요소의 접근 가능한 이름에 이미 사용되지 않은 경우에만, 해당 요소의 설명 계산에 참여할 수 MAY 있다. 이 조건을 충족하는 HTML 요소에 대해서는 HTML AAM: 접근 가능한 설명 계산을 참조하라.	호스트 언어 요소의 텍스트 동등물 계산 또는 호스트 언어 속성의 문자열 값 중 하나.
4	호스트 언어 툴팁 속성 또는 동등한 기능(예: HTML `title` 속성)	모든 요소 이 노드의 접근 가능한 이름에 이미 사용되지 않은 경우에만 사용	평면 문자열로 사용

텍스트 동등물 계산은 접근 가능한 이름과 접근 가능한 설명 모두에서 사용된다. 여러 종류의 요소, 노드, 그리고 마크업 조합에 대해 서로 다른 규칙이 제공된다. 텍스트 대안은 적절한 경우 요소 안에 포함된 모든 관련 콘텐츠로부터 구축된다. 이는 2B 단계와 2F 단계를 통해 이루어지며, 이 단계들은 재귀적이고 전체 규칙 집합을 사용하여 자신의 자식이나 자신이 참조하는 노드에서 텍스트를 가져온다.

계산의 목적은 대체 표현을 위한 인지 가능한 레이블 또는 설명을 공백으로 구분된 텍스트 토큰들의 평면 문자열 형식으로 생성하는 것이다.

루트 노드

텍스트 대안을 구하려는 DOM 노드 또는 요소.

현재 노드

root node의 텍스트 동등물을 계산하기 위해 현재 순회 중인 DOM 노드. 처음에는 current node가 root node이지만, 이후 단계에서는 root node의 어떤 자손이거나 다른 참조된 노드이다.

렌더링된 자식 노드

주어진 노드의 자식 노드로 렌더링되는 노드로서, 섀도 루트와 슬롯을 고려한 것이다.

평면 문자열

모든 캐리지 리턴, 줄바꿈, 탭, 폼 피드가 단일 공백으로 대체되고, 여러 공백이 단일 공백으로 축약된 문자들의 문자열. 이 문자열에는 문자 데이터만 포함되며, 어떠한 마크업도 포함되지 않는다.

총 누적 텍스트

current node를 포함하지 않고, 그 직전까지 계산된 텍스트 동등물.

누적 텍스트

아래에 설명된 단계 또는 단계들의 시퀀스에서 누적된 텍스트. 이는 해당 단계들을 위한 임시 저장소이다.

결과

아래에 설명된 단계 중 하나에서 계산된 텍스트 동등물.

공백 없이 결과를 X에 추가한다

X가 비어 있으면, result를 X에 복사한다.
X가 비어 있지 않으면, result를 X의 끝에 복사한다.

공백과 함께 결과를 X에 추가한다

X가 비어 있으면, result를 X에 복사한다.
X가 비어 있지 않으면, X의 끝에 공백을 추가한 다음 그 공백 뒤에 result를 X에 복사한다.

공백 없이 결과를 X 앞에 추가한다

X가 비어 있으면, result를 X에 복사한다.
X가 비어 있지 않으면, result를 X의 시작 부분에 복사한다.

공백과 함께 결과를 X 앞에 추가한다

X가 비어 있으면, result를 X에 복사한다.
X가 비어 있지 않으면, result를 X의 시작 부분에 복사하고, 그 복사본 뒤에 공백을 추가한다.

주어진 요소의 텍스트 대안은 다음과 같이 계산된다:

초기화: root node를 주어진 요소로 설정하고, current node를 root node로 설정하며, total accumulated text를 빈 문자열("")로 설정한다. root node의 역할이 이름 지정을 금지하는 경우, 빈 문자열("")을 반환한다.
계산: current node의 텍스트 대안을 계산한다:
1. 참조되지 않은 숨김: current node가 숨겨진 상태이고 다음에 해당하는 경우:
  1. aria-labelledby 또는 aria-describedby 순회의 일부가 아니며, 해당 관계가 직접 참조한 노드가 숨겨져 있었던 경우.
  2. 또한 네이티브 호스트 언어 텍스트 대안 요소(예: HTML의 label) 또는 속성 순회의 일부도 아니며, 그 순회의 루트가 숨겨져 있었던 경우.
  빈 문자열을 반환한다.
  참고
  접근 가능한 이름 계산의 목적상 숨김에 대한 넓은 정의를 명확히 하는 것이 중요하다:
  1. CSS 속성 display:none, visibility:hidden, visibility:collapse 또는 content-visibility:hidden을 가진 노드: 이들은 "인지 불가능" 및 "명시적으로 숨김" 지침과 일치하므로 숨겨진 것으로 간주된다.
  2. CSS 속성 opacity:0 또는 filter:opacity(0%), 또는 이와 유사한 SVG 메커니즘을 가진 노드: 이들은 숨겨진 것으로 간주되지 않는다. 이러한 방법으로 숨겨진 텍스트는 여전히 선택하거나 복사할 수 있으며, 사용자 에이전트도 이를 자신의 접근성 트리에 계속 노출한다.
  3. aria-hidden="true" 속성을 가진 노드: 이는 "명시적으로 숨김" 지침과 일치하므로 숨겨진 것으로 간주된다.
  4. 화면 밖이나 다른 객체 뒤에 숨겨진 노드: 이들은 숨겨진 것으로 간주되지 않는다. 이들은 접근성 트리에 노출되며, 심지어 화면상의 객체에 이름을 부여할 수도 있다.
  참고
  
  기본적으로 보조 기술은 숨겨진 정보를 전달하지 않지만, 작성자는 이를 명시적으로 재정의하여 aria-labelledby 또는 aria-describedby를 사용함으로써 숨겨진 텍스트를 접근 가능한 이름 또는 접근 가능한 설명의 일부로 포함할 수 있다.
  예제 1
  
  다음 예제는 "그 관계가 직접 참조한 노드가 숨겨져 있었던 경우, aria-labelledby 또는 aria-describedby 순회의 일부가 아님"이라는 절의 의미를 보여준다.
  
  먼저, element1의 접근 가능한 이름은 "hello"이다. 왜냐하면 element3가 숨겨져 있더라도, 그것은 역시 숨겨진 element2에서 시작된 aria-labelledby 순회의 일부이기 때문이다.
  예제
```
<element1 id="el1" role="button" aria-labelledby="el2" />
  <element2 id="el2" class="hidden">
    <element3 id="el3" class="hidden">hello</element3>
  </element2>
```
  예제 2
  
  반대로, element3가 숨겨져 있고 그것이 element2에서 시작된 aria-labelledby 순회의 일부이지만 element2는 숨겨져 있지 않은 경우, element1에는 접근 가능한 이름이 없다.
```
<element1 id="el1" role="button" aria-labelledby="el2" />
<element2 id="el2">
  <element3 id="el3" class="hidden">hello</element3>
</element2>
```
2. LabelledBy: 그렇지 않고, current node가 적어도 하나의 유효한 IDREF를 포함하는 aria-labelledby 속성을 가지며, current node가 이미 진행 중인 aria-labelledby 또는 aria-describedby 순회의 일부가 아닌 경우, IDREF를 나타나는 순서대로 처리한다:
  1. accumulated text를 빈 문자열로 설정한다.
  2. 각 IDREF에 대해:
    1. current node를 IDREF가 참조하는 노드로 설정한다.
    2. LabelledBy 순회: 전체 계산 단계부터 시작하여 current node의 텍스트 대안을 계산한다. result를 그 텍스트 대안으로 설정한다.
    3. 공백 문자와 result를 accumulated text에 추가한다.
  3. accumulated text가 빈 문자열("")이 아니면 이를 반환한다.
  참조되지 않은 숨김과 결합된 LabelledBy 순회의 결과는, aria-labelledby 또는 aria-describedby가 참조하는 노드가 숨겨져 있는 경우 사용자 에이전트가 하위 트리의 모든 노드를 접근 가능한 이름 또는 접근 가능한 설명의 일부로 포함해야 MUST 함을 의미한다.
  예제 3
  
  다음 예제는 "… 그리고 current node가 이미 aria-labelledby 순회의 일부가 아님 …"이라는 절의 의미를 보여준다.
  1. element1의 접근 가능한 이름은 "hello"이다. 이는 그 aria-labelledby의 첫 번째 순회이며, element3로 이어지기 때문이다.
  2. element2에는 접근 가능한 이름이 없다. 계산은 element1로 이어지는 그 aria-labelledby의 첫 번째 순회를 포함하지만, element1의 aria-labelledby는 이후에 따라가지 않는다.
```
<element1 id="el1" aria-labelledby="el3" />
<element2 id="el2" aria-labelledby="el1" />
<element3 id="el3"> hello </element3>
```
3. 임베디드 컨트롤: 그렇지 않고, current node가 다른 위젯의 레이블 (예: aria-labelledby가 직접 참조하는 모든 요소) 안에 임베드된 컨트롤이며, 사용자가 해당 임베디드 컨트롤의 값을 조정할 수 있는 경우, 다음 방식으로 임베디드 컨트롤을 텍스트 대안의 일부로 반환한다:
  1. Textbox: 임베디드 컨트롤이 textbox 역할을 가지면, 그 값을 반환한다.
  2. Combobox/Listbox: 임베디드 컨트롤이 combobox 또는 listbox 역할을 가지면, 선택된 option의 텍스트 대안을 반환한다.
  3. Range: 임베디드 컨트롤이 range 역할을 가지면(예: spinbutton 또는 slider):
    1. aria-valuetext 속성이 존재하면, 그 값을 반환한다.
    2. 그렇지 않고 aria-valuenow 속성이 존재하면, 그 값을 반환한다.
    3. 그렇지 않으면 호스트 언어 속성이 지정한 값을 사용한다.
  예제 4
  
  텍스트 입력 필드를 포함하는 체크 박스 레이블 "Flash the screen [input] times"를 고려하라. 입력 필드의 값이 "5"라면, 완전한 레이블은 "Flash the screen 5 times"이다. 예:
```
<label for="flash">
  <input type="checkbox" id="flash">
  Flash the screen <span tabindex="0" role="textbox" aria-label="number of times" contenteditable>5</span> times.
</label>
```
4. AriaLabel: 그렇지 않고, current node가 slot 요소가 아니며, 정의되지 않았거나 빈 문자열이 아니고, 공백을 제거했을 때도 빈 문자열이 아닌 값을 가진 aria-label 속성을 가지는 경우:
  1. current node의 순회가 콘텐츠로부터 이름을 얻는 자손 노드 재귀 때문이고 그리고 current node가 임베디드 컨트롤이면, aria-label을 무시하고 임베디드 컨트롤 규칙으로 건너뛴다.
  2. 그렇지 않으면, aria-label의 값을 반환한다.
  예제 5
  
  다음 예제는 노드가 자신을 참조하는 aria-labelledby를 가질 때 aria-labelledby와 aria-label의 상호작용을 보여준다. <span role="button"> 요소들은 각각 "Delete Documentation.pdf"와 "Delete HolidayLetter.pdf"라는 접근 가능한 이름을 가진다.
  예제
```
<h1>Files</h1>
<ul>
  <li>
    <a id="file_row1" href="./files/Documentation.pdf">Documentation.pdf</a>
    <span role="button" tabindex="0" id="del_row1" aria-label="Delete" aria-labelledby="del_row1 file_row1"></span>
  </li>
  <li>
    <a id="file_row2" href="./files/HolidayLetter.pdf">HolidayLetter.pdf</a>
    <span role="button" tabindex="0" id="del_row2" aria-label="Delete" aria-labelledby="del_row2 file_row2"></span>
  </li>
</ul>
```
5. 호스트 언어 레이블: 그렇지 않고, current node의 네이티브 마크업이 텍스트 대안을 정의하는 속성(예: alt) 또는 요소(예: HTML label 또는 SVG title)를 제공하는 경우, 호스트 언어가 정의한 대로(예: HTML-AAM) 그 대안을 flat string 형식으로 반환한다. 단, current node가 표현적(role="presentation" 또는 role="none", alt="")으로 노출되는 경우는 제외한다.
  
  참고
  
  중요! 네이티브 HTML 요소의 접근 가능한 이름은 호스트 언어에 따라 다르게 계산될 수 있다. 자세한 내용은 HTML-AAM을 검토해야 한다.
  
  참고
  
  예를 들어, HTML에서 img 요소의 alt 속성은 텍스트 대안 문자열을 정의하고, label 요소는 참조된 폼 요소에 대한 텍스트를 제공한다. SVG2에서 desc와 title 요소는 부모 요소에 대한 설명을 제공한다.
6. 콘텐츠로부터 이름: 그렇지 않고, current node's 역할이 콘텐츠로부터 이름을 허용하거나, current node가 aria-labelledby, aria-describedby에 의해 참조되거나, 네이티브 호스트 언어 텍스트 대안 요소(예: HTML의 label)이거나, 네이티브 호스트 언어 텍스트 대안 요소의 자손인 경우:
  1. 콘텐츠로부터 이름 재설정: accumulated text를 빈 문자열로 설정한다.
  2. 생성된 콘텐츠로부터 이름: current node와 연결된 CSS 생성 텍스트 콘텐츠를 확인하고 이를 accumulated text에 포함한다. CSS ::before 및 ::after 의사 요소 [CSS2]는 콘텐츠 모델을 가진 요소에 대해 ::marker 의사 요소와 더불어 텍스트 콘텐츠를 제공할 수 있다.
    1. ::marker 의사 요소의 경우, current node가 ::marker를 지원하면 사용자 에이전트는 CSS 텍스트 콘텐츠를 공백 없이 current node의 텍스트 콘텐츠 앞에 추가해야 MUST 한다.
    2. ::before 의사 요소의 경우, 사용자 에이전트는 CSS 텍스트 콘텐츠를 공백 없이 current node의 텍스트 콘텐츠 앞에 추가해야 MUST 한다.
    3. ::after 의사 요소의 경우, 사용자 에이전트는 CSS 텍스트 콘텐츠를 공백 없이 current node의 텍스트 콘텐츠 뒤에 추가해야 MUST 한다.
  3. 자식 노드 결정: current node의 rendered child nodes를 결정한다:
    1. current node에 연결된 섀도 루트가 있으면, rendered child nodes를 섀도 루트의 자식 노드로 설정한다.
    2. 그렇지 않고, current node가 slot이고 할당된 노드를 가지면, rendered child nodes를 current node의 할당된 노드로 설정한다.
    3. 그렇지 않으면, rendered child nodes를 current node의 자식 노드로 설정한다.
  4. 각 자식으로부터 이름: current node의 각 rendered child node에 대해:
    1. current node를 rendered child node로 설정한다.
    2. 전체 계산 단계부터 시작하여 current node의 텍스트 대안을 계산한다. result를 그 텍스트 대안으로 설정한다.
    3. result를 accumulated text에 추가한다.
  5. accumulated text가 빈 문자열("")이 아니면 이를 반환한다.
  중요: 하위 트리의 각 노드는 한 번만 참조된다. 자손에서 텍스트가 수집되었지만, 어떤 자손 노드의 다른 IDREF에 의해 참조되는 경우, 그 두 번째 또는 그 이후의 참조는 따라가지 않는다. 이는 무한 루프를 피하기 위해 수행된다.
  
  참고
  
  이 단계는 자식 노드 자체에도 적용될 수 있으며, 이는 계산이 재귀적이고 current node의 하위 트리에 있는 모든 요소로부터 텍스트를 수집한 결과가 됨을 의미한다. 그 깊이에 관계없이 그렇다. 그러나 어떤 주어진 자손 노드의 텍스트 대안은 위의 B부터 D 단계에서 설명된 더 높은 우선순위의 마크업에서 비롯될 수 있으며, 여기서 "Namefrom: author" 속성은 전체 하위 트리에 대한 텍스트 대안을 제공한다.
  
  참고
  
  2024년 1월 18일: ARIA Working Group은 current node와 그 인접 노드 및 의사 요소의 CSS display 값에 따라 텍스트 문자열을 공백이 있거나 없는 방식으로 결합하는 가능성을 검토하고 있다. 진행 중인 논의는 AccName #225에 있다.
7. 텍스트 노드: 그렇지 않고, current node가 텍스트 노드이면, 그 텍스트 내용을 반환한다.
8. 재귀적 콘텐츠로부터 이름: 그렇지 않고, current node가 접근 가능한 이름 또는 접근 가능한 설명이 계산 중인 요소의 자손이고, 자손을 포함하는 경우, 콘텐츠로부터 이름 재설정으로 진행한다.
9. 툴팁: 그렇지 않고, current node가 툴팁 속성을 가지면, 그 값을 반환한다.
  
  참고
  
  툴팁 속성은 하위 트리 콘텐츠를 포함하여 그 밖의 아무것도 결과를 제공하지 않은 경우에만 사용된다.
10. 위의 각 단계의 result와 공백 문자를 total accumulated text에 추가한다.
모든 단계가 완료된 후, total accumulated text는 계산을 시작한 요소의 접근 가능한 이름 또는 접근 가능한 설명으로 사용된다.

접근 가능한 이름 및 설명 계산 1.2

초록

이 문서의 상태

1. 소개

2. 중요 용어

3. 준수

4. 이름 및 설명

4.1 이름 계산

4.2 설명 계산

4.3 텍스트 동등물 계산

4.3.1 용어

4.3.2 계산 단계

5. 접근 가능한 이름 및 설명 매핑

6. 부록

6.1 변경 로그

6.1.1 마지막 공개 작업 초안 이후의 실질적 변경 사항

6.1.2 Accessible Name and Description Computation 1.1 권고안 이후의 실질적 변경 사항

6.2 감사의 말

6.2.1 발행 시점의 ARIA WG 참여자

6.2.2 지원 기금 제공자

A. 참고문헌

A.1 규범적 참고문헌

A.2 참고 정보 참고문헌