HTML에서 "role"속성의 목적은 무엇입니까?
나는 일부 사람들의 작업에서 역할 속성을 계속 봅니다. 나도 사용하지만 그 효과에 대해 잘 모르겠습니다.
예를 들면 :
<header id="header" role="banner">
Header stuff in here
</header>
또는:
<section id="facebook" role="contentinfo">
Facebook stuff in here
</section>
또는:
<section id="main" role="main">
Main content stuff in here
</section>
이 역할 속성이 필요합니까?
이 속성이 의미론에 더 적합합니까?
SEO가 향상됩니까?
역할 목록은 여기 에서 찾을 수 있지만 일부 사람들은 자신 의 역할 을 구성합니다. 이것이 허용됩니까, 아니면 역할 속성의 올바른 사용입니까?
이것에 대한 어떤 생각?
여러분이 보는 대부분의 역할은 ARIA 1.0의 일부로 정의되었으며 나중에 HTML5에 통합되었습니다. 새로운 HTML5 요소 (대화 상자, 기본 등) 중 일부는 원래 ARIA 역할을 기반으로합니다.
http://www.w3.org/TR/wai-aria/
네이티브 시맨틱 요소 외에 역할을 사용하는 두 가지 주요 이유가 있습니다.
이유 # 1. 호스트 언어 요소가 적절하지 않거나 다양한 이유로 의미 상 적절하지 않은 요소가 사용 된 역할을 재정의합니다.
이 예에서는 결과 기능이 탐색 링크보다 버튼과 비슷하더라도 링크가 사용되었습니다.
<a href="#" role="button" aria-label="Delete item 1">Delete</a>
스크린 리더는 이것을 링크가 아닌 버튼으로 듣게되며 CSS 속성 선택기를 사용하여 class-itis 및 div-itis를 피할 수 있습니다.
*[role="button"] {
/* style these a buttons w/o relying on a .button class */
}
이유 # 2. ARIA 역할을 구현했지만 아직 기본 요소의 역할을 구현하지 않은 브라우저를 지원하기 위해 기본 요소의 역할을 백업합니다.
예를 들어, "main"역할은 수년 동안 브라우저에서 지원되었지만 비교적 최근에 HTML5에 추가되었으므로 많은 브라우저가 아직 <main>
.
<main role="main">…</main>
이것은 기술적으로 중복되지만 일부 사용자에게 도움이되며 아무런 해를 끼치 지 않습니다. 몇 년 후에는이 기술이 불필요해질 것입니다.
또한 다음과 같이 썼습니다.
나는 어떤 사람들이 자신을 구성하는 것을 봅니다. 이것이 허용됩니까, 아니면 역할 속성의 올바른 사용입니까?
실제 역할이 포함되지 않는 한 속성의 유효한 사용입니다. 브라우저는 토큰 목록에서 첫 번째로 인식 된 역할을 적용합니다.
<span role="foo link note bar">...</a>
목록에서 link
및 note
만 유효한 역할이므로 링크 역할이 먼저 적용되기 때문에 적용됩니다. 사용자 지정 역할을 사용하는 경우 ARIA에 정의 된 역할 또는 사용중인 호스트 언어 (HTML, SVG, MathML 등)와 충돌하지 않는지 확인하십시오.
내가 이해했듯이 역할은 처음에 XHTML에 의해 정의되었지만 더 이상 사용되지 않았습니다. 그러나 이제 HTML 5로 정의됩니다. 여기를 참조하십시오. https://www.w3.org/WAI/PF/aria/roles#abstract_roles_header
role 속성의 목적은 웹 애플리케이션의 일부인 요소 (및 하위 요소)의 정확한 기능을 소프트웨어 구문 분석에 식별하는 것입니다. 이것은 대부분 화면 판독기의 접근성 문제이지만 임베디드 브라우저 및 화면 스크레이퍼에도 유용하다고 볼 수 있습니다. 비정상적인 HTML 클라이언트에 유용하려면 속성을 내가 링크 한 사양의 역할 중 하나로 설정해야합니다. 직접 구성하면이 '미래'기능이 작동하지 않습니다. 댓글이 더 좋을 것입니다.
여기에서 실용성 : http://www.accessibleculture.org/articles/2011/04/html5-aria-2011/
이 역할 속성이 필요합니까?
답변 : 예 .
- role 속성은 언어가 자체 역할 속성을 정의하지 않는 경우 XML 기반 언어로 역할을 정의 하기 위해 액세스 가능한 리치 인터넷 애플리케이션 ( WAI-ARIA ) 을 지원하는 데 필요 합니다.
- 이것이 역할 속성이 Protocols and Formats Working Group에 의해 게시 된 이유이지만 속성에는 더 일반적인 사용 사례도 있습니다.
다음을 제공합니다.
- 접근성
- 장치 적응
- 서버 측 처리
- 복잡한 데이터 설명 등.
이것이 오래된 질문이라는 것을 알고 있지만 정확한 요구 사항에 따라 가능한 또 다른 고려 사항은 https://validator.w3.org/에서 유효성을 검사 하면 다음과 같은 경고가 생성 된다는 것입니다.
Warning: The form role is unnecessary for element form.
Role attribute mainly improve accessibility for people using screen readers. For several cases we use it such as accessibility, device adaptation,server-side processing, and complex data description. Know more click: https://www.w3.org/WAI/PF/HTML/wiki/RoleAttribute.
참고URL : https://stackoverflow.com/questions/10403138/what-is-the-purpose-of-the-role-attribute-in-html
'development' 카테고리의 다른 글
T를 열거 형으로 제한하는 일반 메서드 만들기 (0) | 2020.09.27 |
---|---|
.gitignore for Visual Studio 프로젝트 및 솔루션 (0) | 2020.09.27 |
PHP와 열거 (0) | 2020.09.27 |
Vim에 텍스트를 붙여 넣을 때 자동 들여 쓰기 끄기 (0) | 2020.09.27 |
Objective-C에서 NSString을 연결하는 단축키 (0) | 2020.09.27 |