HTML에서 "역할" 속성의 목적은 무엇입니까?

HTML에서 "역할" 속성의 목적은 무엇입니까?

나는 몇몇 사람들의 작품에서 역할 속성을 계속 본다.저도 쓰고 있는데 효과는 잘 모르겠어요.

예를 들어 다음과 같습니다.

<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의 일부로 정의되어 있으며, 이후 HTML-AAM 등의 지원 사양을 통해 HTML에 통합되었습니다.일부 새로운 HTML5 요소(대화상자, 메인 등)는 원래 ARIA 역할을 기반으로 합니다.

http://www.w3.org/TR/wai-aria/

아리아 제1규칙에는 다음과 같이 기술되어 있다.

요소를 재사용하고 ARIA 역할, 상태 또는 속성을 추가하여 액세스할 수 있도록 하는 대신, 네이티브 HTML 요소 [HTML51] 또는 이미 필요한 의미 및 동작과 함께 속성을 사용할 수 있는 경우 그렇게 하십시오.

네이티브 시멘틱 요소 외에 롤을 사용하는 주된 이유가 몇 가지 있습니다.

이유 1번호스트 언어 요소가 적절하지 않거나 여러 가지 이유로 의미적으로 적절하지 않은 요소가 사용된 경우 역할을 재정의합니다.

이 예에서는 네비게이션링크보다 더 버튼과 같은 기능이 있는데도 링크가 사용되었습니다.

<a href="#" role="button" aria-label="Delete item 1">Delete</a>
<!-- Note: href="#" is just a shorthand here, not a recommended technique. Use progressive enhancement when possible. -->

화면 리더 사용자는 이것을 (링크가 아닌) 버튼으로 들을 수 있으며, CSS 속성 셀렉터를 사용하여 class-itis 및 div-itis를 피할 수 있습니다.

[role="button"] {
  /* style these as buttons w/o relying on a .button class */
}

[7년 후 업데이트 : 속성 셀렉터에 유니버설 셀렉터가 필요했던 오래된 브라우저 쿼크가 2020년에는 불필요하기 때문에 일부 코멘트를 만족시키기 위해 * 셀렉터를 삭제하였습니다]

이유 #2.네이티브 요소의 역할을 백업하여 ARIA 역할을 구현했지만 아직 네이티브 요소의 역할을 구현하지 않은 브라우저를 지원합니다.

를 들어, "main"되었지만 HTML5에에 많은 가 아직 ""이나 "Main"의<main>.

<main role="main">…</main>

이는 기술적으로 중복되지만 일부 사용자에게 도움이 되며 아무에게도 해를 끼치지 않습니다.몇 년 안에 이 기술은 메인에는 불필요해질 것입니다.

이유 3번7년 후 갱신(2020년):적어도 한 코멘트가 지적한 바와 같이 이는 현재 커스텀 요소에 매우 유용하며 웹 컴포넌트의 기본 접근성 역할을 정의하기 위한 몇 가지 사양 작업이 진행 중입니다.API가 표준화 된 경우에도 컴포넌트의 기본 역할을 덮어쓸 필요가 있습니다.

메모/응답

또, 다음과 같이 기입해 주세요.

어떤 사람들은 자기 것을 만들어 내기도 해요.역할 속성을 사용할 수 있습니까, 아니면 올바르게 사용할 수 있습니까?

이는 실제 역할이 포함되지 않는 한 속성을 사용할 수 있습니다.브라우저는 토큰 목록에서 가장 먼저 인식된 역할을 적용합니다.

<span role="foo link note bar">...</a>

중 '''만''입니다'''link ★★★★★★★★★★★★★★★★★」note을 사용하다따라서 링크 역할은 플랫폼액세스 가능성 API에서 적용됩니다.커스텀 롤을 사용하는 경우는, ARIA 또는 사용하고 있는 호스트 언어(HTML, SVG, MathML 등)에 정의된 롤과 경합하지 않는 것을 확인합니다.

제가 알기로는 처음에는 XHTML에 의해 역할이 정의되었지만 폐지되었습니다.다만, 현재는 HTML 5 로 정의되고 있습니다.https://www.w3.org/WAI/PF/aria/roles#abstract_roles_header 를 참조해 주세요.

롤 어트리뷰트의 목적은 웹 애플리케이션의 일부로서 요소(및 그 자식)의 정확한 기능을 해석 소프트웨어에 식별하는 것입니다.이것은 주로 화면 리더에 대한 접근성이지만, 내장 브라우저나 스크린 스크래퍼에도 도움이 된다고 생각합니다.일반적인 HTML 클라이언트에서 유용하게 사용하기 위해서는 속성을 내가 링크한 사양의 역할 중 하나로 설정해야 합니다.독자적으로 만든다면 이 '미래' 기능은 작동하지 않습니다. 코멘트가 더 나을 것입니다.

실용성 : http://www.accessibleculture.org/articles/2011/04/html5-aria-2011/

이 역할 속성이 필요합니까?

답변: 네.

• Accessible Rich Internet Applications(와이아리아)가 XML 기반 언어로 역할을 정의하도록 지원하기 위해서는 언어 자체 역할 속성이 정의되지 않은 경우 역할 속성이 필요합니다.
• 이러한 이유로 Protocols and Formats Working Group에서 역할 속성을 게시하지만 이 속성에는 더 일반적인 사용 사례도 있습니다.

다음과 같은 기능을 제공합니다.

• 접근성
• 디바이스 적응
• 서버측 처리
• 복잡한 데이터 설명 등

오래된 질문인 것은 알고 있습니다만, 고객의 요건에 따라서는 https://validator.w3.org/에서 검증하면 다음과 같은 경고가 발생한다는 점도 고려할 수 있습니다.

경고:요소 양식에는 양식 역할이 필요하지 않습니다.

역할 및 기타 속성은 화면 판독기의 접근성을 향상시킵니다.이것은 간접적으로 탐색 거미가 개별 섹션을 식별하고 이해하는 데 도움을 줄 수 있습니다.이것과 마이크로 데이터 스키마를 비교하면 SEO가 조금 향상됩니다.

역할 속성은 주로 화면 판독기를 사용하는 사용자의 접근성을 향상시킵니다.접근성, 디바이스 적응, 서버측 처리, 복잡한 데이터 설명 등 다양한 경우에 사용합니다.자세한 것은, https://www.w3.org/WAI/PF/HTML/wiki/RoleAttribute 를 클릭해 주세요.

"역할 속성"은 시력이나 시력에 문제가 있는 사람들을 돕기 위해 개발되었습니다.화면 리더는 사용자에게 요소에 대해 알려줍니다.쉬운 작업처럼 보이지만 그렇지 않습니다.전문가가 아니고 확실하지 않으면 역할을 할당하지 마십시오.여기서 읽을 수 있다

ARIA의 부실한 실장이 때로는 해결할 수 있는 것보다 더 많은 문제를 일으켜 콘텐츠의 접근성을 떨어뜨릴 수 있음을 이해하는 것이 중요합니다.이 문제는 ARIA를 사용하는 방법과 시기에 대한 지식이 부족하기 때문에 발생할 수 있습니다.

일부 HTML 요소에는 암묵적인 역할이 있습니다.예를 들어 다음과 같습니다.

h1,h2...h6            -> heading
ul,li                 -> list
button                -> button
a                     -> link
<input type="text"/>  -> text

더 자세히 설명하려면 이러한 항목을 재정의할 수 있습니다.

SEO의 경우 접근성과 서신화를 읽을 수 있습니다.

구글 검색 엔진 랭킹 팩터를 검색하면 SEO/SEM 업계의 리더들이 SEO를 개선하는 많은 요소들을 개략적으로 보여주는 다수의 결과가 표시됩니다.식별된 대부분의 순위 요소는 접근성과 어떤 관계도 없습니다.사실, 많은 구글 순위 요인들조차 접근성과 큰 관계가 없습니다.

SEO OVLAP도 읽어보실 수 있습니다.

양쪽 모두에 대해 올바르게 최적화하기 위해서는 SEO와 접근성(a11y)이 겹치는 부분을 이해하는 것도 중요하지만, 한쪽을 위해 최적화하는 것이 다른 한쪽을 위해 최적화하는 것과 반드시 비슷하다고는 할 수 없다는 점도 중요합니다.즉, 검색 엔진용으로 페이지를 최적화하고 있는 경우는, 반드시 액세스 가능하게 한 것은 아닙니다.또, 그 반대의 경우도 마찬가지입니다.

언급URL : https://stackoverflow.com/questions/10403138/what-is-the-purpose-of-the-role-attribute-in-html