HTML5 개요

이종철 0 676 2012.06.26 10:36
■ HTML5란 무언인가?
HTML5는 웹 문서를 만들기 위한 기본 프로그래밍 언어 ‘HTML(Hyper Text Markup Language)’의 최신규격이다. HTML5는 엑티브X(Active X)를 설치하지 않아도 동일한 기능을 구현할 수 있고, 특히 플래시(flash)나 실버라이트(Silverlight), 자바FX(JAVA FX) 없이도 웹 브라우저(web browser)에서 화려한 그래픽 효과를 낼 수 있다. 현재 W3C를 주축으로 애플,모질라,구글,오페라,MS등 웹브라우저 벤더가 참여하고있는 산업표준이다.
 
 
■ HTML5 목적
기존의 html 표준의 한계(기존의 시멘틱하지 못한 마크업)를 극복하는 차세대 웹표준이며, 리치웹 응용을 가능하게 한다.
=>엑티브엑스,플래시등의 플러그인의 문제점 보완

 
■ HTML5 일정 및 역사
2007년   5월   HTML5와 Web Forums 2.0 스펙 채택 - 리뷰 기반으로
2007년  11월   HTML5 디자인 원칙 작업 초안
2010년   1월   HTML5 Last Call 작업 초안
2010년  12월   HTML5 후보 권고안(Recommendation)
2012년   1월   HTML5 제안 권고안
2012년   3월   HTML5 정식 권고안
 
 
■ HTML5의 특징
1. 시맨틱 태그(시멘틱한 마크업)의 등장 
HTML 영역을 보다 한눈에 알기 쉽게하고, 필요한 부분만 정확하게 검색하기 위해 등장
기존의 html4보다 더 명확한 의미 표현이 가능하도록 26개 정도의 새로운 마크업이 추가
 header  사이트에 대한 소개 정보나 메인 메뉴, 사이트 로고 등을 포함
 nav
 사이트의 메뉴나 링크 같은 네비게이션 요소들을 포함
 section
 실제 문서 내용이 들어감, 또 다른 section 태그를 포함 가능
 article
 문서 내용이 많을 경우 여러개의 요소로 나눌 수 있다
 aside
 문서의 주요 내용 외의 내용들을 넣어 문서의 주영역 주변에 배치
 footer
 작성자 정보, 저작권, 관련문서 링크 둥 부가 정보를 담고 , 문서 하단에 배치
 hgroup
 제목과 그와 관련된 부제목을 묶어주는 태그
 
2. 새로운 폼 컨트롤
달력(calendar), 날짜(date), 시간(time), 이메일(email), URL, 검색(search)과 같이 새로운 폼 컨트롤이 추가

3. HTML에서 직접 개체를 그릴 수 있는 Canvas 요소 지원
플래시(flash)나 실버라이트(Silverlight), 자바FX(JAVA FX) 기술을 대체할 수 있는 영역으로
직접 그림을 그리거나 다양한 효과 및 애플리케이션을 만들수 있다.
아직 기능적으로 많이 부족하지만 발전 가능성이 무한해 보임

4. 플러그인이 필요없는 동영상, 음악 지원
한줄의 코드로 동영상 재생 : <video src = "video.mp4" width="320" height="240" autoplay>

하지만 브라우져에서 지원하는 코덱이 다르기 때문에 아래와 같이 코덱에 따라 달라지는 동영상 파일을 설정해줘야 합니다.
<video width="320" height="240" autoplay controls poster="image.jpg">
  <!- mp4 : 사파리, IE9, 아이폰, 아이패드, 안드로이드, 윈도우7 폰버젼 -->
  <source src="video.mp4" type="video/mp4">
  <!- WebM : 파이어폭스4, 오페라, 크롬 -->
  <source src="video.webm" type="video/webm">
  <!- ogv : 파이어폭스4 이전버젼 -->
  <source src="video.ogv" type="video/ogv">
</video>
 
5. 다양한 API 지원
 드래그 & 드랍  웹 콘텐츠들을 드래그 할 수 있는 기능 (모든 브라우져에서 지원하지 않음)
 애플리케이션 캐시
 오프라인 상태에서도 애플리케이션을 실행할 수 있도록 지원하는 기능
 웹스토리지
 쿠키처럼 클라이언트 쪽에 데이터를 저장할 수 있는 기능
 Indexed 데이터베이스
 클라이언트에 저장하는 데이터 베이스 기능
 웹 워커
 시간이 오래 걸리는 작업을 백그라운드로 실행하는 기능
 지오로케이션
 PC나 모바일 장치에서 현재 위치를 파악할 수 있게 해주는 기능

 
 
■ HTML5의 문제점
1. HTML5를 지원하지 않는 브라우져의 존재 
  - IE6/7/8에서 미지원, IE9에서도 완벽하게 지원하지 않음
  - 2012년 1월 윈도우 XP 점유율은 47%로 앞으로 상당 기간 HTML5가 나아가는데 큰 걸림돌이 될 것으로 보임
    (윈도우 XP는 IE8 버젼까지만 설치가 가능하기 때문에 HTML5를 보기 위해서는 다른 브라우져 설치가 필요함)

2. 저작권 보호 문제 (개발소스, 동영상, 음악)

3. ActiveX의 보안성을 대체할 요소가 없음
  - 은행권, 공공기관에서 사용하는 ActiveX의 보안성을 대체할 요소가 없기 때문에 ActiveX의 사용은 당분간 계속될 것으로 보임
 
■ 브라우저 지원 현황
브라우저 Ver HTML5 검사 점수[2]
2012년 1월 6일 Ver HTML5 검사 점수
2012년 5월 23일[3]구글 크롬 16.0 373/475 18 400모질라 파이어폭스 10.0 332/475 12 345오페라 11.60 329/475 11.60 338오페라 12 알파 344/475 12.00 385애플 사파리 5.1 302/475 5.1 317인터넷 익스플로러 9 141/475 9 138인터넷 익스플로러 10 306/475 10 316맥스톤 - - 3.3.7 437
 
 
 

Comments