[HTML5] HTML5 개요 ( 기본 )

출처 : 하루 1시간 3일 만에 배우는 HTML 5

HTML5 관련 추천 사이트들

- 101 Best HTML5 Sites ( http://101besthtml5sites.com )

- HTML5 Rocks ( http://www.html5rocks.com )
 구글에서 제공하는 사이트로 HTML5에 어떤 기능들이 추가되었는지와 함께 브라우저에서 그 기능들을 지원하는지를 표시.

- When can I use... ( http://caniuse.com ) 
 HTML5나 CSS3의 기능들을 언제쯤 사용할 수 있을지를 표시. 

HTML5 기본

HTML5 시작하기

- HTML5는 HTML과 스크립트의 장벽을 허물며 스크립트에 매우 집중적인 성향으로 변모.

- 새로운 요소와 애트리뷰트가 많이 추가되었고, 스크립트 사용만으로도 HTML5 의 새로운 요소와 애트리뷰트에 접근 가능.

Canvas 요소로 그림 그리기

- 선, 원, 둥근 모양, 사각형, 곡선은 물론 그 외의 많은 형태를 그릴 수 있고, 색을 채울 수도, 이미지를 삽입할 수도 있다.

- Canvas 컨트롤은 웹페이지의 동적 그래픽을 지원한다는 강점이 있다.

- Canvas 요소를 사용해서 그림을 그릴 경우에는 자바스크립트를 사용

드래그 앤 드롭

- HTML5는 대부분의 시각적인 요소에 draggable 애트리뷰트를 포함. 이 애트리뷰트를 true 로 설정하고 자바스크립트 내에서 이 요소의 드래그 앤 드롭을 구현했다면, 사용자는 원하는 요소를 드래그 앤 드롭을 구현한 요소에 끌어다 놓을 수 있다.

새로운 웹 폼 컨트롤을 사용해 정보 가져오기

- HTML5에는 여러 개의 새로운 컨트롤들이 존재하며, 이 컨트롤들은 이전 버전의 HTML에서도 사용 가능했던( 체크 박스와 옵션 버튼 등 ) 요소들을 확장시킨 개념이다. 예를 들어 색을 선택할 수 있는 컨트롤, 이메일 주소를 입력받거나 날짜 및 시간, 전화번호를 입력받는 컨트롤 등이 있다.

필요할 때마다 웹 페이지 편집하기

- 웹 페이지와 사용자 간의 상호작용성이 한층 높아졌다. 사용자가 웹 페이지에서 텍스트를 수정할 수 있는 기능도 포함되었다.

브라우저 히스토리에 데이터 저장하기

- 현재 사용자가 보고 있는 페이지가 어디에 위치한지를 알 수 있도록 브라우저의 히스토리 제어가 가능하다.

- 브라우저 히스토리는 단순히 페이지의 흔적만을 뜻하는 것이 아니라 다른 페이지로 돌아갈 떄 다시 이전 데이터를 사용할 수 있도록 페이지 이동 간의 데이터를 저장할 수 있는 기능을 포함한다.

문서 내부에 메세지 보내기

- 하나의 문서가 포함하고 있는 여러 개의 요소에 메세지를 보낼 수 있으며, 이 요소가 비록 다른 문서의 일부라 하더라도 메세지 전달이 가능하다.

놀라운 비디오와 오디오

- 개선된 큰 영역 중 하나는 비디오와 오디오의 지원. <video> 는 영상을 화면에 나타내고, <audio> 는 사운드트랙을 재생시킨다. 플래시나 퀵타임 같은 브라우저 플러그인은 전혀 필요치 않다.

웹 저장소의 사용

- 웹 서버상의 브라우저 세션뿐만 아니라 브라우저 내에도 데이터를 저장할 수 있는 선택사항을 제공.

새로운 요소 사용하기.

- 새로 포함된 녀석들

<article>
<aside>
<audio>
<canvas>
<command>
<datalist>
<details>
<embed>
<figcaption>
<figure>
<footer>
<header>
<hgroup>
<keygen>
<mark>
<meter>
<nav>
<output>
<progress>
<rp>
<rt>
<ruby>
<section>
<srouce>
<summary>
<time>
<video> 

- 제외된 요소들

<acronym>
<applet>
<basefont>
<big>
<center>
<dir>
<font>
<frame>
<drameset>
<isindex>
<noframes>
<s>
<strike>
<tt>
<u> 

도움이 되셨다면 손가락 꾸욱~ ( 로그인 필요 x )