U E D R , A S I H C RSS

html5/overview

Difference between r1.2 and the current

@@ -1,27 +1,58 @@
[[pagelist(^html5)]]
[[tableofcontents]]
= HTML5 개요 =
* 자바스크립트 + CSS + HTML의 통합개념
* section, article
* outline
* 섹션의 중첩관계
== 참고 사항 ==
* 섹션 요소를 사용할 때는 항상 아웃라인을 염두해 둘 것
* 아웃라인과 상관 없는 범위를 지정하 ㄹ때는 div를 사용할 것
* article 요소를 사용할 것인가 말 것인가는 콘텐츠를 해당 페이지에서 분리해서 사용 가능한가에 따라 결정
* aside는 없어도 문제 없을 섹션에 사용
== HTML5와 이전 문서의 차이 ==
=== before HTML5 ===
* http://www.webguru.pe.kr/zbxe/files/attach/images/2848/655/824/structure-div.gif
=== HTML5 ===
* http://www.webguru.pe.kr/zbxe/files/attach/images/2848/655/824/structure-html5.gif
= 요소 =
== section ==
* 범용적 섹션
=== section 제목 ===
* 하나만 지정 가능
* 여러 제목을 묶어 하나로 만들기 위한 {{{<hgroup>}}} 태그 사용가능
* 섹션에 두개 이상의 제목을 지정하면 암묵적으로 섹션이 생성된다. 그런데 어떤 규칙으로 생성될지 모른다.
=== section root ===
* 하나의 독립된 요소로 인정되는 태그들
* body, fieldset(입력 필드 그룹), td, figure, blockquote
* body가 section root임. HTML5의 컨텐츠는 모두 section에 포함된다는 것을 유추 가능
* 밖의 아웃라인에는 영향을 주지 않는다.
* 기존의 HTML : 문서를 위한 플랫폼, HTML5 : 웹 어플리케이션을 위한 플랫폼
 
== HTML5 범위 ==
* HTML + XHTML + 요소 + 요건 + 관련 API
* HTML+CSS+JavaScript
== 달라진점 == 
* 풍부한 웹 어플리케이션 기능 : 웹 어플리케이션의 표현력 증가
* 동영상/음성
* 2D 그래픽 처리
* 오프라인에서 구동가능
* 도메인간의 통신기능
* 클라이언트축 데이터 저장
* 백그라운드 처리 수행
* 서버로부터의 데이터 푸시
* 서버와의 쌍방향 통신수행
* 로컬파일 읽기
* 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의 표준화는 기정 사실로 보인다.



1. HTML5 개요

  • 자바스크립트 + CSS + HTML의 통합개념
  • 기존의 HTML : 문서를 위한 플랫폼, HTML5 : 웹 어플리케이션을 위한 플랫폼

1.1. HTML5 범위

* HTML + XHTML + 요소 + 요건 + 관련 API
* HTML+CSS+JavaScript

1.2. 달라진점

* 풍부한 웹 어플리케이션 기능 : 웹 어플리케이션의 표현력 증가
  • 동영상/음성
  • 2D 그래픽 처리
  • 오프라인에서 구동가능
  • 도메인간의 통신기능
  • 클라이언트축 데이터 저장
  • 백그라운드 처리 수행
  • 서버로부터의 데이터 푸시
  • 서버와의 쌍방향 통신수행
  • 로컬파일 읽기
  • 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 이전 버전 문서 표시가능
  • 브라우저간 호환성
    • 표준만 따른다면 어떤 브라우저에서도 똑같이 작동한다
    • 이미 사용되고 있는 내용에서 사양을 추출한다

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의 표준화는 기정 사실로 보인다.
Valid XHTML 1.0! Valid CSS! powered by MoniWiki
last modified 2021-02-07 05:31:41
Processing time 0.0303 sec