본문 바로가기

HTML5+CSS3

[HTML5 #1] HTML5 소개 및 배경

그동안 수집했던 자료들을 정리하여 블로깅을 할 예정입니다.  총 30 개 정도의 포스트가 예상됩니다.
중단하지않고 끈기있게 할수 있기를..아잣^^


html5란?


“웹을 둘러싼 난무한 비표준을 지양하고 지능적이고 실행가능한 웹 구현을 위해 탄생한 차세대 웹표준 기술이다.”
웹이 더 이상 문서공유나 문서 표현만을 위한것이 아니라 하나의 응용프로그램으로 진화하고 있다.
HTML5는 HTML4.01 XHTML1.0에 대한 차세대 표준안이며,
현재 W3C를 주축으로 애플,모질라,구글,오페라,MS등 웹브라우저 벤더가 참여하고있는 산업표준이다.
 
html5의목적 

기존의 html 표준의 한계(기존의 시멘틱하지 못한 마크업)를 극복하는 차세대 웹표준이며, 리치웹 응용을 가능하게 한다.
=>엑티브엑스,플래시등의 플러그인의 문제점 보완

HTML5 배경










W3C HTML5 명세서


w3c의 명세서는 각 개발하는 포지션에 따른 명세서를 제공하고 있따.

  • 일반문서 : http://www.w3.org/TR/html5/
  • 웹퍼블리셔 : http://dev.w3.org/html5/spec-author-view/
  •  Rich UI 개발자 : http://dev.w3.org/html5/2dcontext/
  • 웹 어플리케이션 및 백엔드 개발자 : http://dev.w3.org/html5/eventsource/
국내에서는 웹표준 커뮤니티인 "클리어보스" 에서 W3C Html5 명세서 한국어 번역판 작업을 진행중에 있다.

  • http://www.clearboth.org/html5/spec.html

브라우저 지원 및 호환성




Html5 주요특징


html5의 큰 특징으로는
  1. "시멘틱한 마크업" - 기존의 html4보다 더 명확한 의미 표현이 가능하도록 26개 정도의 새로운 마크업이 추가되었다.
  2. API -다양한 응용 개발을 지원

    을 들 수 있다.

    그밖에도 수많은 특징들이 있지만 크게 아래와같은 내용을 대표적으로  꼽을 수 있다. 


구조적마크업

기존의 의미없는 DIV태그의 남발로 구조적이고 명확한 문서를 만들 수 없었던 반면에 html5에서는 의미를 갖는 시멘틱한 마크업을 top class 20을 선정하여 추가합니다.






새로생긴 태그
html5에서 새로생긴 태그는 그 의미와 쓰임에 따라서 여러가지 방법으로 구분짓는데 저는 크게 3가지로 분류했습니다.
구조를 나타내는태그, 즉 페이지의 레이아웃을 영역을 담당하는 태그라고 볼 수 있겠습니다.

다음으로 새롭게 생긴 태그들이 다수 있고요,

마지막으로  멀티미디어를 제어하는 태그로 구분을 지었습니다.
  • 구조를 나타내는 태그
    Section
    Nav
    Article
    Aside
    Hgroup
    Header
    Footer
  • 마크업 Element
    Mark
    Time
    Meter
    Progress
    Details
    Datagrid
    Ruby-rt,rp
    Menu,command

  • Media Element
    Audio
    Video
    Canvas
웹폼
html5의 웹폼 요소가 그 기능이 막강해졌는데 type의 속성값과 기능이 다양해졌습니다.
이는 모바일환경에서 그 진가를 발휘하게 됩니다.




 API
웹 응용어플리케이션이 가능하게하는 각종 API들이 생겨나기도 합니다.
물론 기존에 존재하던 API들도 있습니다.



멀티미디어 요소
멀티미디어를 제어할 수 있는 기능들이 생겨났으며, 그래픽을 자유자재로 웹에서 활용할 수 있게 되었습니다.



이상.
마치며 1-2를 기다려주세요^^

'HTML5+CSS3' 카테고리의 다른 글

HTML5 사라진태그 / 변경된 태그  (2) 2013.01.20
[HTML5 #2] HTML5 Markup (마크업) 태그설명  (10) 2012.03.19
2011 여름캠핑을 위한 웹앱  (0) 2011.12.06
[SVG 테스트]도라에몽 그리기  (0) 2011.07.05
HTML5 예제30선  (0) 2011.06.20