Difference between r1.5 and the current
@@ -1,3 +1,5 @@
[[pagelist(^html5)]]
[[tableofcontents]]
= HTML5 개요 =* 자바스크립트 + CSS + HTML의 통합개념
* 기존의 HTML : 문서를 위한 플랫폼, HTML5 : 웹 어플리케이션을 위한 플랫폼
@@ -17,19 +19,40 @@
* 서버로부터의 데이터 푸시
* 서버와의 쌍방향 통신수행
* 로컬파일 읽기
http://www.webguru.pe.kr/zbxe/files/attach/images/2848/655/824/structure-div.gif
=== HTML5 ===
= 요소 =
== section ==
=== section 제목 ===
=== section root ===
* 하나의 독립된 요소로 인정되는 태그들
* body가 section root임. HTML5의 컨텐츠는 모두 section에 포함된다는 것을 유추 가능
* 밖의 아웃라인에는 영향을 주지 않는다.
* 서버와의 쌍방향 통신수행
* 로컬파일 읽기
* (etc. MathML, SVG등 외부 마크업언어 HTML에 직접 삽입가능)
* http://www.webguru.pe.kr/zbxe/files/attach/images/2848/655/824/structure-html5.gif
* 범용적 섹션
* 하나만 지정 가능
* 여러 제목을 묶어 하나로 만들기 위한 {{{<hgroup>}}} 태그 사용가능
* 섹션에 두개 이상의 제목을 지정하면 암묵적으로 섹션이 생성된다. 그런데 어떤 규칙으로 생성될지 모른다.
* body, fieldset(입력 필드 그룹), td, figure, blockquote
* etc. MathML, SVG등 외부 마크업언어 HTML에 직접 삽입가능 (책 범위 밖)
* 기존 HTML4.- : HTML과 XHTML은 별개의 사양
* HTML5 : HTML과 XHTML은 표현되는 문법의 차이, HTML5는 DOM에 따라 표시됨
* 시맨틱한 마크업
* 기존 HTML문의 애매모호한 문법 개선
* <head> <footer> <section> 추가
* 프로그램이 문서의 구조를 파악하기 쉬워짐(HTML 파싱 수월), 가독성 증가
* selection : 범용적인 셀렉션
* aticle : 섹션의 한종류, 페이지에서 독립되어있는 부분 (ex. 블로그웹의 블로그 본문)
* nav : 사이트 전체 or 내비게이션 메뉴
* aside : 섹션 내용과 관련되어있지만 없어도 상관없는 부분(ex. 문서 내용 요약)
* header : 섹션 헤더
* footer : 섹션의 푸터
* address : 섹션에 관한 문의처 정보(ex. 회사 전화번호등)
* time : 날짜, 시작을 나타냄
* 마이크로 데이터 : 문서에 삽입된 데이터의 속성 데이터(데이터의 데이터, 데이터의 의미가 명확해짐)
* 더 높은 접근성
* 휴먼 인터페이스에 가까워질수있음
* 더 높은 호환성
* 버전간 호환성
* 전방호환성 - HTML5을 적용하기 이전의 브라우저에서도 HTML5사용가능(웹브라우저의 fall back 적용)
* fall back : 모르는 부분은 무시하는 웹 브라우저의 특성
* 후방호환성 - HTML5을 적용한 브라우저에서 HTML5 이전 버전 문서 표시가능
* 브라우저간 호환성
* 표준만 따른다면 어떤 브라우저에서도 똑같이 작동한다
* 이미 사용되고 있는 내용에서 사양을 추출한다
= 역사 =
* HTML의 목적 : 1998년 W3C는 html이 아닌 XHTML의 표준 사용을 권고한다. 그러나 XHTML은 HTML과의 비호환성으로 널리 퍼지지 못한다.
* 결과적으로 10년이상 사용되는 HTML의 저사양이 오히려 웹 어플리케이션의 발전을 저해했다. 그러나 W3C는 XHTML을 위해 새로운 HTML의 개발을 거절한다.
* 그러자 apple, mozillar, opera 세 기업이 모여 WHATWG를 발족하고 HTML의 진화를 지향한다.(apple은 플래시를 제공하는 어도비와 관계가 좋지않아 HTML5를 적극적으로 추진한다는 소문이다)
* 현재 HTML5는 W3C에 LAST CALL(최종 심사 초안)이 제출된 상태이다. 또한 W3C가 진행하던 XHTML2의 사양 제정이 중지로 HTML5의 표준화는 기정 사실로 보인다.
- html5
- html5/VA
- html5/canvas
- html5/drag-and-drop
- html5/form
- html5/geolocation
- html5/offline-web-application
- html5/others-api
- html5/outline
- html5/overview
- html5/richtext-edit
- html5/video&audio
- html5/web-storage
- html5/web-workers
- html5/webSqlDatabase
- html5/websocket
- html5/문제점
- html5practice/roundRect
- html5practice/즐겨찾기목록만들기
1.2. 달라진점 ¶
* 풍부한 웹 어플리케이션 기능 : 웹 어플리케이션의 표현력 증가
- 동영상/음성
- 2D 그래픽 처리
- 오프라인에서 구동가능
- 도메인간의 통신기능
- 클라이언트축 데이터 저장
- 백그라운드 처리 수행
- 서버로부터의 데이터 푸시
- 서버와의 쌍방향 통신수행
- 로컬파일 읽기
- etc. MathML, SVG등 외부 마크업언어 HTML에 직접 삽입가능 (책 범위 밖)
- 기존 HTML4.- : HTML과 XHTML은 별개의 사양
- HTML5 : HTML과 XHTML은 표현되는 문법의 차이, HTML5는 DOM에 따라 표시됨
- 기존 HTML문의 애매모호한 문법 개선
- <head> <footer> <section> 추가
- <head> <footer> <section> 추가
- 프로그램이 문서의 구조를 파악하기 쉬워짐(HTML 파싱 수월), 가독성 증가
- selection : 범용적인 셀렉션
- aticle : 섹션의 한종류, 페이지에서 독립되어있는 부분 (ex. 블로그웹의 블로그 본문)
- nav : 사이트 전체 or 내비게이션 메뉴
- aside : 섹션 내용과 관련되어있지만 없어도 상관없는 부분(ex. 문서 내용 요약)
- header : 섹션 헤더
- footer : 섹션의 푸터
- address : 섹션에 관한 문의처 정보(ex. 회사 전화번호등)
- time : 날짜, 시작을 나타냄
- 마이크로 데이터 : 문서에 삽입된 데이터의 속성 데이터(데이터의 데이터, 데이터의 의미가 명확해짐)
- selection : 범용적인 셀렉션
- 휴먼 인터페이스에 가까워질수있음
2. 역사 ¶
* HTML의 목적 : 1998년 W3C는 html이 아닌 XHTML의 표준 사용을 권고한다. 그러나 XHTML은 HTML과의 비호환성으로 널리 퍼지지 못한다.
* 결과적으로 10년이상 사용되는 HTML의 저사양이 오히려 웹 어플리케이션의 발전을 저해했다. 그러나 W3C는 XHTML을 위해 새로운 HTML의 개발을 거절한다.
* 그러자 apple, mozillar, opera 세 기업이 모여 WHATWG를 발족하고 HTML의 진화를 지향한다.(apple은 플래시를 제공하는 어도비와 관계가 좋지않아 HTML5를 적극적으로 추진한다는 소문이다)
* 현재 HTML5는 W3C에 LAST CALL(최종 심사 초안)이 제출된 상태이다. 또한 W3C가 진행하던 XHTML2의 사양 제정이 중지로 HTML5의 표준화는 기정 사실로 보인다.
* 결과적으로 10년이상 사용되는 HTML의 저사양이 오히려 웹 어플리케이션의 발전을 저해했다. 그러나 W3C는 XHTML을 위해 새로운 HTML의 개발을 거절한다.
* 그러자 apple, mozillar, opera 세 기업이 모여 WHATWG를 발족하고 HTML의 진화를 지향한다.(apple은 플래시를 제공하는 어도비와 관계가 좋지않아 HTML5를 적극적으로 추진한다는 소문이다)
* 현재 HTML5는 W3C에 LAST CALL(최종 심사 초안)이 제출된 상태이다. 또한 W3C가 진행하던 XHTML2의 사양 제정이 중지로 HTML5의 표준화는 기정 사실로 보인다.