​​​​ 코딩공부)HTML_웹표준 9일차-웹접근성검사

웹접근성

웹접근성 연구소 - 한국형 웹 접근성 지침2.1(KWCAG)숙지

img - alt(이미지의 내용 그대로)리더기가 읽는 부분

웹접근성 준수 - 잠재적 고객증가

skipMenu(바로가기)

· 모든 웹사이트는 바로가기가 첫번째로 있어야 한다.

 바로가기(시각 장애인들을 위해) - H1

· 바로가기 작성방법

 skipMenu의 순서 자주 사용하는 순서 style은 여러종류가 있음

웹 접근성 검사

· 크롬 - 웹스토어 열기 - n-wax(웹 접근성 검사) - 설치 - 닷홈에 올려진것만 검사가능

· 개발자들 공유사이트 - 네이버(널리) - 나눔 - Coding Convention/Unused CSS Check Tool 

 활용(css작성시 안쓰는 css검사해줌)

쓰이는단어 익히기

· 네이버 - 웹표준 검사 - http://validator.kldp.org/ - 마크업 검사

*관련 태그*

1.table : 표의 바깥쪽 테두리

2.tr(Table Row) : 행(줄) 만들기,같은 줄에 있는 셀(칸)의 집합

3.td(Table Data Cell) : 셀(칸) 만들기,실제 내용 입력

4.th(Table Header) : 제목 셀

5.captoin : 표의 제목

6.summary(속성) : 표의 제목

7.col : 같은 순서에 있는 칸들을 그룹화(세로칸)

8.colgroup : col의 집합

9.thead/ftoot/tbody : 각 셀들의 역할 별 구분

- thead : 제목, tfoot : 결과, tbody:내용

- 필요하지 않은 태그들은 생략 가능

- 태그 사용시 반드시 위 순서대로 사용

10.id(속성) : 제목 셀에 이름 부여

11.header(속성) : 해당 셀의 제목셀 지정

선택자(selector) - 속성 - 속성값

style의 ; 는 앞뒤로 같은효과

다음 - 내부스타일 / 네이버 - 외부스타일

과제 : 다음사이트 속성들의 종류조사 무슨효과, 값은 어떤값을 주는지 정리

ex) border - 테두리 - 테두리 두께,컬러

표안에 제목을 넣는다<caption> - 디자인 하기도 쉽다 - 하지만 스크린리더기 못 읽을수도 있다

그래서 summary로 표의제목을 넣는데 속성값은 다르게 해야한다.(중복방지)

<thead> 머릿글!! <tbody>본문내용 - 장치가 제대로 읽음

사람,장치 다이해할 수 있는 코딩

- 표준 접근성 향상

테이블,웹폼

skipMenu.html

table.html