웹접근성지침(WCAG2.0)
-
[웹접근성 지침-일반기술 G201] 새 창을 열 때에는 사용자에게 미리 알려줘야 한다.
사용자가 혼란을 격지 않도록 새 창이나 탭으로 연결되는 링크나 버튼은 사용자에게 미리 이 사실을 알려줘야 합니다.기술설명이 기술의 목적은 새 창이나 탭을 열기 전에 사용자에게 미리 알려주는 것입니다.링크를 활성화 할 때 새 창으로 열리면 시각적 콘텐츠 인식에 어려움을 가졌거나 인식 장애가 있는 사용자에게 방향 감각을 잃게 만듭니다. 즉 사이트 내에서 어디에 위치해 있는지를 잊을 수 있습니다.사용자에게 이 링크나 버튼을 활성화하면 새 창으로 나타난다는 것을 미리 알려주게 되면 사용자는 선택할 수 있습니다.사용자가 새 창으로 이동하는 것을 선택하였다면, 다시 돌아 갈 수 있도록 도와주어야 합니다.사용자가 새 창을 이용하면 브라우저의 [뒤로(Back)]버튼을 이용해도 이전 창으로 돌아 갈수 없다는 것을 알게 ..
더보기
-
[웹접근성 지침-일반기술 G200] '새 창'과 '탭 열기'는 필요할 때만 사용하자.
버튼이나 링크를 눌렀는데 갑자기 새로운 화면이 나타나면 사용자들은 자신이 사이트의 어디 부분에 있었는지를 잊어버리면서 혼란을 느낄 수 있습니다. 그래서 새 창이나 탭 콘텐츠를 보여주는 방식은 최대한 피하는 것이 좋습니다.기술설명이 기술의 목적은 웹 콘텐츠 내에서 새 창이나 탭을 여는 링크에 대한 버튼을 최소한으로 사용하는 것입니다.새 창 및 탭은 시각적 콘텐츠를 이해하는데 어려움이 있는 사용자들에게 방향을 잃게 하는 문제점이 있기 때문입니다.하지만 상황에 따라 새 창 및 탭을 사용해야 하는 경우도 있습니다. 그러한 경우는 다음과 같습니다. 1. 양식을 작성 할 때 '도움말'이나 '날짜 선택기'와 같이 작성을 도와주는 대체 수단들이 새 창이나 탭으로 제공되지 않고 같은 페이지에 보이게 되면 이전에 작성한 ..
더보기
-
[웹접근성 지침-일반기술 G199] 데이터가 성공적으로 서버에 제출되었다면 성공사실을 사용자에게 알려주자.
양식을 작성한 후에 전송을 하면 전송 결과에 대한 메시지를 알림창이나 결과 페이지를 통해 사용자에게 알려주어야 합니다. 그래야 사용자가 안심할 수 있습니다. 기술설명이 가술의 목적은 사용자가 양식(form)을 작성하여 제출하는 작업 등을 성공적으로 완료 했는지를 확인하는데 필요한 노력을 줄여주는 것입니다. 사용자가 직접 작업 성공 여부를 확인하지 않아도 작업의 성공 여부를 사용자에게 알려주어야 합니다. 사용자가 입력한 내용들이 데이터베이스에 성공적으로 전달 되었는지 또는 원하는 사람에게 전달되었는지 등을 확인하기 위해 직접 찾아 보는 것은 무척 힘든 일입니다. 예시[예시1] 사용자가 시스템에 로그인 하면 '성공적으로 로그인했습니다.'라는 응답을 받게 됩니다.이로 인해 사용자가 자신의 이름으로 검색하거나..
더보기
-
[웹접근성 지침-일반기술 G198] 사용자가 제한시간을 해제할 수 있는 기능을 제공하자.
장애가 있는 사용자를 위해 제한시간을 넉넉하게 주고 제한시간을 해제할 수 있는 버튼이나 링크를 제공해야 합니다. 기술설명이 기술의 목적은 제한 시간 내에 작업을 완료 할 수 없는 사용자를 위해 제한 시간을 해제할 수 있는 기술을 제공하는 것입니다.제한 시간을 해제하거나 제한 시간 내에 작업을 완료 할 수 있게 지원해 주어야 합니다.장애를 가진 사용자가 이 기술을 빨리 활성화 시킬 수 있도록 페이지 상단이나 그 근처에 해당 기술의 버튼이나 링크를 제공해야 합니다. 예시웹 페이지 내에 분 단위로 뉴스 헤드라인 목록이 업데이트 되고 있습니다.페이지 상단에 업데이트를 끄는 링크가 제공되고 있습니다. 관련기술G133: 멀티파트 양식의 첫 페이지에 사용자가 더 긴 세션 시간 제한을 요청하거나 세션 시간 제한을 ..
더보기
-
[웹접근성 지침-일반기술 G197] 동일한 기능을 가진 콘텐츠의 레이블(label) 및 이름(name) 또는 대체 텍스트는 동일해야 한다.
동일한 기능을 가진 요소라면 해당 요소의 '텍스트(name)' 및 '라벨(label)' 또는 '대체 텍스트'를 동일하게 사용하여 사용자의 혼란을 막아야 합니다.기술설명이 기술의 목적은 인지 장애 또는 시력에 문제가 있는 사용자를 위한 것으로 웹 페이지의 기능과 상호 작용 시 어떤 일이 일어나는지를 이해할 수 있게 도와주는 것입니다.요소 및 링크 같은 인터페이스가 동일한 기능을 가진 경우, 각각의 레이블(label) 내용이 다르다면 어떤 연관성이 있는지 어떤 기능이 있는지 무엇을 해야 할지 모를 수 있습니다. 그러므로 동일한 기능을 가졌다면 동일한 내용의 레이블(label)을 일관성 있게, 웹사이트 전체에 적용해야 합니다. 예시[예시1] 웹 페이지 상단에 '검색'이라는 라벨이 붙은 양식(form)이 있습..
더보기
-
[웹접근성 지침-일반기술 G196] 그룹화 된 이미지가 있다면 그중 한 이미지의 대체 텍스트에 그룹화 된 이미지의 목적을 설명해야 한다.
이미지 그룹으로 정보를 제공한다면 그룹 내의 한 이미지에만 대체 텍스를 제공해주어야 합니다. 기술설명이 기술의 목적은 비텍스트 콘텐츠가 그룹화 된 경우, 정보나 기능을 표현하는 것에 대한 불필요한 중복을 피하는 것입니다. 페이지에서 어떤 정보를 전달하기 위해 여러 이미지를 조합하여 다양한 유형의 정보를 전달하는 경우가 있습니다.예를 들어 '검은색 별 이미지'와 '흰색 별 이미지' 두 개를 조합하여 사용자의 평가 정보를 표현할 수 있습니다.'검은색 별 이미지' 3개와 '흰색 별 이미지' 2개로 '별 5개중 3개를 평가 받았다'라고 표현할 수 있습니다. 이 기술을 사용하려면 작성자는 그룹 안에 한 항목에 그룹의 목적을 설명하는 대체 텍스트를 제공해야 하며, 나머지 항목은 보조 기술이 무시할 수 있게 만들어야..
더보기
-
[웹접근성 지침-일반기술 G195] 잘 보이는 초점 표시기를 제공해야 한다.
'초점(focus)'이 잘 보일 수 있도록 만들어야 합니다. 그래야 초점이 어디에 있는지 무슨 콘텐츠를 보고 있는지 빠르게 파악 할수 있습니다.기술설명이 기술의 목적은 콘텐츠를 더 잘 보기 위해 브라우저에서 제공하는 초점 표시기를 향상 시키는 것입니다.대부분의 브라우저에서 제공하는 초점 표시기는 얇은 검은색 점선으로 표시됩니다.윤곽선이 있는 입력 양식이나, 테이블 내부, 아주 작은 크기의 요소, 배경이 어두운 곳에 있는 요소의 경우 초점 표시기가 잘 안 보이는 문제점이 있습니다. 이 기술을 이용하면 마우스, 탭 키, 화살표 키, 단축키 등으로 요소를 포커스 할 때, 강한 대비의 색상으로 된 두꺼운 선과 빛을 이용하여 포커스 된 해당 요소를 더 잘 보이게 만들어 줍니다. 예시[예시1] 어두운 배경색에..
더보기
-
[웹접근성 지침-일반기술 G194] 맞춤법 검사 및 텍스트 입력 제안에 대한 기능을 제공합니다.
입력한 단어에 대한 맞춤법 검사 및 입력제안에 대한 기술을 사용하면 사용자는 오타를 줄일 수 있습니다.뿐만 아니라 자판을 치는데 어려움이 있는 사용자들에게는 빠르게 작성 할 수 있는 도구가 되기도 합니다. 기술설명이 기술은 맞춤법 검사 및 텍스트 입력 제안에 대한 기술을 제공하는 것입니다.인지 장애가 있는 사용자의 경우 맞춤법에 맞게 텍스트를 입력하는 것이 어려울 수 있습니다.만약 맞춤법 검사 프로그램이 있다면 맞춤법에 맞는 단어를 제공받아 빠르게 완성할 수 있습니다. 이는 시각 장애 및 저 시력자에게도 유용한 기술입니다. 그리고 타이핑이 힘든 사용자에게도 도움을 주는 기술이빈다.맞춤법 검사 프로그램은 단어를 제안하고 제안한 단어 중에 사용자가 하나를 선택하면 입력 필드에 입력이 되는 기술로 사용자에게 ..
더보기
-
[웹접근성 지침-일반기술 G193] 웹 페이지에서 도우미를 통해 도움을 받아 수 있다.
처음 방문한 사용자들이 홈페이지를 잘 이용할 수 있게 도와주는 영상을 제공해 주면 좋겠습니다. 기술설명이 기술은 영상에서 아바타 같은 도우미를 통해 웹 사이트에 대한 도움을 받을 수 있는 기술을 말합니다.아바타는 글을 읽는데 어려움이 있는 사용들에게 도움이 됩니다.시각 자료를 통해서 정보를 제공하기 때문에 집중해서 사용자들이 집중해서 볼 수 있습니다. 예시[예시1] 온라인 뱅킹 홈페이지에 배나라는 이름의 아바타가 있습니다. 아바타는 처음 온라인 뱅킹을 이용하는 사용자들에게 사용방법을 안내해 줍니다. 안내 내용을 시작, 중지, 일시 중지를 할 수 있습니다.사용자는 원하는 내용으로 되돌아가거나 빨리 넘어갈 수 있습니다. 대체 텍스트는 아바타 옆에 링크로 제공됩니다. [예시2] 자원 봉사를 위한 사이트입니..
더보기
-
[웹접근성 지침-일반기술 G192] 최대한 WCAG 2.0이 제시한 데로 만들자.
최대한 'WCAG 2.0(웹 콘텐츠 접근성 가이드라인 2.0)'에 따라 제작해야 합니다.기술설명HTML이 사양에 맞게 제작되는 경우 ‘성공기준 4.1.1’을 충족하게 됩니다.즉 WCAG 2.0 양식을 완전하게 따를 필요는 없지만 되도록 따른다면 좋습니다. 예시모든 기술이 사양에 맞도록 주의해서 제작합니다. 검증기를 이용하여 오류를 수정합니다. 검증기를 통해 확인 안 되는 사항도 찾아서 수정합니다. 관련기술G134: 웹 페이지 검증H74: 사양에 따라 여는 태그와 닫는 태그가 사용되도록 보장H75: 웹 페이지가 잘 구성되어 있는지 확인하기H88: 스펙에 따른 HTML 사용 점검절차1. 모든 기술이 사양에 맞게 제작되었는지 확인합니다. 나의 정리HTML과 XML은 마크업 언어로 제작 시 지켜야 ..
더보기
-
[웹접근성 지침-일반기술 G191] 깜빡임 없는 페이지로 다시 로드할 수 있는 링크나 버튼 같은 기술을 제공해야 합니다.
깜빡임은 사용자에게 불편함을 줄 수 있습니다. 깜빡임 없는 버전의 웹페이지로 이동할 수 있는 버튼이나 링크를 제공해 주어야 합니다.기술설명이 기술은 깜빡임을 힘들어 하는 사용자들을 위해 깜빡이는 콘텐츠들을 끌 수 있게 해주는 일반적인 기술입니다.'깜빡임이 없는 페이지'와 '깜빡임이 있는 페이지'의 내용과 기능들은 동일하게 제공되어야 합니다. 예시웹 페이지 상단에 사용자에게 경고를 알리는 글이 깜빡입니다.웹 페이지 상단에 있는 링크를 이용하여 페이지를 다시 불러들이자 경고를 알리는 글은 더 이상 깜빡이지 않고 눈에 잘 보이는 스타일로 바뀌었습니다. 관련기술 G4: 콘텐츠가 일시 중지되고 일시 중지된 지점에서 다시 시작할 수 있도록 허용G11: 5초 이내로 깜빡이는 콘텐츠 만들기G152: 애니메이션 g..
더보기
-
[웹접근성 지침-일반기술 G190] '웹 접근성'을 준수하지 않은 요소 옆에는 '이를 대체 버전으로 연결시키는 링크'를 제공해야합니다.
웹 접근성 규정에 맞지 않는 콘텐츠를 제공하고 있다면, 해당 콘텐츠 옆에 대체 버전으로 이동할 수 있는 링크를 제공해야 합니다. 대체 버전은 원본과 내용 및 기능이 동일하게 제공되어야 합니다.기술설명웹 페이지의 모든 요소나 개체가 웹 접근성에 맞게 제작되면 좋지만, 특정 상황으로 인해 이를 준수 하지 못하는 경우가 있을 수 있습니다. 특정 장애가 있는 사람을 대상으로 객체나 콘텐츠를 만든 경우 다른 사람들이 접근하기 힘든 경우가 생기기도 합니다.웹페이지에서 웹 접근성에 맞지 않는 객체가 있는데 에는 다른 이유가 있을 수 있습니다.객체가 규격에 맞지 않다면 '규격에 맞는 대체 버전을 제공하는 링크'가 읽기 순서에 맞게 '규격에 맞지 않는 객체'에 인접해 있어야 합니다. 또는 규격에 맞지 않는 콘텐츠가 링크..
더보기
