context-id

• context-id는 앨리(A11y)에서 중복되는 이미지를 하나의 맥락(Context)으로 묶어 관리하기 위해 사용자가 부여하는 식별자 속성값이에요.

• 같은 의미의 이미지에 동일한 context-id 를 부여하면,

  앨리에서 해당 이미지를 하나의 맥락 단위로 인식하고 대체 텍스트를 일관되게 관리할 수 있어요.

별도의 규칙이나 형식 제한은 없어요.

다만, 네이밍 기준이 명확하지 않은 경우 아래 구조 사용을 권장해요

Scope - Type - Name - Dup

• scope: 이미지가 사용되는 화면, 기능 또는 영역 식별자

• Type: 이미지 유형 (예: img, bg, i)

• Name: 이미지의 의미 또는 역할

• Dup: 중복 이미지 여부 (중복 시에만 사용)

• test01-bg-history-dup

• test01-img-history

• test01-i-history

context-id 는 운영중인 웹 사이트의 HTML 코드에 직접 추가해야 해요.

data-a11y-context-id 속성을 이미지 요소에 명시적으로 입력해야해요.

• context-id는 앨리(A11y) 화면에서 직접 추가하거나 생성할 수 없어요.

• 반드시 개발자가 HTML 코드에 data-a11y-context-id 속성으로 직접 정의해야 해요.

• a11y-context-id 값은 사용자가 임의로 정의할 수 있으며, 이후 다시 수정할 수 있어요.

• alt 또는 title 속성이 존재하더라도 삭제하지 않고 함께 사용할 수 있어요.

• 중복되는 이미지에는 같은 context-id 값을 부여하는 것이 좋아요.

• 공통 UI 아이콘 (검색, 닫기, 이전/다음, 메뉴 버튼 등)

• 여러 페이지에서 반복 노출되는 배너 이미지

• 동일한 의미의 장식용 이미지

• 템플릿 기반으로 재사용되는 이미지 요소