HTML5란

Home Search

HTML5란?

HTML5는 정보를 보여주기만 하던 웹에서 웹 애플리케이션으로 바뀌고 있는 마크업 언어이자 개발 언어입니다.

플러그인이 필요없는 웹

HTML4까지는 말 그대로 마크업 언어일 뿐이어서, 웹 페이지에서 이미지나 텍스트를 표시하는 것이 할 수 있는것의 전부였습니다. 그러다 보니 웹 페이지를 좀 더 보기 좋게 꾸미려면 CSS를 이용해야 했지요. 음악이나 동영상 같은 멀티미디어 콘텐츠를 웹 페이지에 포함시킬 수 없었던 것은 물론이고요. 그래서 등장한 것이 바로 웹 페이지에서 멀티미디어 콘텐츠를 구현해 주는 플러그인(Plug-in)이라는 프로그램 입니다.

웹서핑을 하다 보면 플래시 플레이어를 비롯하여 플러그인 프로그램을 설치하라는 안내 화면을 종종 만나게 될 것입니다. 이런프로그램은 ActiveX형태나 별도의 프로그램으로 따로 설치해야 합니다. 따라서 사용하던 브라우저 환경이 조금만 바뀌어도 다시 설치해야 하고, 플러그인이 설치되지 않은 시스템에서는 웹 페이지가 정확하게 표시되지 않는 문제가 있습니다.

HTML5의 처음 시작은 이런 웹 브라우저 플러그인으로부터 자유로워지자는 것이었습니다. 다시 말해 플러그인 프로그램이 없어도 멀티미디어 콘텐츠를 볼 수 있는 웹 페이지를 구현해 보자는 것이 처음 출발점이었던 것이죠.

HTML5와 플래시

2010년 2월 애플사의 스티브 잡스(Steve Jobs)가 아이폰과 아이패드에서 플래시를 지원하는 문제와 관련하여, 공식석상에서 '플래시는 지저분한 프로그램'이라며 HTML5와 CSS3의 웹 표준이 그 자리를 메울 것이라고 발표했습니다. 이때부터 HTML5와 플래시간의 줄다리기가 시작되었고 많은 사람들이 긴장하며 그 추이를 지켜보고 있습니다.

PC사용자라면 PC에서 플래시를 이용하는 것에 큰 불편이 없을 것입니다. 플래시 플레이어 플러그인을 한번만 설치하면 화려하고 동적인 웹 사이트를 경험할 수 있기 때문에 플러그인 프로그램을 사용하고 있다는 느낌조차 받지 않지요.

하지만 모바일 기기를 통해 플래시를 구동할 경우엔 상황이 전혀 달라집니다. 우선 플래시를 실행할 경우 전력소모가 커져 배터리가 빨리 닳습니다. 또한 3G 네트워크를 통해 인터넷에 접속할 경우 플래시는 텍스트나 일반 이미지보다 용량이 커서 트래픽이 많이 발생하여 요금도 더 많이 부과될 수 있습니다. 요컨대 모바일 인터넷 환경과 플래시는 상극인 셈이죠. 애플의 아이폰과 아이태드가 플래시를 지원하지 않는 것도 이런 맥락에서 이해할 수 있을 것입니다.

애플 아이폰과 아이패드가 플래시를 차단하고 구글과 함께 HTML5 지원에 나서고, 세계 최대 동영상 사이트인 유튜브(www.youtube.com)나 비메오(www.vimeo.com)가 HTML5를 채택한 것은 HTML5의 밝은 미래를 보여주는 사례라 할 수 있습니다.

현재는 온라인 동영상의 75% 이상이 플래시 플레이어로 처리되고 있습니다. 국내만 해도 인터넷 익스플로러의 경우에는 ActiveX 기술을 사용하고, 다른 웹 브라우저의 경우에는 넷스케이프 플러그인 API(NPAPI) 기술을 활용합니다. 플래시로 변환된 동영상을 재생하기 위해 ActiveX 방식의 플레이어와 NPAPI 방식의 플레이어를 따로 배포하고 있는 실정인 것이지요. 반면에 HTML5는 동영상을 재생하는 태그가 정의되어 있어 플래시 플레이어를 따로 설치하지 않아도 동영상이 지원됩니다. 물론 HTML5의 표준 규약이 아직 완성된 상태가 아니어서 기존의 플래시 플레이어를 100% 완벽하게 대체하지는 못하지만 앞으로 발전 가능성은 충분합니다.

좀더 포괄적이면서 유연한 표준이 필요

우리나라의 웹 사이트들은 대부분 인터넷 익스플로러에 최적화되어 있고 특히 ActiveX를 설치하는 사이트들이 많기 때문에 인터넷 익스플로러 사용자들은 인터넷을 사용하는 데 큰 불편함을 느끼지 않을 것입니다. 그러나 파이어폭스나 오페라 같은 웹 브라우저를 사용한다면 인터넷 뱅킹이나 인터넷 쇼핑을 자유롭게 할 수 없습니다. 또한 인터넷 익스플로러 사용자라 할지라도 인터넷 익스플로러 6과 인터넷 익스플로러 8에서 같은 사이트가 다른 모습으로 보이는 경우가 종종 있습니다. 왜 그럴까요?

같은 사이트인데도 브라우저마다 혹은 버전마다 서로 다르게 표시되는 것은 웹표준이 정해져 있지 않기 때문입니다.

HTML5가 웹 표준 기술로 자리잡게 되면 같은 사이트가 브라우저별로 다르게 보이는 일은 더 이상 없을 것입니다. 그리고 PC와 스마트폰, 휴대폰을 통한 인터넷 접속은 물론이고 인터넷 접속이 가능한 모든 전자제품으로 웹 서핑이 가능해집니다. 더 나아가 HTML5는 애플리케이션 프로그램 개발 기능이 강화되었기 때문에 스마트폰과 PC, 모바일 기기를 위한 애플리케이션 개발도 가능해져 모든 모바일 기기를 하나로 연결해 사용할 수 있게 됩니다.

현재도 인터넷 익스플로러9 베타를 비롯하여 파이어폭스나 오페라, 크롬 같은 웹 브라우저들은 HTML5를 일부 또는 많은 부분 지원하고 있습니다.

이미 사용중인 HTML5

HTML5 규약은 2008년에 초안이 발표되었지만 아직도 W3C에서 표준화 작업이 진행중이고, 2012년 HTML5 정식 권고안이 나올 예정입니다. 그렇다면 표준 규약이 완성될 때까지 기다려야 할까요? 그렇지 않습니다. HTML5 표준규약을 만드는 단체에는 즈요 브라우저 제작업체들이 포함되어 있고, HTML5의 필요성을 강하게 느끼고 있는 그 업체들은 아직 표준 규약이 완성되지 않은 상태지만 HTML5의 주요 요소들을 이미 이러 브라우저에서 지원하고 있습니다.
우리나라에서 가장 많이 사용하는 인터넷 익스플로러의 경우엔 IE9 베타판에서 HTML5를 적극 반영하고 있고, 애플은 PC용 웹 브라우저 '사파리(Safari)'에 HTML5를 지원하기 위한 많은 아이디어를 반영했고, PC용 웹 브라우저 시장에서 점유율 2위를 자랑하는 파이어폭스(FireFox)와 오페라 소프트웨어도 HTML5 지원을 시작했습니다. 구글도 '크롬(Chrom)' 에 다양한 HTML5 기능을 반영하기 시작했습니다.

CNN이나 로이터, 뉴욕타임스 등은 이미 HTML5에 기반한 서비스를 하고 있고, 대형 소셜네트워크 서비스인 페이스북 (Facebook)도 HTML5 환경에서 재생이 가능하도록 등록된 동영상 콘텐츠의 전환을 시작했습니다. 또한 국내 주요 포털 사이트에서도 다양한 플랫폼에서의 접근성을 높이기 위해 HTML5나 자바스크립트 기반 웹 기술인 AJAX 등으로 대체해 나가면서 점차 플래시 의존도를 줄이겠다고 발표했습니다.

스마트폰부터 우선 적용

HTML5가 대세이긴 하지만 그 규약이 너무 광범위 하기 때문에 이에 대한 대응이 간단하지는 않습니다. 게다가 HTML5 규약 전체가 아직 완성된 것도 아니어서 현재로서는 HTML5에 완전히 대응 할 수도 없습니다. 결과적으로 HTML5 지원을 강조하는 웹브라우저의 기능이 강화되고 있기는 하지만 아직까지 모든 기능을 100% 만족시킨 것은 없습니다.
점유율 면에서 살펴보면 HTML5는 스마트폰에 먼저 보급된 후에 PC를 포함한 다른 기기로 점차 확산될 것으로 예상됩니다. 스마트폰 시장에서 점유율이 높은 아이폰의 사파리 브라우저와 안드로이드폰의 크롬 브라우저가 HTML5 규약을 충실히 지원 하고 있기 때문입니다.

윈도우 차기 버전과 HTML5

아직 개발 중이긴 하지만 마이크로소프트에서 공개한 윈도우 차기 버전을 살펴보면 HTML5 의 위상을 쉽게 짐작할 수 있습니다. 차기 버전의 윈도우에는 지금까지 우리가 사용하던 PC 기반의 응용 프로그램 뿐만 아니라 HTML5와 CSS3, 자바스크립트로 개발한 애플리케이션이 있습니다. Visual C++ 같은 전문적인 프로그래밍 언어를 공부해야 가능했던 윈도우 애플리케이션 제작이 윈도우8에서는 HTML5나 CSS3, 자바스크립트로도 만들 수 있습니다.
HTML5로 모바일 애플리케이션이나 웹 애플리케이션 뿐만 아니라 운영체제에서 실행되는 애플리케이션까지 만들 수 있습니다.

N-스크린 시대와 HTML5

현대는 N-스크린시대라고 합니다. 스크린의 개수가 무척 많다는 것입니다. TV와 컴퓨터, 태블릿 PC, 스마트폰, 게임 콘솔 등 종류도 많고 각 종류마다 제품도 다양합니다.
N-스크린 시대에는 애플리케이션이 N-스크린 어디에서든 실행되어야 합니다. 회사 컴퓨터에서 작업하던 것을 퇴근하는 길에 스마트폰으로 이어서 처리할 수 있어야 하고 집의 거실에 있는 스마트 TV에서도 그 내용을 볼 수 있어야 합니다. 또한 잠자리에 들기전 태블릿 PC를 켜서 최종 수정을 하는 것도 가능합니다.
그렇다면 N-스크린 시대의 모바일 애플리케이션을 개발하려면 어떻게 해야 할까요?
TV용 애플리케이션과 컴퓨터용 애플리케이션, 스마트폰용 애플리케이션을 따로 만들어야 합니다. 그것도 각 종류마다 여러 가지의 제품이 있으므로 수십 가지의 애플리케이션을 만들어야 합니다. 그만큼 개발자도 많이 필요합니다. 대기업이 아닌 작은 규모의 개발업체라면 어쩔 수 없이 한두 가지 종류의 하드웨어만 지원하는 애플리케이션만 출시해야 할 지 모릅니다.
이 어려운 문제를 해결할 수 있는 것이 HTML5입니다. HTML5는 거의 모든 브라우저에서 지원하는 웹 표준입니다. 따라서 HTML5로 애플리케이션을 만든다면 그 애플리케이션은 모든 브라우저에서 실행되는 애플리케이션이 될 것입니다. HTML5와 CSS3,자바스크립트를 함께 사용해서 만든 애플리케이션을 웹 애플리케이션(Web Application) 또는 줄여서 웹 앱(Web App)이라고 합니다. HTML5로 웹 앱 하나만 만들면 어떤 플랫폼에서든, 어떤 제품에서든 똑같이 동작할 수 있습니다. 웹 앱과 비교해 기존의 애플리케이션을 네이티브 애플리케이션(Native Application) 또는 네이티브 앱(Native App)이라고 합니다.
모든 네이티브 앱을 웹 앱으로 바꿀 수 있는 것도 아니고 그럴 필요도 없습니다. 각 앱의 필요성과 특징에 맞게 네이티브 앱이나 웹 앱을 선택해서 사용하면 되는데, 웹 앱을 사용하게 되면 N-스크린으로 인한 복잡한 문제를 한 번에 해결하고 좀 더 편리한 작업을 할 수 있습니다.