Skip to content
2016.03.08 16:13

HTML5 개요

(*.36.106.242) 조회 수 2743 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

+ - Up Down Comment Print
?

단축키

Prev이전 문서

Next다음 문서

+ - Up Down Comment Print
■ 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
 
 

List of Articles
번호 제목 글쓴이 조회 수 날짜
공지 HTML5 참고 사이트 모음 신큰특스 141676 2010.08.29
공지 소스 코드는 Code Highlighter를 이용해주세요. sincntx 54912 2010.08.29
공지 강좌 / 팁 이용 안내 sincntx 53413 2010.08.29
109 4차 산업혁명 시대 관련 VR, IoT IBITP 182 2017.09.28
108 [무료온라인강의] SK T아카데미 사이트 무료 IT 강의 file IBITP 240 2017.09.19
107 [ 오라클 DBA & 빅데이터 분석 ] 국비지원 취업연계교육 연수생모집 아이티윌GN 666 2017.07.12
» HTML5 개요 ojcedu.com 2743 2016.03.08
105 [C#,링크강좌]SelectMany ojcedu.com 2689 2015.12.11
104 [강좌] Cocos2d-JS #1. Cocos2d-JS 설치하기 신큰특스 7159 2014.08.18
103 [강좌] Cocos2d-JS #0. Cocos2d-JS란? 신큰특스 6227 2014.08.11
102 웹표준 진단도구 신큰특스 8042 2014.04.07
101 HTML5 표준 프레임워크 신큰특스 9041 2014.04.07
100 IE Tester 신큰특스 6874 2014.04.01
99 앱템플릿 예제 활용 사이트 공유합니다. 씨트린 15404 2013.08.23
98 Cocos2d Javascipt 쉽게 사용하기!! 1 마니라네 9026 2013.07.09
97 [강좌] Cocos2D HTML5 앞으로에 대해서 9 신큰특스 15269 2012.12.07
96 [강좌] Cocos2D HTML5 #15. 갤러그 만들기 4 신큰특스 22113 2012.12.04
95 [강좌] Cocos2D HTML5 #14. Etc 신큰특스 15895 2012.12.03
94 [강좌] Cocos2D HTML5 #13. Schedule 신큰특스 12354 2012.11.30
93 [강좌] Cocos2D HTML5 #12. Sounds 2 신큰특스 12393 2012.11.29
92 [강좌] Cocos2D HTML5 #11. Transitions 신큰특스 12641 2012.11.27
91 [강좌] Cocos2D HTML5 #10. Action 신큰특스 13433 2012.11.26
90 [강좌] Cocos2D HTML5 #9. Animation 1 신큰특스 14759 2012.11.23
Board Pagination ‹ Prev 1 2 3 4 5 6 Next ›
/ 6

나눔글꼴 설치 안내


이 PC에는 나눔글꼴이 설치되어 있지 않습니다.

이 사이트를 나눔글꼴로 보기 위해서는
나눔글꼴을 설치해야 합니다.

설치 취소

Designed by sketchbooks.co.kr / sketchbook5 board skin

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

Copyright by sincntx 2014 All rights reserved.

sketchbook5, 스케치북5

sketchbook5, 스케치북5