210309 퍼블리싱 되새김질 part2

1) Colour Contrast Analyser (CCA)

 - 전경 색, 배경색의 명도 대비를 체크해주는 프로그램입니다.

 - 명도 대비는 최소 3:1 이상이 되도록 구현해야 합니다.

2) KWCAG a11y inspector

 - 웹 페이지에서, 컨트롤의 대각선 길이를 측정해주는 프로그램입니다.

 - 크롬 웹 스토어에서 설치가 가능합니다.

 - 웹에서의 컨트롤 크기는 대각선 6mm 이상으로 구현해야 합니다.

3) OpenWAX

 - 접근성을 자동으로 진단해주는 프로그램입니다.

 - 크롬 웹 스토어에서 설치 가능합니다.

 - 자동 진단이 정확하지는 않기 때문에, 수동 진단 병행이 필요합니다.
 
 

Reset 스타일

body,
h1, h2, h3, h4, h5, h6 {
  margin:0;
}
ul, ol, dl, dd {
 margin:0;
 padding:0;
}
ul, ol {
 list-style:none;
}
table {
 border-collapse:collapse;
}
p {
  margin:0;
  padding:0;
}
em {
  font-style:normal;
}
a {
  color:inherit;
  text-decoration:none;
}
a:hover {
  text-decoration:underline;
}
img {
  vertical-align:top;
}
fieldset, legend {
  margin:0;
  padding:0;
}
fieldest{
  border:0;
}

IR기법

• Image replacement 사용자에게 적절한 대체 텍스트를 제공
• 태그의 alt 속성 값으로 표현하기에 대체 텍스트가 너무 길거나, CSS background 속성을 사용하여 처리한 의미 있는 이미지일 경우, 마크업으로 대체 텍스트를 제공합.
• 대체 텍스트가 너무 긴 경우나 background-image 속성으로 처리한 의미 있는 이미지에 대해 시멘틱 마크업 유지하고, 스크린 리더 인식 가능하고, 레이아웃과 성능에 영향이 없는 CSS 속성을 사용하고, blind 클래스를 활용