HTML5 이슈분석리포트 No. 9online.slidehtml5.com/dweu/byyw/byyw.pdf · 앱을 네이티브앱처럼 사용할 수 있게 해 주는 기술 q 서비스 워커의 장점 및 전망

HTML5 이슈분석리포트 No. 9

2014 HTML5 주요 이슈 Wrap-up s

목 차

Ⅰ. 2014 HTML5 주요 이슈 선정 및 선정 방법론

q 2014 HTML5 10대 이슈 선정

q 이슈 선정 방법론

Ⅱ. 2014 HTML5 10대 이슈별 Wrap-up

■ 표준 관련 이슈

1. W3C의 HTML5 최종 표준안 확정

■ 기술 관련 이슈

2. 서비스 워커(Service Worker)

3. 웹 컴포넌트(Web Component)

4. 웹RTC(WebRTC)

5. 웹GL(WebGL)

■ 시장 관련 이슈

6. 하이브리드앱의 증가세 지속

7. HTML5의 동영상 플러그인 대체 가속화

8. HTML5 기반 출판물 제작 솔루션 출시 러시

9. 기업용 솔루션의 HTML5 채택 확대

10. 다양한 HTML5 제작 지원 솔루션 출시

* 작성: Aggall Data & Research

2

◁ 요약 ▷

Ⅰ. 2014 HTML5 주요 이슈 선정 및 선정 방법론


ㅇ 표준 관련 이슈, 기술 관련 이슈, 시장 관련 이슈의 3개 카테코리별로 총

10개 선정

ㅇ 표준 관련 이슈로는 W3C의 HTML5 최종 표준안 확정 이슈 1개, 기술 관

련 이슈로는 서비스 워커, 웹 컴포넌트, 웹RTC, 웹GL 등 4개, 시장 관련

이슈로는 하이브리드앱의 증가세 지속, HTML5의 동영상 플러그인 대체

가속화, HTML5 기반 출판물 제작 솔루션 출시 러시, 기업용 솔루션의

HTML5 채택 확대, 다양한 HTML5 제작 지원 솔루션 출시 등 5개 선정


ㅇ 전문가 인터뷰(IDI), 그룹 인터뷰(FGI), 온라인 설문조사, 데스크 서치를 통

한 시장조사 자료 등을 참조하여 선정

Ⅱ. 2014 HTML5 10대 이슈별 Wrap-up



q HTML5 표준 확정의 의의

ㅇ 표준 확정으로 인해 사실상 웹이 OS와 같은 플랫폼의 역할을 수행할 수

있게 됨으로써, ‘웹의 플랫폼化’를 가능케 하는 기반 확립

q HTML5 표준 확정에 따른 전망

ㅇ HTML5의 위상이 제고되고, 다양한 IT 산업 및 기기에서 HTML5 활용이

증가하며, 모바일 중심의 반응형 웹 구축이 확산될 것으로 예상

2014 HTML5 주요 이슈 Wrap-up

3

q 후속 표준인 HTML5.1 표준에 대한 전망

ㅇ W3C는 후속 표준안인 HTML5.1을 2016년 4/4분기까지 확정할 계획이나,

기존처럼 한꺼번에 정기적으로 완성하는 표준화 과정에 대해 이견 제기



q 서비스 워커의 기능

ㅇ 오프라인 상태에서도 브라우저를 통해 웹앱이 작동 가능토록 함으로써, 웹

앱을 네이티브앱처럼 사용할 수 있게 해 주는 기술

q 서비스 워커의 장점 및 전망

ㅇ 오프라인에서 사용 가능, 빠른 데이터 로딩 속도, 푸시 API 사용 가능 등

의 장점으로 인해 표준 확정과는 상관없이 다수 브라우저에 채택될 전망


q 웹 컴포넌트의 기능

ㅇ HTML 문서 내에 특정 기능을 수행하는 컴포넌트를 태그 형태로 삽입할

수 있는 기술로, HTML5 표준에 기반

q 웹 컴포넌트의 장점 및 전망

ㅇ 재사용이 가능하고, 웹 컴포넌트만 따로 수정이 가능하며, 다른 HTML 요

소에 영향을 주지 않으면서 독립적으로 동작 가능하기 때문에 빠른 웹 개

발 및 수정·보완이 가능

4. 웹RTC(WebRTC)

q 웹RTC의 기능

ㅇ 별도의 플러그인 없이 브라우저 내에서 오디오 및 비디오 커뮤니케이션을

가능케 하는 오픈소스 API로, HTML5에 포함된 기술

4

q 웹RTC의 장점 및 전망

ㅇ 서버를 거치지 않는 P2P 방식이기 때문에 빠른 데이터 송수신이 가능하며,

플러그인 설치 없이 브라우저 상에서 쉽게 음성 및 화상통화 가능

5. 웹GL(WebGL)

q 웹GL의 기능

ㅇ 플러그인 없이 웹 브라우저에서 2D 및 인터랙티브 3D 그래픽을 사용할

수 있게 하는 API 기술

q 웹GL의 장점 및 전망

ㅇ 브라우저가 사용자 디바이스의 GPU를 직접 제어함으로써, 웹 화면 렌더링

의 고속 처리가 가능하기 때문에 향후 고성능 웹 그래픽 기술 주도 예상



q 아직은 네이티브앱이 시장 주도

ㅇ 성능상 이유와 수익성 측면에서 아직은 네이티브앱이 시장 주도

q 순수 네이티브앱은 절반 약간 넘는 수준

ㅇ 네이티브앱의 UI 상당수가 HTML과 같은 웹 기술에 의해 지원

q 하이브리드앱과 웹앱 지속 증가 전망

ㅇ HTML5의 성능이 개선되면, 앱마켓 업로드가 필요 없고 즉각적인 업데이

트가 가능한 웹앱에 대한 선호도 증가할 전망


q 주요 동영상 관련 업체, 플러그인에서 HTML5로 전환

ㅇ 넷플릭스, 애플, 구글, 페이스북 등이 자사의 동영상 관련 서비스에 HTML5

를 지속 도입 중이거나 도입 완료


5

q 플러그인 사라지고, HTML5 대세 될 전망

ㅇ 이미 80% 이상의 브라우저들이 HTML5를 지원하고 있어, 플래시를 포함한

플러그인은 점차 사라지게 될 것으로 예상


q 출판물 중에서도 카탈로그 등 홍보물 제작 솔루션 증가

ㅇ FlipHTML5, PubHTML5, Kvisoft 등이 HTML5 기반의 카탈로그 제작 솔루

션 출시

q HTML5 기반 제작 솔루션, 출판물 전반으로 확대 전망

ㅇ ePub3.0 등에 힘입어 HTML5로 제작되는 출판물 증가 전망


q 기존 솔루션에 HTML5 기술을 적용해 모바일 기능 강화

ㅇ Workface, Rocket Software, Ericom 등 기업용 솔루션 제공 업체들이

HTML5 기술을 적용한 솔루션을 출시

q 모바일 환경의 확산으로 HTML5 도입 증가할 전망

ㅇ HTML5 도입이 대부분 기존 솔루션의 모바일용 확대 과정에서 발생하고

있으므로, 향후 다양한 산업 분야에서 HTML5 도입이 증가할 전망


q HTML5 앱의 손쉬운 개발 가능한 솔루션 잇따라 등장

ㅇ 모질라, 앱가이버, 컴포넌트원, 모나카 등의 업체들이 HTML5 앱을 손쉽게

제작할 수 있는 다양한 지원 솔루션 출시

q HTML5 전반에 걸쳐 다양한 지원 솔루션 증가 전망

ㅇ HTML5 앱의 제작뿐만 아니라 수정 및 유지보수, 업그레이드도 지원하는

등 다양한 지원 솔루션들이 증가할 것으로 전망

6

Ⅰ 2014 HTML5 주요 이슈 선정 및 선정 방법론 2014 HTML5 주요 이슈 선정 및 선정 방법론


m 2014년 주목할 만한 HTML5 관련 이슈 10개를 각 주제의 성격

에 따라 ▲표준 관련 이슈, ▲기술 관련 이슈, ▲시장 관련 이슈

의 3개 카테고리로 구분

- 표준 관련 이슈로는 HTML5 표준화 과정에서 가장 중요한

W3C의 최종 표준안 확정을 선정하고, 표준 확정의 의의 및 향

후 전망을 정리

- 기술 관련 이슈로는 HTML5 기술 중 2014년 및 이후에도 주목

할 만한 1) 서비스 워커, 2) 웹 컴포넌트, 3) 웹RTC, 4) 웹GL의

4개 기술을 선정

- 시장 관련 이슈로는 HTML5 관련 업체들의 2014년 사업 동향

을 토대로 1) 하이브리드앱의 증가세 지속, 2) HTML5의 동영

상 플러그인 대체 가속화, 3) HTML5 기반 출판물 제작 솔루션

출시 러시, 4) 기업용 솔루션의 HTML5 채택 확대, 5) 다양한

HTML5 제작 지원 솔루션 출시의 5개 주제를 선정


m 이슈는 전문가 인터뷰(IDI), 그룹 인터뷰(FGI), 온라인 설문조사,

데스크 서치를 통한 시장조사 자료 등을 참조하여 선정

- 기술 관련 이슈는 주로 IDI와 FGI 과정에서 전문가의 의견을

반영하여 선정

- 시장 관련 이슈는 주로 데스크 서치를 통해 수집한 시장조사

자료에서 주목할 만한 동향을 중심으로 선정


7

Ⅱ 2014 HTML5 10대 이슈별 Wrap-up 2014 HTML5 10대 이슈별 Wrap-up



q HTML5 표준 확정의 의의

m W3C(World Wide Web Consortium)는 약 8년간의 작업 끝에

2014년 10월 28일 HTML5의 표준 권고안을 확정·발표함으로써,

‘웹의 플랫폼化’를 가능케 하는 기반을 확립

- HTML5 표준 확정으로 인해 웹이 사실상 OS와 같은 플랫폼의

역할을 수행할 수 있게 됨으로써, 웹의 기능과 성능을 혁신하

고 확장할 수 있는 또 한번의 전기가 마련된 것으로 평가

- 또한 HTML5 표준안은 ‘오픈 웹 플랫폼(Open Web

Platform)’의 초석으로, 특정 플랫폼에 종속되지 않는 크로스

플랫폼형 애플리케이션을 구축할 수 있는 토대를 마련했다는

점에서 의의가 있음

q HTML5 표준 확정에 따른 전망

m W3C의 HTML5 표준 확정으로 인해 ▲HTML5의 위상이 제고되

고, ▲다양한 IT 산업 및 기기에서 HTML5 활용이 증가하며, ▲

모바일 중심의 반응형 웹 구축이 확산될 것으로 예상

- 개발자들, 특히 멀티플랫폼 애플리케이션을 제공하고자 하는

업체들 사이에서 HTML5가 필수 기술로 자리잡으면서 HTML5

의 위상이 제고될 것으로 전망

8

- 인텔(Intel), 삼성전자, 아이비엠(IBM), 모질라(Mozilla), 마이크로

소프트(Microsoft) 등 글로벌 IT 기업들이 표준안에 대한 적극

적인 지지를 표명함에 따라, HTML5가 다양한 IT 산업 및 기기

에 활용되는 추세가 가속화할 것으로 전망

- 최근 웹 구축의 트렌드가 ‘모바일 중심’ 및 ‘반응형 웹’이

라는 점을 감안하면, HTML5는 이러한 트렌드를 충족시킬 수

있는 대안이 될 것으로 예상

※ 시장조사업체인 가트너(Gartner)는 HTML5를 2015~2016년 모바일 기술

Top10 중 하나로 선정하면서, “HTML5가 멀티 플랫폼 앱 개발에 필수 기술

로 자리잡을 것이며 2016년에는 모바일 앱의 50% 이상이 HTML5 기반 기술

을 이용하게 될 것”으로 전망(2014.2)

m 그러나 W3C의 HTML5 표준 확정이 단지 선언적인 의미일 뿐,

개발자나 사용자에게 당장 커다란 변화를 가져오지는 않을 것이

라는 전망도 제기

- 웹 브라우저들이 이미 대부분 ‘video’나 ‘벡터그래픽’ 등

의 요소를 지원하고 있고, 표준안 확정 이전 약 5년 전부터 개

발자들이 HTML5를 사용해 왔기 때문에 표준안 확정이 실제

현장에서는 별다른 영향을 미치지 않을 것임

※ 구글(Google), 애플(Apple), 모질라, 오페라(Opera), 마이크로소프트 등 주요

브라우저 업체들은 이미 표준화 이전부터 HTML5 기능을 브라우저에 탑재

- 업계에서는 HTML5 표준 확정보다는 구글이나 애플과 같은 브

라우저 벤더들이 HTML5 확산에 보다 실제적이면서 가장 중요

한 영향력을 행사할 것으로 예상

※ 크롬(Chrome)으로 시장을 장악하고 있는 구글의 영향력이 가장 크게 작용할

것으로 예상되며, 브라우저에 자동 업데이트 기능이 도입된 것이 HTML5 확

산에 긍정적인 역할을 하게 될 것으로 전망됨

- 또한 개발 현장에서도 표준 확정보다는 예산이나 자원조달 등

이 HTML5 확산에 더욱 중요한 요소가 될 것으로 전망


9

q 후속 표준인 HTML5.1 표준에 대한 전망

m W3C는 HTML5의 후속 표준안인 HTML5.1을 오는 2016년 4/4분

기까지 확정할 계획이나, HTML5 표준화 과정처럼 방대한 규격

을 한꺼번에 정기적으로 완성하는 방식에 대해서는 이견이 제기

- W3C는 HTML5 표준화 일정(2014년 4/4분기)에 맞추느라 마무

리되지 못했던 내용들을 HTML5.1에서 보완할 계획

- 그러나 HTML5 표준안 발표 이후, 불과 2년 사이에 다시 방대

한 규격을 동시에 업그레이드하기에는 기존 W3C의 복잡한 표

준화 과정이 적합하지 않다는 의견들이 제기됨

- 기존 표준화 방식은 물리적으로 많은 시간이 소요되고 절차도

복잡하기 때문에 급변하는 IT 업계의 흐름과 맞지 않으며, 따

라서 각 주제별/기술별로 구분해서 검증이 끝난 표준은 빨리

확정하고, 그렇지 않은 표준은 나중에 확정하는 방식을 도입해

야 한다는 주장임

※ W3C의 Jeffery Jaffe CEO는 “HTML5.1 표준화 작업이 이미 시작되었지만 향

후 HTML 언어 자체에 혁명적인 변화는 없을 것”이라고 밝혀, 이후의 표준화

작업은 민첩하고 유연하게 이뤄질 것임을 시사

- 다만, 개별적인 표준 확정은 각 주제별/기술별 표준들이 상충될

위험성을 내포하고 있으므로, 신중해야 한다는 우려도 제기



q 서비스 워커의 기능

m 서비스 워커는 오프라인 상태에서도 브라우저를 통해 웹앱이 작

동 가능하도록 함으로써, 웹앱을 네이티브앱처럼 사용할 수 있

10

게 해 주는 기술

- 서비스 워크는 웹 리소스 중 캐싱(Caching)할 대상을 지정해서

이를 사용자 디바이스에 저장하여, 사용자가 웹앱을 실행할 때

디바이스에 저장된 데이터를 먼저 가져오고 나머지를 온라인

에서 가져오는 원리

- 즉, 사용자가 특정 웹 사이트를 요청하면 처음에는 모든 웹 페

이지를 로딩하지만, 다음부터는 디바이스에 캐싱된 웹 페이지

를 먼저 불러온 후, 나머지 추가로 필요한 데이터만 네트워크

에서 로딩하는 방식

m 서비스 워커는 HTML5 최종표준안에는 포함되지 않았으나, 2014

년 5월 8일 W3C에 초안인 Working Draft가 게재되었으며, 11월

8일 후속 버전이 업데이트되면서 표준화 작업이 계속 진행 중임

< W3C의 ‘서비스 워커’ 표준화 현황 >

※ 자료 : W3C

- 구글과 모질라의 참여로 표준화 작업이 활발하게 진행 중인 상

황을 감안하면, 최종표준안으로 확정되기 이전이라도 크롬과


11

파이어폭스(Firefox)에 서비스 워커 기능이 도입될 것으로 예상

※ 구글은 2014년 12월 4일 크롬 웹브라우저 베타 40 버전에 서비스 워커 기

능을 처음으로 도입했다고 발표

q 서비스 워커의 장점 및 전망

m 서비스 워커는 네트워크 연결이 끊기는 오프라인 상태가 되었을

때, 네트워크가 복구될 때까지 저장된 페이지나 다른 기능들을

제공함으로써 웹앱을 네이티브앱처럼 사용 가능

- 또한 서비스 워커는 기존의 웹앱이 매번 실행할 때마다 모든

리소스를 로딩하기 때문에 느려질 수 밖에 없는 단점을 보완

함으로써, 온라인 상태에서도 웹앱의 속도와 성능을 네이티브

앱 수준으로 끌어올릴 수 있는 기술로 평가받고 있음

m 백그라운드 실행 기능으로 인해 웹앱에서의 푸시 서비스가 가능

해지고, 데이터 로딩 속도도 향상될 것으로 예상

- 서비스 워커는 모든 작업을 백그라운드에서 진행함으로써 브라

우저를 실행하지 않은 상태에서도 푸시 API 사용이 가능하며,

이에 따라 기존에는 네이티브앱에서만 가능했던 푸시 서비스

가 웹앱에서도 가능해질 것으로 전망

- 또한 브라우저에서 실행하는 작업들과 백그라운드에서 실행하

는 작업들이 별개로 진행되기 때문에 웹 페이지 로딩 속도도

크게 빨라질 것으로 예상


q 웹 컴포넌트의 기능

m 웹 컴포넌트는 HTML 문서 내에 특정 기능을 수행하는 컴포넌

12

트를 태그 형태로 삽입시킬 수 있는 기술로, HTML5 표준에 기

반하고 있으며, 개별적인 특성을 가진 다음과 같은 4가지 규격

으로 구성

< 웹 컴포넌트의 4가지 규격 >

규격 내용

Custom Element

■ 커스텀 태그를 통한 요소 생성

- 새로운 HTML 요소를 생성

- 다른 요소를 확장해 생성 가능

- 단일 태그에 커스텀 기능의 묶음 가능

- 기존 DOM 요소의 API를 확장

HTML Imports

■ HTML 페이지 로딩

- JS/HTML/CSS를 묶음 형태로 사용 -> 단일 URL 호출

- HTML Import를 통해 추가되는 컴포넌트들은 중복되는 경우라도 호출,

파싱 및 실행은 한번만 수행

- Import 내의 스크립트는 메인 문서의 파싱을 블럭하지 않음

- 스크립트는 Import시 실행되나, 다른 요소(마크업, CSS 등)들은 메인

페이지에 추가되는 시점에 활성화

HTML Templates

■ 템플릿

- 비활성화 상태의 복제 가능한 DOM chunk

- 새로운 태그 : <template> ··· </template>

- 태그 내의 태그들은 사용되지 전까진 파싱은 되나 렌더링되지 않음

- 컨텐츠는 클론/사용 되기 전까진 비활성화

Shadow DOM

■ DOM과 스타일의 캡슐화(Encapsulation)

- 별도의 Scope를 갖는 DOM

- 폴리머(Polymer)에서 생성되는 모든 요소들은 Shadow DOM으로 처리

※ 자료 : 박재성(2014.11)

- HTML이 기본으로 제공하는 엘리먼트(Element)는 브라우저와

운영체제에 따라 다르게 보이고, 진화하는 웹 환경에 대응하기

에 한계가 있다는 점 때문에 그 동안 자바스크립트(JavaScript)

컴포넌트로 이를 보완해 왔음

- 그러나 자바스크립트는 사용이 어렵고 크기가 커서 실행속도가


13

느리다는 단점이 있어, 이를 보완하기 위해 W3C는 기존의 컴

포넌트 기술을 웹에서 적용할 수 있도록 새로운 규격들을 만

들었는데, 이를 묶어서 웹 컴포넌트라고 부름

q 웹 컴포넌트의 장점 및 전망

m 웹 컴포넌트의 장점은 재사용이 가능하고, 웹 컴포넌트만 따로

수정이 가능하며, 다른 HTML 요소에 영향을 주지 않으면서 웹

컴포넌트 개체만 독립적으로 동작 가능하다는 것임

- 개발자들은 이미 만들어 놓은 웹 컴포넌트를 사용하여 웹 개발

에 소요되는 시간을 단축시키고, 일부 수정만으로도 유지보수

를 용이하게 할 수 있음

- 특히, 웹 오피스 등 웹앱에 대한 복잡도가 증가하고 있는 환경

변화로 인해 빠른 개발이 가능한 웹 컴포넌트의 활용도 점차

늘어날 것으로 예상

m 웹 컴포넌트의 표준화로 인해 향후 웹 컴포넌트를 쉽게 사용하

기 위한 다양한 서비스들이 개발될 것으로 예상

- 또한 기존에 웹 컴포넌트로 만들어진 라이브러리를 개인이 커

스터마이징해서 사용하거나, 웹 컴포넌트만 만들어 판매하는

사례가 등장할 것으로 전망됨

4. 웹RTC(WebRTC)

q 웹RTC의 기능

m 웹RTC(Web Real Time Communication)는 HTML5에 포함된 기술

로, 별도의 플러그인 없이 브라우저 내에서 오디오 및 비디오

커뮤니케이션을 가능케 하는 오픈소스 API임

14

- 기존의 실시간 통신 서비스들은 플러그인이 필요하고 클라이언

트-서버간 데이터 통신 기능을 제공하고 있는데 비해, 웹RTC

는 플러그인 없이 클라이언트간 P2P로 통신 기능을 제공한다

는 점에서 차이가 있음

m 웹RTC는 브라우저 기반의 통신 방식으로, 구글이 오픈소스화한

후 W3C에서 표준화 작업을 진행 중임

- 2011년 10월 27일 첫 초안이 W3C에 게재되었으며, 이후 3차례

의 초안을 더 거친 후 오는 2015년 2/4분기에 후보 권고안

(Candidate Recommendation)이 완성될 것으로 예상

- 최종표준안에 포함되지는 않았으나, 현재 크롬, 오페라, 파이어

폭스에서 구현되고 있음

※ WebRTC는 구글이 2010년 On2로부터 VP8 비디오 코덱을 인수하면서 오픈

소스화 했음

< WebRTC의 데이터 전송 방식 >

※ 자료 : html5rocks.com


15

q 웹RTC의 장점 및 전망

m 웹RTC는 서버를 거치지 않기 때문에 빠른 데이터 송수신이 가

능하며, 플러그인 설치가 필요 없어 브라우저 상에서 손쉽게 음

성 및 화상통화가 가능하다는 장점으로 인해 차세대 커뮤니케이

션 기술로 각광받고 있음

- 또한 오픈소스이기 때문에 개발자들의 라이선싱 비용 부담이

없다는 점도 웹RTC 확산에 긍정적인 요소로 작용할 전망

m 또한 구글이 주도하고 있는 웹RTC 시장에 2014년 마이크로소프

트와 통신장비업체인 에릭슨(Ericsson)까지 가세함으로써, 웹RTC

분야는 향후 치열한 격전장이 될 것으로 예상

- 그 동안 RTC 기술에 소극적이었던 마이크로소프트는 2014년

10월 ORTC(Object RTC)를 자사 인터넷 익스플로러(IE) 브라우

저에서 지원하기로 발표했으며, 향후 스카이프웹(Skype for

Web)에도 RTC 기술을 적용할 계획

- 에릭슨은 2014년 10월 웹RTC 표준을 지원하는 모바일 브라우

저인 ‘바우저(Bowser)’와 웹앱 개발자용 프레임워크인 ‘오

픈웹RTC(OpenWebRTC)’를 오픈소스로 공개한다고 발표

5. 웹GL(WebGL)

q 웹GL의 기능

m 웹GL(Web Graphic Library)은 웹 기반의 그래픽 라이브러리로,

플러그인 사용 없이 웹 브라우저에서 2D 및 인터랙티브한 3D

그래픽을 사용할 수 있게 하는 API 기술

- 웹GL은 OpenGL ES 2.0을 기반으로 하는 HTML5 캔버스 요소

16

의 일부로, OpenGL이 네이티브앱을 만들 때 사용되는데 비해,

웹GL은 브라우저에서 웹앱을 만들 때 사용

- 웹GL은 자바스크립트를 이용한 크로스 플랫폼 API로, 거의 모

든 브라우저에서 호환

- PC에서는 크롬, 모질라, 오페라 등이 이미 웹GL을 지원해 왔

고, 인터넷 익스플로러(IE)는 11 버전부터, 사파리는 OS X 기반

의 최신 버전부터 지원하기 시작했으며, 모바일에서는 iOS와

안드로이드 최신 버전 모두 지원

m 웹GL은 비영리단체인 크로노스 그룹(Khronos Group)이 표준화

를 주도하고 있으며, 구글, 모질라, 오페라, 애플 등이 WebGL

워킹그룹에서 활동하고 있음

< 크로노스 그룹의 ‘WebGL’ 표준화 현황 >

※ 자료 : Khronos Group

q 웹GL의 장점 및 전망

m 브라우저가 사용자 PC의 GPU(Graphic Processing Unit)를 직접

제어함으로써 웹 화면 렌더링을 빠르게 처리할 수 있음


17

- 기존에는 CPU(Central Processing Unit)가 렌더링을 처리했으나,

GPU 직접 제어를 통해 CPU의 부담을 줄임으로써 웹앱에서의

고속 렌더링이 가능

m HTML5의 표준 채택, 그 동안 WebGL과 경쟁관계였던 마이크로

소프트의 크로노스 그룹 참여로 인해 WebGL은 향후 고성능 웹

그래픽 기술을 주도하게 될 것으로 전망

- 마이크로소프트는 그 동안 자사의 3D 그래픽 기술인 ‘다이렉

트3D’를 고집해 왔으나, 결국 웹GL을 수용하는 방향으로 선

회한 것으로 추측됨



q 아직은 네이티브앱이 시장 주도

m HTML5의 등장에도 불구하고, 앱 시장은 여전히 네이티브앱이

주도하고 있음

- HTML5가 다양한 장점을 가지고 있으나, 여전히 성능상의 이유

로 개발자들이 웹앱 개발에 적극적이지 않은 상황

- 또한 네이티브앱이 갖고 있는 굳건한 수익모델로 인해 수익적

인 측면에서도 네이티브앱을 선호

q 순수 네이티브앱은 절반 약간 넘는 수준

m 그러나 실제로는 네이티브앱의 UI 다수가 HTML과 같은 웹 기술

에 의해 지원되고 있어, 순수한 의미의 네이티브앱은 절반을 약

간 넘는 수준임

18

- 시장조사업체인 비전모바일(VisionMobile)이 개발자 8,036명을

대상으로 조사한 결과에 따르면, iOS 앱의 47%와 안드로이드

앱의 42%는 순수한 의미의 네이티브앱이 아니라 웹이나 다른

기술을 사용하고 있는 것으로 나타남

< 순수 네이티브앱의 비중 >

Android iOS

※ 자료 : VisionMobile(2014.07)

q 하이브리드앱과 웹앱 지속 증가 전망

m 현재 시장에서 많이 사용되는 하이브리드앱은 ‘껍데기만 네이

티브앱이고 실제 실행은 웹앱’인 방식임

- 예를 들어, 네이티브앱으로 앱을 실행한 후 실제 화면은 웹뷰

로 보여주는 방식이 대표적임

- 이러한 하이브리드앱은 앞으로도 지속 증가할 것으로 전망

m HTML5의 성능이 개선되면, 웹앱 역시 증가할 것으로 예상됨

- 아직은 성능상의 이유로 네이티브앱에 대한 선호도가 높지만,

앱마켓 업로드 과정에서의 심사와 번거로운 등록절차가 걸림

돌로 작용


19

- 따라서 앱마켓 업로드가 필요 없고, 업데이트가 즉각적으로 진

행되는 웹앱에 대한 선호가 증가할 것으로 전망


q 주요 동영상 관련 업체, 플러그인에서 HTML5로 전환

m 동영상 OTT 서비스 업체인 넷플릭스(Netflix)는 2014년 11월 크

롬 브라우저에서 HTML5로의 전환을 100% 완료

- 넷플릭스는 2008년부터 윈도(Windows)와 맥(Mac)용 동영상 스

트리밍 서비스를 마이크로소프트의 실버라이트(Silverlight) 기

반으로 제공해 왔음

- 그러나 2013년 4월 동영상 스트리밍 플랫폼을 실버라이트에서

HTML5 기반으로 변경하기로 결정하고, 이후 HTML5로의 전환

을 꾸준히 진행

※ 마이크로소프트도 오는 2021년까지만 실버라이트의 동영상 지원을 유지하고,

이후 폐지하기로 결정

- 넷플릭스는 2014년 여름 사파리에서 HTML5로의 전환을 사실

상 마무리한데 이어 크롬에서도 HTML5로의 전환을 완료

m 애플은 2014년 6월 세계 개발자 컨퍼런스(WWDC)에서 Mac의 새

운영체제인 OS X 요세미티에서 구동되는 HTML5 기반 웹 브라

우저 사파리를 시연

- 새로운 HTML5 기반의 사파리는 넷플릭스의 1080 해상도 온라

인 스트리밍 동영상 시청에 최적화되어 있음

m 구글은 크롬과 파이어폭스 33 이상 버전 브라우저에서 유튜브

(YouTube) 이용시 HTML5 플레이어를 강제로 적용한다는 방침

- IE, 오페라, 사파리, 파이어폭스 33 이하 버전에서는 플래시 플

20

레이어와 HTML5 플레이어 중 선택할 수 있도록 허용

- 구글의 이러한 조치는 사용자의 선택권을 제한한다는 점에서

비판과 우려를 불러일으키고 있으나, HTML5의 플래시 대체를

가속화시킬 것으로 전망

m 페이스북(Facebook)은 모바일 사이트에서 HTML5를 지원한데 이

어, 데스크톱 동영상에서도 기존의 플래시 대신 HTML5을 지원

할 계획

q 플러그인 사라지고, HTML5 대세 될 전망

m 2014년은 HTML5가 동영상 서비스에서 플러그인을 밀어내고 대

세로 자리를 굳힌 한 해였음

- 주요 업체들은 2014년에 플러그인 대신 HTML5로의 전환을 완

료하거나 검토하는 등 사실상 플러그인을 폐기

m 이미 80% 이상의 브라우저들이 HTML5를 지원하고 있어, 플래

시나 실버라이트 같은 플러그인은 머지않아 사라질 것으로 전망

- 특히 대표적인 플러그인인 플래시가 모바일에서 지원되지 않는

데 반해, HTML5는 모바일에서 절대적 우위를 점하고 있어 플

러그인의 쇠퇴는 불가피할 것으로 전망


q 출판물 중에서도 카탈로그 등 홍보물 제작 솔루션 증가

m 2014년에는 출판물을 HTML5 기반으로 손쉽게 제작할 수 있는

각종 솔루션들이 경쟁적으로 출시됐음

- 특히, 오프라인 카탈로그나 브로셔, 잡지 등 시각적으로 화려한


21

출판물의 느낌을 온라인과 모바일에서도 손쉽게 그대로 구현할

수 있는 사용자 경험(UX)을 제공하는 솔루션들이 대거 출시됨

m 온라인 플립북 개발업체인 FlipHTML5는 HTML5, jQuery, CSS3

기술을 활용, 기업들의 홍보물을 오프라인 느낌 그대로 온라인

에서 제공하는 솔루션 및 서비스 제공

- FlipHTML5는 애플, 헤르메스(Hermes), 샤넬(Chanel), 스타벅스

(Starbucks), 시트로엥(Citroen) 등 글로벌 기업들의 홍보물을

오프라인 느낌을 살리는 동시에 온라인의 편리성(검색기능 등)

까지 결합하여 제작

< FlipHTML5의 ‘Hermes’ 제품 온라인 카탈로그 >

※ 자료 : FlipHTML5

m 디지털 출판 솔루션 업체인 PubHTML5는 PDF 파일을 HTML5

기반 플립북으로 손쉽게 제작할 수 있는 솔루션 출시

- PubHTML5의 솔루션은 PDF 파일을 온라인 카탈로그나 잡지

등 플립북 형태로 제작하는데 적합

22

- 사용자는 PubHTML5의 솔루션을 이용하여 HTML5 기반의 플립

북을 무료로 제작 가능하며, 제작된 플립북은 클라우드 서비스

를 통해 역시 무료로 저장 가능함

m 소프트웨어 개발업체인 Kvisoft 역시 HTML5 기반의 디지털 카

탈로그 제작 솔루션인 ‘Kvisoft Flipbook Maker’를 출시

- Kvisoft의 솔루션은 PDF뿐만 아니라 파워포인트와 워드로 제작

된 파일까지도 플래시와 HTML5를 포함한 다양한 포맷으로 제

작할 수 있는 기능 제공

- 특히, 최근 수년간 급성장하고 있는 모바일 쇼핑을 겨냥, iOS와

안드로이드 기반의 모든 스마트폰 및 태블릿PC에서 볼 수 있

는 카탈로그 제작이 가능하다는 점이 장점

q HTML5 기반 제작 솔루션, 출판물 전반으로 확대 전망

m HTML5 기반 출판물 제작 솔루션은 아직까지 카탈로그, 브로셔

등 홍보물 위주로 개발·출시되고 있으나, 향후 출판물 전반으

로 확대될 것으로 전망됨

- 특히, ePub3.0이 HTML5를 기반으로 하고 있고, 플러그인 없이

도 이미지나 멀티미디어 출판 콘텐츠의 제작 및 유통이 가능

하다는 점 때문에 HTML5로 제작되는 전자책 콘텐츠가 빠르게

증가할 것으로 예상

m 또한 출판물을 포함한 모든 콘텐츠가 모바일을 우선으로 하는

‘Mobile first’로 제작되고 있는 상황에서, 모바일 지원이 가능

한 HTML5가 출판물 전반으로 확대될 전망

- 킨들(Kindle)을 포함한 전자책 리더기와 스마트폰 및 태블릿PC

와 같이 전자 출판물을 읽을 수 있는 모바일 디바이스의 보급

이 확대될수록, 풍부한 사용자 경험 제공이 가능한 HTML5로


23

제작된 출판물 콘텐츠도 더불어 증가할 것으로 예상


q 기존 솔루션에 HTML5 기술을 적용해 모바일 기능 강화

m 세일즈 커뮤니케이션 솔루션 제작 업체인 Workface는 HTML5

기술을 적용하여 기존 제품을 개편

- Workface는 세일즈 직원과 고객 간에 동영상 및 텍스트를 통

해 대화를 할 수 있는 월정액 기반 유료 채팅 프로그램으로,

그 동안 모바일 디바이스에서는 사용이 불편하고 다른 단말과

의 끊김 없는(seamless) 연결 기능이 없었다는 단점이 있었음

- HTML5 기술을 적용한 이번 개편을 통해 모바일 디바이스를

포함해 인터넷에 연결된 모든 디바이스와 주요 웹 브라우저들

에서 Workface의 원활한 사용이 가능

< HTML5 기술을 적용한 Workface의 모바일용 버전 >

※ 자료 : Workface

m 기업용 데이터 네트워크 관리 솔루션 제공 업체인 Rocket

Software는 기존 데스크톱용 솔루션인 ‘iCluster’를 HTML5 기

24

반의 모바일용으로 출시

- iCluster는 기업 고객의 다양한 기기들과 서버들을 동기화하고

유사시 응급 복구 솔루션을 제공하는 고성능 데이터 네트워크

관리 솔루션임

- HTML5 기반 모바일 버전인 ‘Mobile Monitor’는 데스크톱 버

전인 iCluster에 비해 기능은 제한적이지만, 인터넷 브라우저만

있으면 디바이스에 상관없이 언제 어디서나 접속이 가능하기

때문에 즉각적인 네트워크 관리가 가능

m 가상화 소프트웨어 업체인 Ericom Software는 기업 고객들이

SAP의 Business One 프로그램에 원격으로 접속할 수 있는

HTML5 기반 솔루션 개발 추진

- 이 솔루션은 HTML5 기술을 사용함으로써, 플랫폼이나 브라우

저에 상관없이 기업 고객들이 Business One에 원격으로 접속

가능케 함

q 모바일 환경의 확산으로 HTML5 도입 증가할 전망

m 기업용 솔루션에서의 HTML5 도입은 대부분 기존 데스크탑용

버전을 모바일용으로 확대하거나 전환하는 과정에서 발생

- 이는 언제 어디서나 브라우저 및 플랫폼과 상관없이 기존 솔루

션을 사용하고자 하는 기업 고객의 니즈를 충족시키기에

HTML5 기술이 적합하기 때문임

m 아직은 기업용 솔루션에서 HTML5를 도입하는 초기 단계이나,

향후 다양한 산업 분야에서 HTML5에 기반한 솔루션을 도입할

것으로 예상

- 특히, 모바일 환경에서 업무의 효율성이 더욱 높아질 수 있는

보험, 재무, 법률, 헬스케어 등과 같은 산업에서의 도입이 선도


25

적으로 이뤄질 것으로 전망


q HTML5 앱의 손쉬운 개발 가능한 솔루션 잇따라 등장

m 모질라는 HTML5를 확산시키고 앱 개발자들을 끌어들이기 위해

HTML5 앱 개발 도구를 포함한 HTML5 제작 지원 솔루션 제공

- 모질라는 자사 브라우저인 파이어폭스에 HTML5 앱 개발용

IDE(Integrated Development Environment, 통합개발환경)인

‘WebIDE’를 탑재, 브라우저에서 쉽게 앱을 개발할 수 있는

기능을 제공

- 모질라는 또한 HTML5 웹앱 개발자들이 쉽게 활용할 수 있는

사용자 인터페이스(UI) 툴킷인 ‘Brick 2.0’도 제공할 계획

m 소프트웨어 업체인 앱가이버(AppGyver)는 2014년 12월 HTML5

기반 모바일 앱 개발 프레임워크인 ‘슈퍼소닉(Supersonic)’을

출시

- 슈퍼소닉은 네이티브앱 수준의 고성능 HTML5 기반 하이브리

드앱을 개발할 수 있는 프레임워크로, 숙련 개발자는 물론 초

보 개발자도 모두 활용 가능

m 소프트웨어 컴포넌트 제작 업체인 컴포넌트원(ComponentOne)은

2014년 8월 HTML5 컨트롤 기능이 대거 포함된 제품인 ‘Studio

Enterprise 2013 v3’를 출시

- 이 제품은 크로스 플랫폼용 모바일 앱 구축 및 유지보수가 가

능하도록 하기 위해 HTML5 기능을 도입함으로써, 컴포넌트의

개발 및 유지보수 비용과 시간을 대폭 줄여줄 것으로 예상

26

m 모바일 앱 개발 솔루션 업체인 모나카(Monaca)는 2014년 8월

jQuery 사용이 가능한 HTML5 UI 플랫폼인 ‘Onsen UI 1.1’신

규 버전 출시

q HTML5 전반에 걸쳐 다양한 지원 솔루션 증가 전망

m 2014년 들어 HTML5 기반 앱의 개발, 수정 및 유지보수를 용이

하게 하는 각종 솔루션들이 다수 등장함으로써, 향후 HTML5 기

반 앱이 크게 증가할 것으로 전망

- 초기에는 HTML5 앱 개발 지원 솔루션들이 주를 이루었으나,

최근에는 수정이나 유지보수, 업그레이드를 지원하는 솔루션들

도 등장

- 또한 HTML5와 함께 자바스크립트를 포함한 다른 웹 기술도

같이 지원하는 솔루션이나, HTML5를 활용해 작은 수정만으로

도 소스코드를 개선하는 앱 리팩토링(refactoring) 솔루션 등

HTML5 전반에 걸쳐 다양한 지원 솔루션들이 증가하고 있음


27

참 고 문 헌

o AppDeveloper Magazine, AppGyver Releases Supersonic, Bridging Native-Grade UI

and Data to HTML5 Hybrid Apps, 2014.12.4.

o AppDeveloper Magazine, Monaca Updates its Mobile App HTML5 UI Framework Now

with jQuery Support, 2014.7.25.

o HTML5 Report, ComponentOne Release Studio Enterprise 2013 v3, 2014.7.29.

o HTML5 Report, iCluster Monitoring and Management Platform Now Mobile Thanks to

HTML5, 2014.10.9

o TechCrunch, Mozilla Launches Built-In HTML5 App Development Environment For

Firefox, 2014.6.23.

o W3C, HTML5 Recommendation, 2014.10.28.

o 웹GL, 고성능 웹그래픽 대세로 뜨나, 지디넷코리아, 2014.9.30.

o MS, 외면했던 웹GL 지지로 선회, 지디넷코리아, 2014.8.14

o 전문가 인터뷰, 이승윤 W3C 사무국장, 2014.10.29.

o 전문가 인터뷰, 이원석 삼성전자 수석, 2014.11.25.

o 전문가 인터뷰, 네이버 박재성 팀장, 2014.12.04.

o 전종홍, 이승윤, HTML5 기반의 웹 플랫폼 기술 표준화 동향, 전자통신동향분석 제27권

제4호, 2012.8

o 백선기, 이준호, 지금까지 상상한 표현의 한계를 넘자-webGL, 데뷔2014 세미나

2014.9.29.

o 전종홍, HTML5 현재와 미래 전망, 투비소프트 그랜드 세미나, 2013

o www.w3.org

o www.html5rocksko.blogspot.kr

o www.html5rocks.com

본 내용은 집필자의 개인적인 견해로서 한국인터넷진흥원의 공식의견과는 무관합니다.

Documents

HTML5 이슈분석리포트 No. 9online.slidehtml5.com/dweu/byyw/byyw.pdf · 앱을 네이티브앱처럼 사용할 수 있게 해 주는 기술 q 서비스 워커의 장점 및 전망