[컴퓨터월드] 17여 년 전 나모 웹에디터라는 제품이 있었다. WYSIWYG형 웹 에디터로 드림위버의 국산 경쟁제품으로 선전했었다. PC를 통해 인터넷에 홈페이지를 개인이 만들 수 있는 획기적인 제품이었는데 HTML, JAVASCRIPT, CSS 이런 것들을 몰라도 마치 워드프로세서를 통해 문서를 작성하듯이 홈페이지를 쓱쓱 만들어낼 수 있는 획기적인 한글 인터페이스의 HTML 편집기였다.

이제 지금 눈앞에는 나모 웹에디터와는 다른 모습의 통합개발환경의 Workspace 화면을 바라보고 있다. HTML5를 기본으로 RIA에 버금가는 UI와 기능을 제공하는 수많은 컴포넌트들이 가득한 화면을 바라보며 문득 17년 전의 HTML로 수월하게 뚝딱 만들어내던 그때가 떠오른 건 CSS와 JAVASCRIPT의 코딩 속에서 그때의 아련한 추억이 잠시 쉬어가는 휴식이 될 수 있기 때문이다.

HTML에서 HTML5로의 변화. HTML5가 단지 버즈용어가 아닌 지금, 그리고 미래의 웹 생태계를 구축하고 진화하기 위한 가장 중요한 가이드 역할을 할 것이라는 것에 이제 우리나라의 IT현장에서도 이견이 없다. 모니터에 펼쳐져 있는 Workspace를 보며 솔루션 업체에서 항상 첫 번째 문구로 고객들에게 어필하는 HTML5라는 단어의 여정을 다시 한 번 들춰보는 것은 그래서 의미가 있다.

역사와 이면을 아는 것은 다시 말해 그것에 대한 애정과 나의 관심을 들여다본다는 뜻이다. 그리고 이것은 CSS와 JAVASCRIPT로 대표되는 웹 생태계를 만들고 이끌어가는 우리들이 계속 앞으로 나아가는 동기와 방향성을 잃지 않도록 힘을 부여하리라 믿는다.

HTML5은 직관과 단순함에서 출발

HTML5의 역사는 매우 길다. 2004년부터 초안이 시작되었으니 10년도 훨씬 넘은 세월이다. 이 초안의 시작은 다양한 웹 브라우저의 호환성, 웹 개발자들의 생산성, 리치 웹 애플리케이션을 만들 수 있는 API를 포함하고 있었다. HTML5의 가장 큰 가치는 구 버전의 HTML의 호환성을 유지하면서 웹 개발자들이 지루하고 또 난해했던 웹의 생태계를 만들면서 겪어야만 했던 문제를 해결하기 위한 표준안을 만드는 것에 있다.

HTML은 정보, 그리고 이 정보에 의미를 부여하는 것을 텍스트기반으로 매우 쉽고 직관적으로 할 수 있게 하는 단순함에서부터 출발했다. 이 단순함은 웹을 이루는 생태계의 가장 아름다운 디자인이기도 하다. 하지만 90년대 중반 이후 IE vs Netscape의 점유율 싸움에서 상용 웹브라우저 벤더들은 비표준 태그들을 남발하기 시작했다. 이로 인해 크로스 브라우징 기법이 중요한 화두로 떠올랐으며 결국 IE의 독주로 인해 웹 서비스의 혁신이 사라진 브라우저시장의 암흑기가 도래한다.

결국 사용자UI 분야의 혁신은 익히 알려진 바와 같이 플래시, 실버라이트 등의 서브파티 플랫폼으로 넘어가버렸으며 우리나라의 기업환경에서는 웹(정확하게는 웹 브라우저인 IE)한계를 뛰어넘기 위한 리치 웹 애플리케이션(이하 RIA)를 구현하기 위한 엑티브엑스 기반의 X-Internet 시장이 태동한다.

물론 기존 HTML의 표준안을 만들고 가다듬는 W3C 기구에서는 기계가 사람의 언어를 명확하게 해석할 수 있도록 well-formed(잘 정형화된) 된 웹 문서를 제공하겠다는 이상을 실현하기 위해 XML을 기반으로 한 XHTML로의 전환을 꾀하고 있었다. 결국 HTML은 1999년 12월을 마지막으로 4.01 버전으로 표준화를 더 이상 업데이트하지 않고 있다. HTML4.01 버전과는 완전히 다른(마치 JAVA와 JAVASCRIPT의 관계처럼) XHTML은 분리된 표준으로 발전을 시도하였으나 XHTML은 2.0을 끝으로 더 이상 업그레이드가 되지 않고 HTML5에 자연스럽게 녹아들게 된다.

웹2.0이 가져온 변화

암흑기의 웹 생태계는 2000년대 중반부터 새로운 혁신의 계기를 맞게 된다. 바로 웹 2.0으로 불리는 새로운 방식의 웹 개발 접근법이 탄생한 것이다. 웹을 생성하고 관리하는 구조/표현/동작을 분리하여 검색 크롤러(기계)가 콘텐츠를 읽고 쓸 수 있도록 하는 것이 중요한 변혁의 시작이다. 웹 표준이란 결국 기계가 콘텐츠를 잘 분석하고 이해할 수 있도록 정형화된 문서를 만드는 것이 핵심이다.

또한 웹 2.0의 주요사상인 ‘플랫폼으로서의 웹’은 웹 애플리케이션 시장을 열었다. 대표적인 기술이 Ajax이며 구글의 지메일이 대표적인 그 시초를 이루었다. 다시 말해 데스크톱에서 일반적으로 사용하는 애플리케이션과 같은 사용자경험을 웹에서도 제공하게 된 것이다.

이러한 웹 개발 방식은 XML, XHTML, HTML을 이용하여 사용자 인터페이스를 만들고 CSS로 디자인과 스타일을 정의하며 자바 스크립트로 기능을 제어하는 전형적인 웹 개발프로세스가 정착되었다. 웹의 기술적 혁신은 독점적 지위를 누리던 IE가 아니라 모질라 재단의 파이어폭스와 애플의 사파리, 오페라 그리고 구글 크롬에 이르기까지 2004년부터 다양한 마이너한 웹 브라우저의 업체 혁신에서 시작되었으며 사용자의 선택에 힘입은 바 크다. 물론 MS와는 또 다른 제국이라 할 수 있는 구글과 스티브잡스의 애플의 역할이 가장 컸음은 부인하기 어렵다.

그러나 웹 표준화 기구인 W3C는 이러한 변화를 수용할 준비를 하지 못하고 있었다. 결국 기존 멤버그룹에서 모질라, 애플, 오페라는 W3C 밖 제3지대에서 새로운 버전의 HTML 표준을 준비한다. 자신들이 만드는 새로운 표준안에 누구나 참여할 수 있도록 개방하였다. W3C 회원사 중심이 아닌 웹 개발자가 진정으로 원하는 표준을 만들기 위해서였다.

이 그룹의 철학은 HTML 언어를 혁신하자는 것이다. 즉 HTML이 가지고 있는 기존 가치를 인정하고 장점을 살리면서 웹 브라우저 업체 간 불명확했던 처리 방식을 재정의하고 웹 개발자들이 콘텐츠 중심의 웹 애플리케이션 개발을 쉽게 하려는 것이다.

결국 W3C를 이끌고 있는 팀 버너스(웹의 창시자)는 HTML에서 XHTML 2.0으로의 전환 실패를 인정하고 새로운 HTML 작업을 시작할 것을 천명하게 된다. 제3지대의 웹 개발자와 벤더들 또한 W3C의 결정에 환영하면서 2007년 3월 새로운 HTML 규격을 확립하기 위한 그룹이 형성된다. 여기서 새 표준의 이름을 HTML5라고 명명하고 제3지대에서 작업하던 대부분의 표준안을 그대로 수용한다. HTML5는 결국 웹 개발자에 의한 웹 개발자를 위한 표준으로 거듭나게 된 것이다.

HTML5, 웹개발자에 의한 웹개발을 위한 표준

얼마 전까지만 해도(솔직히 아직도 많은 현업에서도) HTML5를 회의적으로 보는 많은 사람들의 시각이 존재했다. 위에서 언급한바 지난했던 W3C의 표준안의 과정에서도 보듯 일종의 버즈워드(명확한 합의와 정의가 없이 마케팅 또는 과시용으로 전락해버린 기술용어)가 아니냐는 반응이 있었다.

특히 우리나라에서는 RIA로 불리는 리치 인터넷 기술이 웹 애플리케이션의 미래인 듯 과대 포장되어 있었던 것이 사실이다. RIA의 구현방식이 플래시나 실버라이트, 액티브엑스 기반의 플러그인 등과 같이 특정업체의 솔루션이 웹 애플리케이션을 구현하는 가이드로 포장되어 왔기 때문이다. 또한 완전히 생태계를 구축한 스마트폰의 애플리케이션이 모바일의 확정적인 미래의 모습으로 재단하는 부분도 존재한다.

자, 이제 모니터 앞에 펼쳐져 있는 통합 환경의 개발 Workspace를 다시 한 번 바라본다. 단지 HTML코드 몇 개만 가지고도 오로지 PC의 웹 화면을 만드는 것에만 집중하면 되었던 17여 년 전에 비해 너무도 많은 디바이스와 이 기종의 환경에서 고객에게 만족할만한 UI경험을 제공하는 일은 이러한 멋진 도구가 있음에도 불구하고 피곤한 것이 사실이다. 개발자와 디자이너와 퍼블리셔의 경계도 웹2.0을 부르짖던 2000년대 초반에 비해 희미해지고 있다. 다른 분야와 장르의 기술과 의미를 이해하고 커뮤니케이션해야 하는 것이 지금의 현실이다.

하지만 웹이란 콘텐츠에 기반을 둔 정보 공유수단이라는 기본사상을 훼손하지 않고 웹 애플리케이션을 구현할 수 있는 도구로써 출발한 HTML5는 이제 지난한 표준화 과정과 어려움을 딛고 새로운 변화를 이끄는 리더로서의 위치를 확고히 하고 있다. HTML5는 웹 개발자의 시각에서 규격을 확립하였으며 그렇기 때문에 웹 콘텐츠를 만들고 생산하는 고급사용자와 웹 개발자들은 웹이라는 거대한 생태계를 보호하고 가꾸는 책임을 느껴야 한다.

다시 CSS와 JAVASCRIPT 코드를 보면서 화면을 만들어 간다. 모니터의 Workspace는 생태계를 가꾸는 정원사의 가위와 같은 도구로 매끄럽게 작동을 하고 있다.

자 오늘은 어떤 모습으로 정원이 꾸며질 것인가?