header-logo
시작하기Wix를 사용해 사이트 및 비즈니스를 구축하는 방법을 알아보세요. 템플릿을 사용해 사이트를 맞춤화하거나, 전문가를 고용해 웹 존재감을 강화할 수 있습니다.
사이트 제작Wix 에디터를 사용하고 사이트 콘텐츠를 관리하는 방법을 알아보세요. 방문자의 개인정보를 보호하고 사이트에 대한 접근성을 높이는 방법 또한 확인할 수 있습니다.
계정 및 결제계정 설정을 검토하고, 구독 및 프리미엄 플랜을 관리하고, 인보이스를 이해하세요.
Wix 모바일 앱Wix Owner 앱을 사용해 비즈니스를 효율적으로 운영하고 방문자와 소통하며 커뮤니티를 구축하세요.
도메인 연결도메인 구매, 연결, 이전 방법 및 사이트 데이터를 안전하게 유지하는 방법을 알아보세요.
비즈니스 관리비즈니스를 구축하고 성장시키는 데 적합한 도구를 찾으세요. 결제 승인, 애널리틱스 분석 검토, 방문자와 교류 등의 작업을 할 수 있습니다.
사이트 홍보검색 엔진에서 사이트를 홍보하고, 이메일 캠페인을 발송, 유료 광고를 게재하는 방법 등을 알아보세요.
Studio 및 파트너Studio 및 파트너 계정을 최대한 활용해 비즈니스를 확장하세요.
고객센터사이트 성능 및 기술 문제 해결에 대한 정보를 얻으세요. 제품 로드맵에서 향후 기능을 추적할 수도 있습니다.
placeholder-preview-image
Wix Learn강좌 및 튜토리얼을 통해 실력을 향상시키세요.
Wix 블로그웹 디자인, 마케팅 등에 대한 팁을 확인하세요.
SEO 러닝 허브검색 엔진에서 유기적 사이트 트래픽을 증가시키는 방법을 알아보세요.
Website development풀스택 플랫폼을 활용해 맞춤형 사이트를 구축하세요.
전문가 고용하기목표 달성에 도움을 줄 전문가를 만나보세요.
placeholder-preview-image
페이지 메뉴
  • ARIA 속성 추가하기
  • ARIA 속성 편집하기
  • ARIA 속성 유형

접근성: 사용자 지정 웹 애플리케이션에 ARIA 속성 추가하기

페이지 메뉴
  • ARIA 속성 추가하기
  • ARIA 속성 편집하기
  • ARIA 속성 유형
ARIA 속성은 스크린 리더와 같은 보조 기술 요소의 의미 체계에 대한 추가 정보를 제공합니다. ARIA 속성을 사이트의 모든 사용자 지정 요소 또는 애플리케이션에 추가할 수 있습니다.
ARIA 속성은 요소의 기본 HTML로 액세스할 수 없는 경우 사용자 지정 요소 및 애플리케이션에 액세스할 수 있는 방법을 정의하므로 중요합니다. 
중요!
이 기능은 ARIA 속성이 필요한 사용자 지정 애플리케이션/요소를 보유한 사용자를 대상으로 합니다. 사이트에 ARIA 속성이 없다면 ARIA 속성을 편집할 필요가 없습니다.

ARIA 속성 추가하기

Wix는 사이트 대부분의 요소에 대해 이미 ARIA 속성을 하드코딩했습니다. 하지만 사용자 지정 애플리케이션을 추가한 경우 접근성을 위해 고유한 ARIA 속성을 추가할 수 있습니다.
Studio 에디터에서 개발자 모드(Velo by Wix)를 활성화해 요소에 속성을 추가하세요. Velo를 사용하면 코딩 추가, 데이터베이스 구축 등의 작업을 수행할 수 있습니다.
  1. 에디터 왼쪽에서 코드 아이콘을 클릭합니다.
  2. 해당 앱 또는 요소를 선택한 후 추가 작업 아이콘을 클릭합니다.
  3. 접근성을 선택합니다.
  4. 속성 추가를 선택합니다.
  5. 드롭다운 메뉴에서 속성을 선택합니다.
  6. 라벨을 입력합니다. / 레벨 또는 값을 선택합니다.
  7. 추가를 선택합니다.
Studio 에디터에서 요소의 접근성 패널입니다. 커서가 속성 추가 버튼을 클릭하고 있습니다.

ARIA 속성을 다음 요소에 추가할 수 있습니다.

요소속성
라이트박스
label
텍스트 
컨테이너 상자
label, tabindex, role [region, group, none, status, alert], live, relevant, atomic, current, controls, hidden
스트립
label, tabindex, role [heading, status, alert], live, atomic, hidden, current
반복 레이아웃
label, role [heading, status, alert]
텍스트 버튼
tabindex, pressed, expanded, haspopup
Wix에서는 더 많은 요소에 ARIA 속성을 추가할 수 있는 기능을 지속적으로 개발하고 있습니다. ARIA 속성에 대한 특정 요청 사항이 있다면 [고객지원 팀에 알려주세요.

ARIA 속성 편집하기

사용자 지정 애플리케이션에 속성을 추가한 후 접근성 아이콘을 사용해 언제든지 속성을 편집 및 업데이트할 수 있습니다. 이 아이콘은 속성을 연결한 요소에 자동으로 추가됩니다.

속성을 편집하려면:

  1. 에디터에서 요소 또는 응용 프로그램을 선택합니다.
  2. 접근성 아이콘을 선택합니다.
  3. 해당 속성에 마우스오버한 후 추가 작업 아이콘을 클릭합니다.
  4. 편집을 선택합니다.
  5. 원하는 대로 변경하고 저장을 선택합니다.

ARIA 속성 유형

속성 이름카테고리토큰
tabindex

0, -1
역할

token: 원시 내 정의에 따름
aria-level

int
aria-live
라이브
token: polite, assertive
aria-multiline 
설명
true, false
aria-multiselectable
설명
true, false
aria-pressed
시/도/주/지역
true, false
aria-relevant
라이브
token: all, additions, removals, text
aria-activedescendant
관계
ID_REF
aria-atomic
라이브
true, false
aria-autocomplete
설명
true, false
aria-controls
관계
ID_REF
aria-current
시/도/주/지역
step, page, true, false
aria-descriptions
관계
ID_REF (공백으로 구분된 아이템)
aria-expanded

true, false
aria-haspopup
관계
dialog, menu, true, false
aria-hidden

true, false
aria-invalid
시/도/주/지역
true, false
aria-label

string
aria-labelledby 
관계
ID_REF (공백으로 구분된 아이템)

Helpmate

안녕하세요 님,

추가 도움이 필요하신가요?
Unlock personalized helpLog in to get the most out of Helpmate.