접근성: 사이트 구조 준비하기
페이지 메뉴
- 텍스트 준비를 위한 권장사항
- 에디터에서 텍스트에 HTML 태그 추가하기
- 접근성 마법사에서 텍스트에 HTML 태그 추가하기
사이트의 계층 구조(사이트 구조)는 웹 브라우저와 스크린 리더가 사이트 콘텐츠를 어떻게 구성해야 하는지 이해하는 데 도움을 줍니다. 사이트 텍스트에 HTML 태그를 추가하면 사이트의 순서에 맞는 위치를 알려 주고 방문자에게 더 명확한 경험을 제공할 수 있습니다.
알아두면 좋은 정보:
사이트 페이지의 DOM 순서에 따라 웹페이지 콘텐츠가 "읽힙니다". 이 순서를 확인하고 필요하면 조정할 수 있습니다.
사이트 순서를 구성하는 방법에 대해 자세히 알아보세요.
텍스트 준비를 위한 권장사항
사이트 텍스트를 준비할 때는 아래 가이드라인을 참고해 주세요:
- 텍스트에 HTML 태그를 사용합니다: 모든 페이지에는 H1 제목이 있어야 하며, 그다음에는 각 페이지의 HTML 태그가 순차적으로 이어져야 합니다. 예를 들어 페이지의 주요 제목이 H1 태그라면 부제목은 H2여야 합니다. 이렇게 해야 시각 장애가 있는 방문자도 콘텐츠를 논리적인 순서로 이동할 수 있습니다.
- 제목은 구체적으로 작성합니다: 제목은 아래 텍스트의 라벨이라고 생각하면 됩니다. 이는 SEO에도 중요합니다.
- 간격도 중요합니다: 텍스트를 편집할 때 제목을 여러 줄로 나누고 싶다면 Shift + Enter 키로 줄바꿈을 넣어 주세요. 각 줄마다 새로운 제목 요소를 만드는 Enter 키는 사용하지 않습니다.
- 페이지 본문에 제목을 추가합니다: 사이트 머리글에 추가한 H1은 머리글이 표시되는 모든 페이지에 나타납니다. 따라서 제목은 페이지 본문에 추가하는 것을 권장합니다.
도움말: 추가 페이지가 없는 단일 페이지 사이트라면 이 권장사항은 무시해도 됩니다.
에디터에서 텍스트에 HTML 태그 추가하기
사이트 텍스트에 HTML 태그를 추가해 계층 구조를 정의합니다. Wix 에디터로 사이트를 만들고 있다면 텍스트 설정에서 태그를 선택할 수 있습니다. Studio 에디터를 사용 중이라면 속성 검사 패널에서 찾을 수 있습니다. Wix 하모니 에디터의 텍스트 디자인 옵션에서도 이 옵션을 사용할 수 있습니다.
Wix 에디터
Studio 에디터
Wix 하모니 에디터
- 에디터에서 해당 텍스트를 선택합니다.
- 1텍스트 편집을 선택합니다.
- SEO 및 접근성을 선택합니다.
- 드롭다운 메뉴에서 HTML 태그를 선택합니다.
접근성 마법사에서 텍스트에 HTML 태그 추가하기
접근성 마법사로 사이트를 스캔해 텍스트 요소의 태그를 찾고 조정합니다. 이 마법사는 모든 사이트 빌더에서 사용할 수 있으므로 작업 중인 어떤 사이트든 접근성을 개선할 수 있습니다.
대부분의 텍스트는 마법사 안에서 바로 수정할 수 있습니다. 하지만 일부 텍스트 요소(예: 앱 텍스트)는 아직 마법사와 완전히 연동되지 않아 수동 조정이 필요할 수 있습니다.
Wix 에디터
Studio 에디터
Wix 하모니 에디터
- 에디터로 이동합니다.
- 상단에서 설정을 클릭합니다.
- 접근성 마법사를 선택합니다.
- 사이트 스캔을 선택합니다.
- 발견된 문제 탭을 클릭합니다.
- 해당 페이지를 선택합니다.
- 제목 구조 정리를 클릭합니다.
- 해당 텍스트 엘리먼트를 선택합니다.
- 마법사에서 해당 텍스트가 지원되는지에 따라 아래 방법 중 하나를 따릅니다. 제목 태그를 직접 업데이트할 수도 있고 AI 도구를 사용할 수도 있습니다.
AI로 최적화
마법사에서 태그 선택하기
태그를 수동으로 조정합니다
을 클릭합니다.
다음 단계:
사이트의 접근성 향상을 계속하려면
접근성 체크리스트로 돌아갑니다.