W3C (World Wide Consortium)에서 정의하는 기술 표준을 말한다. 사용성과 접근성에 더 높은 초점을 가지고 웹 계발과 다양한 환경에 사용자의 이용을 보장한다.
모든 환경에 사용자에게 같은 서비스 제공하며 이용에 차별이 없도록 보장하는 것. 주로 시각, 마우스를 사용하지 못하는 장애인을 위해 제공 되며, 오디오로 웹에 전반적은 정보를 오디오로 제공한다
<meta charset="utf-8">
- <title> 태그 위에 선언해야 적용이 된다.
- charset (인코딩 설정) 해당문서가 어떤 언어로 인코딩 되었는지 알려준다.
- utf-8은 HTML5 방식으로 표기하는 방법이다.
- 통상 설정을 하지 않아도 작동이 되지만, 미 설정시 언어 글자가 깨져서 나오는 경우가 많다.
<html lang="ko-KR"> </html>
- 웹 접근성을 지침으로 안에 페이지의 기본 언어를 선언한다.
- Screen Reader 프로그램이 언어를 인식하여 자동으로 음성을 변환하거나 해당 언어에 적합한 발음을 제공한다.
- 시각장애인을 위한 보조 속성으로 command + f5를 누르면 실행된다.
- Ko을 사용하는 경우 영어를 기본적으로 제공 하지만, En은 한글 자동 변환을 지원하지 않는다.
-
id 스타일을 지정할 때 한 가지만 지정해서 사용한다. ( # selector) 하나의 문서에 고유한 id 하나밖에 쓸 수 없다.
-
class 룹으로 묶어서 스타일을 지정할 때 사용한다. ( . selector)
= id / class는 숫자로 시작해서는 안된다.
-
자식 selector: [ > ] ~안에의 의미로 > 만 사용이 가능하며 왼쪽이 부모 혹은 더 큰 selector을 넣는다. Ex) div > p (div 안에 P만 선택)
-
후손 tag: [ space ] ~안에 있는 A 모두를 선택 할 때 사용한다. Ex) div p (div 안에 P모두 선택)
-
그룹selector: , 다수에 selector에 공통된 스타일을 주고 싶을 경우 사용한다. Ex) div, p, a (div, p, a 모두)
-
특정 id 값: [ selector.id ] ~안에 A 특정 태그 선택. Ex) p.foo (p태그 안에 id=”foo”을 가진 요소 선택)
3단 구조: header, body(content), footer 4단 구조: header, navigation ,body(content), footer
화면 구성 나누기
그룹화 하기
파스칼 첫 대문자 카멜 첫 소문자 두번째 대문자
a. aside = 부가 정보 b. article = 독립적인 , section = 콘텐츠 블록 Markup