Study/CSS/HTML2012. 2. 12. 21:38
출처 http://blog.daum.net/coloringnina/11

3) 미디어 강화를 위한 요소

HTML4에서는 플래쉬, 실버라이트 등의 추가 설치가 이뤄진 후에야 동영상 재생이 가능하지만, HTML5에서는 웹브라우저 자체적으로 동영상 태그를 통해 재생이 가능하다. Youtube에서 아래의 태그 덕분에 플래쉬를 배제한 서비스 개발이 가능하게 된 것이다. 더불어 아래 <audio>, <video>, <canvas>, <svg>는 스크립트와 결합하거나, 두 태그들을 적절히 함께 활용하여 새로운 시각화를 나타낼 수 있다.

ex) Canvas video http://craftymind.com/factory/html5video/CanvasVideo.html

<audio>, <video> 멀티미디어 콘텐츠 표시 시 사용

<canvas> 그래프, 게임과 같은 동적인 그래픽을 표시할 때 사용

<SVG> Scalable Vector Graphics의 줄임말로 2차원 백터 그래픽만을 표현

<source> 미디어 요소의 출처를 밝힐 때 사용
<embed> 플러그인 콘텐츠 표시 시 사용

 

 


4. HTML5 예시 사이트

HTML5에 대한 자료를 찾다보니 다양한 사이트를 소개해주기도 하고 발견할 수도 있었다.

 

우선 HTML5 예시와 데모를 볼 수 있는 http://html5readiness.com/

HTML5 지원 브라우저 현황을 보려면 http://html5readiness.com/

Canvas를 활용하여 보다 인터랙티브하게 표현한 웹툰 http://disneydigitalbooks.go.com/tron/

HTML5의 요소 및 API들의 상세 예시를 확인해볼 수 있는 http://html5.firejune.com/

HTML5로 제작된 그리고 시각화가 재밌었던 http://www.wired.co.uk

위 포스팅 내용 작성 시 주로 참고했던 "실전 HTML5 가이드" http://durl.me/fdaqm

  
Posted by chacolina