태그 i WCAG 2.0을 어떻게 호환 가능합니까?

시맨틱 -UI 프레임 워크를 사용 중이며 아이콘에 i 태그를 사용해야합니다. 다음은 예입니다태그 i WCAG 2.0을 어떻게 호환 가능합니까?

<i class="icon search"></i>

내가 WCAG 2.0 (레벨 AA)에 내 코드 준수 만들고 싶어 나는 AChecker validator을 사용하고 있습니다. i 태그가 나는 다음과 같은 오류가 포함하는 모든 라인 :

1.4 Distinguishable: Make it easier for users to see and hear content including separating foreground from background. 

Success Criteria 1.4.4 Resize text (AA) 

Check 117: i (italic) element used. 
Repair: Replace your i elements with em or strong.

나는 기울임에 대한 i을 사용하지 않는 em 나 때문에 시맨틱-UI 구성 요소 사용의 strong으로하고 있기 때문에이를 대체 할 수 있기 때문에, 검사기가 오류를받지 못하도록 해결하려면 어떻게해야합니까? 내가보기로

출처

2017-01-26 smartmouse

가능한 중복 (http://stackoverflow.com/questions/23015537/how- do-i-make-font-awesome-wcag-2-0-compatible) –

그것은 중복이 아닙니다. 그 질문에 해결책은 Font Awesome에서 작동하는'span'을 사용하는 것입니다. 나는 Semantic-UI를 사용하여 나의 질문에 글을 쓰면서 FA를 사용하지 않는다. – smartmouse

당신은 선택의 프레임 워크로 '시맨틱-UI'에 자신을 묶는되기 때문에, 두 가지 옵션이 있습니다

변경 소스 icons.css 구성 요소를 다음 span.icon에 대한 i.icon 참조를 스왑 <span> 요소를 사용하십시오.
실제로 접근성 문제를 해결하려고 시도하는 대신 액세스 가능성 문제를 해결합니다. 보조 기술 사용자가 대체 설명이 필요해 보이는 것처럼 <i class="icon search"></i> 아이콘을 사용하는 것으로 판단합니다.

글꼴 신난다는 꽤 좋은 조언이 : [? 내가 글꼴 최고 WCAG 2.0 호환되도록하려면 어떻게]의

Icons with semantic or interactive purpose

If you're using an icon to convey meaning (rather than only as a decorative element), ensure that this meaning is also conveyed to assistive technologies. This goes for content you're abbreviating via icons as well as interactive controls (buttons, form elements, toggles, etc.).

http://fontawesome.io/accessibility/

출처

2017-01-27 12:44:41

옵션 2가 작동하지 않습니다. achecker가 유효성을 검사하지 않습니다. 게다가 FA 접근성은 WGAG 2.0과 호환되지 않는 것으로 보인다. – smartmouse

문제는 프레임 워크와 아이콘 글꼴 구현의 선택 때문입니다. –

태그 i WCAG 2.0을 어떻게 호환 가능합니까?

답변

관련 문제