HTML5

W3C(World Wide Web Consortium)을 중심으로 기존의 HTML 표준의 한계를 극복하기 위해 추가적인 플러그인 없이 리치 웹 응용을 가능하게 하는 차세대 HTML 표준

 

HTML5는 문서 작성 중심으로 구성된 기존 표준에 그림, 동영상, 음악 등을 실행하는 기능까지 포함하고 있습니다. 

 

HTML5 게임이 주목을 받은 이유는 크게 두 가지다. PC와 모바일 기기의 게임 계정을 호환할 수 있고, 기존 구글 애플 마켓을 통하지 않고 서비스할 수 있어 수익성에도 긍정적

 

 

* HTML 5의 특징 [시아리플]

시맨틱 마크업:  기존 HTML4보다 훨씬 더 명확하게 의미 표현이 가능하도록

26개 정도의 새로운 마크업 추가

API : 웹 기반의 응용 개발을 지원하기 위해 HTML4에 존재하지 않았던 새로운 기능 추가

리치 웹 응용의 지원 : 멀티미디어 기능과 오프라인 실행, 측위(Geo Location) 기능을 포함하고 있어 다양한 웹 애플리케이션 개발 가능

플랫폼 독립적:  아이폰 운영체제(iOS)나 안드로이드 OS 등 플랫폼에 구애를 받지 않기 때문에 개발자, 이용자 측면에서 매우 효율적임

 

 

 

 

 

 

SVG와 Canvas의 차이점 

SVG는 XML의 2D 그래픽을 기술하는 언어!입니다. 

Canvas는 자바 스크립트로 2D 그래픽을 그려냅니다. 

 

SVG는 XML을 기반으로 하여, 모든 요소가 SVG DOM 내에서 사용할 수 있음을 의미합니다. 또한 요소에 자바스크립트 이벤트 핸들러를 첨부 할 수도 있습니다. 

 

SVG에서, 각각 그려진 모양은 하나의 개체(오브젝트)로 기억됩니다. SVG 객체의 특성이 변경되는 경우, 브라우저가 자동으로 형상을 다시 렌더링 할 수 있습니다. 

 

Canvas는 픽셀에서 픽셀로 렌더링됩니다.

일단 캔버스의 그래픽이 브라우저로 전달되어 그려진 후에 그 정보들은 지워집니다.

따라서 그것의 위치를 변경해야하는 경우, 전체 장면은 그래픽이 적용되었을 수있는 모든 개체를 포함하여, 다시 그려야만 합니다. (코드를 수정하여 다시 브라우저로 전달하면 좀전의 그 그래픽 이미지는 삭제되고 새로운 그래픽이 표현 되는 방식 입니다.)

 

 

Canvas와 SVG의 비교 

 

Canvas

해상도에 의존 이벤트 핸들러에 대한 지원 없음  텍스트 렌더링 기능 미약  . PNG 또는 . JPG로 생성 된 이미지를 저장할 수 있음. 그래픽 집약적인 게임에 적합

 

 

SVG

해상도 독립적 이벤트 핸들러에 대한 지원 가장 큰 렌더링 분야와 응용 프로그램에 적합 (구글지도 등)  DOM이 복잡하면 렌더링도 복잡해져서 아무래도 느려짐. 게임앱(응용프로그램)에는 적합하지 않습니다.