같은 이미지라도 사용된 맥락에 따라 의미가 달라질 수 있는 이미지를 의미해요.
맥락형 이미지 예시 (동일한 흰색 돋보기 아이콘이 각각 장식형과 기능형으로 사용된 사례)
이처럼 같은 이미지라도 사용된 위치와 역할에 따라 장식형 이나 기능형으로 달라질 수 있어요.
앞·뒤 맥락을 파악할 수 있는 정보가 없어, 정확한 유형 분류와 대체 텍스트 생성이 어려운 이미지는 맥락형으로 분류돼요.
앨리는 스마트 필터링 시스템을 통해 반복적으로 사용된 이미지를 자동으로 인식하고,
동일한 이미지에는 하나의 대체 텍스트를 공통적으로 적용해 관리해요.
하지만 맥락형 은 동일한 이미지라도 사용된 맥락에 따라 의미가 변경될 수 있기 때문에,
이미지를 간단히 묘사한 기본적인 대체 텍스트만 제공하며 배포 대상에서는 제외돼요.
맥락형 이미지를 사이트에 활용하려면 아래 방법 중 하나를 선택해주세요.
context-id활용하기
동일한 이미지에 서로 다른 대체 텍스트를 적용할 수 있어요.
웹 접근성 개선 서비스 신청하기
전문가의 검토를 통해 사이트의 전반적인 웹 접근성을 개선할 수 있어요.
웹 사이트에서 직접 대체 텍스트 제공하기
HTML 코드에 직접
alt값을 적용해요.
context-id 에 대한 자세한 내용은 아래 링크를 확인해주세요!
context-id
context-id 란? context-id는 앨리(A11y)에서 중복되는 이미지를 하나의 맥락(Context)으로 묶어 관리하기 위해 사용자가 부여하는 식별자 속성값이에요. 생성 규칙 별도의 규칙이나 형식 제한은 없으나, 네이밍 기준이 명확하지 않은 경우, Scope - Type - Name - Dup 구조를 사용하는 것을 권장해요. - scope: 이미지가 사용되는 화면, 기능 또는 영역 식별자 - Type: 이미지 유형 (예: img, bg, i) - Name: 이미지의 의미 또는 역할 - Dup: 중복 이미지 여부 (중복 시에만 사용) 예시 - test01-bg-history-dup - test01-img-history - test01-i-history 추가 방법 1. <img> 태그에 추가하는 경우 <img src=“icon-search.png” alt=”검색” data-a11y-context-id=“test01-img-search” /> 2. <i> 태그에 추가하는 경우