HTML5

HTML5의 정의

HTML5는 웹 페이지를 문서에서 실행 가능한 애플리케이션 플랫폼으로 바꾼 웹 표준이다.

마크업, 스크립팅 API, 장치 접근 기능을 함께 규정한 것이 핵심이다.

오늘은 구조, 그래픽과 미디어, 한계 순서로 살펴본다.

구조 표현과 시맨틱 태그

HTML4는 div와 id 조합으로 구조를 표현해 의미를 기계가 알기 어려웠다.

HTML5는 header, section, article 같은 시맨틱 태그로 의미를 명시한다.

브라우저와 검색엔진이 문서 구조를 기계적으로 해석할 수 있게 된다.

그래픽과 미디어

그래픽은 Canvas, SVG, WebGL2 세 방식으로 나뉜다.

Canvas는 점 단위 비트맵이라 개별 요소를 DOM으로 다루기 어렵다.

SVG는 요소마다 DOM으로 관리되어 상호작용하는 그래프를 만들 수 있다.

그래서 상호작용하는 차트에는 SVG가 적합하다.

한계와 직접 풀기

HTML5의 한계는 표준 자체의 미완성과 브라우저 간 차이에서 생긴다.

HTML5 자체는 페이지 내 애니메이션을 제공하지 않는다.

코덱은 OS와 특허에 따라 달라 브라우저마다 지원 차이가 난다.

정답은 페이지 내 애니메이션이다. CSS3나 자바스크립트로 구현한다.

정리

정리하면 HTML5는 시맨틱 태그, 그래픽·미디어, 저장·통신 API의 묶음이다.

답안에서는 비표준 기술을 대응 API로 1:1 대체해 제시한다.

마지막으로 한계와 대체 수단을 함께 쓰면 감점을 줄일 수 있다.