HTML5와 CSS3, 이미 생활 깊숙이 들어와있다 2010/06/08 10:52
HTML5와 CSS3에 대한 사람들의 관심이 많다. 이 많은 관심 중 잘못된 생각들이 많은 것 같다. 흔히 '조금 아시는 분들'의 입에 자주 오르내리는 'W3C 표준 권고안'에 대한 문제다. W3C에서 HTML5 표준 권고안이 2012년에 나온다느니 그래서 2022년은 되야 HTML5가 안정적으로 쓰일 것이라느니 하는 말은 완전히 시대 착오적인 발언이다.
HTML5와 CSS3의 굵직한 스펙들은 이미 개발이 완료된 상태다. 그리고 표준권고안은 나와도 그만 안나와도 그만인 상황이다. 왜냐하면 많은 브라우저들이 이미 전면적으로 혹은 소극적으로 HTML5와 CSS3의 스펙들을 잘 지원하고 있기 때문이다. 단지 익스플로러만 빼면 말이다. 익스플로러는 버전 9부터 HTML5와 CSS3를 적극 지원하겠다고 했다.

MS의 테스트드라이브 for IE9
2. 구형브라우저, 익스플로러는 버려
우리나라의 의사 결정권자나 중간관리자들이 가장 무서워 하는 것이 익스플로러를 버리는 것이다. 그들이 익스플로러를 버리지 못하고 대는 핑계는 한결같다. "이용자층이 그래도 익스플로러가 가장 많다"는 것이다. 과연 그럴까. 해외에서는 구글이나 트위터 같은 곳이 나서서 익스플로러를 버리고 있고 과감하게 HTML5의 스펙과 CSS3 스펙을 이용하고 있다. 심지어 MS마저도 IE6 버리기 운동에 대해 '감사하다'는 의견을 피력했다. 친구에게 익스플로러6를 쓰지 않도록 인터넷 이용자들의 독려를 부탁하기도 했다.
인터넷 익스플로러에 맞추어 웹사이트를 제작하지 않으면 서비스가 망한다는 것은 달리 말하면 자신이 만드는 서비스에 자신이 없다는 것을 반증한다. 구글을 쓰기 위해 익스플로러를 버리는 사람이 늘어난다면 구글의 서비스가 그만큼 뛰어나다는 것을 의미한다. 만약 네이버가 (현재까지의)익스플로러를 무시하고 HTML5와 CSS3를 적극적으로 지원한다면 과연 네이버는 망할까? 아니면 이용자들이 익스플로러를 버릴까.
또, 익스플로러를 버린다는 표현이 과격해보여도 웹페이지를 HTML5로 만든다고 해서 서비스를 이용할 수 없는 것도 아니다. HTML5는 기존의 HTML과 XHTML문서들의 하위 호환성도 뛰어나니까 익스플로러 이용자도 HTML5 된 웹페이지를 별 문제는 없이 이용할 수 있을 것이다. 까놓고 보면 완전히 말장난인 것이다.
3. 상용 서비스 곳곳에서 찾아볼 수 있는 HTML5와 CSS3, 변화의 물결
지금 곧바로 구글에 접속해서 소스를 보면 확인할 수 있는 사항이 하나있다.

HTML5 독타입을 가지고 있는 구글 메인페이지
문서의 독타입이 HTML5의 독타입임을 확인할 수 있다.
이번에는 트위터에 접속해보자. 위에 있는 그림은 익스플로러로 접속했을 때 아래의 그림은 웹킷엔진을 사용하는 크롬이나 사파리, 혹은 파이어폭스로 접속했을 때의 화면이다.

CSS3를 사용하고 있는 트위터, 익스플로러는 그냥 무시
익스플로러와 파이어폭스나 웹킷을 지원하는 브라우저 등을 이용해서 페이지를 확인해보자. 뭔가 다른점이 있을 것이다. 박스 모서리가 둥글게 디자인 되어 있는데 익스플로러는 무시했음을 알 수 있다. CSS3의 속성 중 하나인 border-radius속성을 익스플로러를 무시하고 과감하게 사용했다. 이미지는 전혀 사용되지 않았다.

동영상을 로드중인 유튜브의 HTML5 플레이어
유튜브와 Vimeo는 HTML5 브라우저를 상용서비스에 이미 적용했고, 점차적으로 플래시로 동작하는 플레이어 개체수를 줄여갈 예정이다.

geolocation API가 적용된 골프존 모바일
이번에는 우리나라의 서비스다. 골프존 모바일 서비스다. 골프존의 매장을 찾아주는 서비스인데 HTML5의 geolocation API가 사용되었다. 아이폰의 사파리에서는 이 API를 지원하기 때문에 차용하였다. 현재 내가 있는 곳의 위치를 자동으로 알아내어 브라우저에 찍어준다.
W3C의 권고안이 문제가 아니고 이미 많은 브라우저가 HTML5와 CSS3 스펙을 잘 지원하고 있다는 것이 문제인 것이다.







구매처 :
좋은 정보 잘 읽고 갑니다.
반갑습니다. 많은 방문 부탁드리겠습니다.
좋은 글로 보답하겠습니다^^
구형 브라우져를 빨리 업데이트하면 좋을텐데요....
그러게 말입니다.
그리고, 브라우저 업데이트를 해도 이용자들이 외면하면 브라우저 점유율 줄이는게 참 쉽지 않은 것 같습니다.
영어권 처럼 우리나라도 네이버 다음 네이트 같은 포털이 나서서 구형 버전 IE안쓰기 운동 같은걸 하면 어떨까요^^
좋은글 잘 읽었습니다.
익스에 대해서는 말이 많고, 저역시 많은 불만을 갖고 있지만 실상 웹, 혹은 IT관련 종사자를 제외하고는 인터넷 익스플로러 = 인터넷 이라는 인식을 갖고 있다는 것입니다.
많은 브라우저가 이미 HTML5 와 CSS3를 지원 하고 있지만 가장 중요한 것은 국내에서는 아직까지도 익스플로러를 많이 사용한다는 것 입니다.
당장 네이버 및 기타 사이트들이 익스를 버리고 신기술을 도입하기 위해서는 넘어야 할 산이 많습니다. 쇼핑몰 등의 경우 가장 중요한 결제시스템 부터 익스가 아닌 타 브라우저 에서는 동작 할 수 없습니다. 게임사이트의 경우 통상 브라우저 내의 플래시 버튼을 클릭하여 사용자 PC에 설치된 게임실행 프로그램 파일을 실행하는데 이것 역시 익스플로러에서만 지원하는 엑티브 엑스 방식입니다.
html5는 개발단계이기때문에 가능성은 적지만 현제 생성된 객체중에 삭제 되거나 수정되는 경우가 생길 수도 있습니다. 분명 혁신적이고 개발자 및 IT종사자 입장에서 볼때 환호성을 지를 만한 일이지만 클라이언트 및 사용자 입장을 고려한다면 당분간 하위 호환성도 고려하여야 할 것 입니다.
네이버, 다음등은 포털이기 이전에 기업이며, 기업은 사용자를 늘려 광고, 마케팅등의 일정 수익을 올려야 합니다. 국내 최다 접속자를 자랑하는 네이버에서 어느날 갑자기 익스6을 버리겠다(혹은 html5를 전격 지원하거나)고 나선다면 개발자 입장에서는 놀라운 혁신이지만 분명 이쪽 계통에 관심없는 대다수 일반 사용자는 틀어지는 화면을 보며 외면할 것이고(일시적일 수도 있으나), 타 포털등으로의 이동하는 이용자도 늘어날 것입니다. 클라이언트는 접속자가 줄어드는(혹은 모험을 시도하는)포털사이트에 광고를 올리지 않게 될지도 모를일이죠.
개발자 측면에서 둥근 테두리를 만드는 것을 css3로 간단히 할 수 있다고 하지만 클라이언트의 인식은 예전부터 되던것 입니다. 1px만 어긋나도 전화오는 클라이언트는 크롬 브라우저가 무엇인지도 모를 뿐더러 설득당하려 하지 않습니다. 또한 크롬과 익스에서 왜 다르게 보이는지 납득하려 하지 않지요. 이것은 비단 디자인 적인 측면의 문제 만은 아닐것이라고 생각합니다.
html5, css3는 다가오는 미래가 아니라 현재 라고 생각 됩니다. 바꿔말해 모바일 브라우저의 경우는 일반 인터넷 환경보다 신기술을 적용하기 좋은 환경을 갖추고 있기 때문이죠. 즉 모바일 로의 html5,css3의 사용은 이미 열린상태 라고 생각합니다.
그러나 일반 웹쪽은 얘기가 다르죠. 많은 브라우저가 html5, css3를 지원하고 있지만 국내 실정에는 아직까지는 맞지 않을 수 있다고 생각 합니다. 익스플로러 9가 어떤식으로 나오게 될지 모르겠지만 html5에서도 아직 해결되지 않은(video테그의 코덱 문제 등)부분들이 많고, 현재까지 익스 6 사용자가 많은데 실질적으로 익스9가 대중화 되는데 걸리는 시간이 얼마나 될지도 관건이네요.
저역시 웹 관련 종사자로 하루 빨리 모든 신기술이 웹에 적용되길 손꼽아 기다리고 있습니다.
조금더 마음에 여유를 갖고 기다리면 그런 날이 올지도 모르겠네요.
상헌님 안녕하세요. 남겨주신 견해 잘 읽어 보았습니다. 본문의 글에서 제가 다소 경솔했음을 시인합니다. 포털은 포털이기 이전에 기업이라는 부분에 많이 공감합니다. 제 주변에 저희 부모님과 비슷한 연배의 분들이 인터넷을 어떻게 사용하는지 가끔 지켜봅니다. 가끔씩 익스플로러 아이콘이 사라지면 '인터넷이 없어졌어'라고 하며 AS를 저에게 요청하십니다. 그래서 '익스플로러=인터넷'이라고 생각하시는 분들이 많다는 부분도 동의를 합니다. 포털에서는 아마도 급진적으로 익스플로러 지원을 포기하거나 HTML5의 신기술을 특정 브라우저를 위해서만 제공하지는 않을 것 같습니다. 아마도 천천히 진행될 것입니다. 그리고 말씀하신 하위호환성도 완벽하게 고려하지 않을까 생각됩니다. 우리나라 디자이너분들은 물론이고 클라이언트, 이용자분들 의외로 1픽셀에 민감하신 분들이 많더라구요. 그래서 CSS3마저도 자유롭게 사용하기는 힘들지 않을까 생각됩니다.
상헌님 마음과 같이 저도 얼른 HTML5와 CSS3를 자유롭게 쓸 수 있는 환경이 왔으면 좋겠다고 희망합니다. 며칠전부터 대형 포털이 MS와 손잡고 IE6 안쓰기 운동을 전개하고 있던데요. 보셨죠? 정말 고무적인일 같습니다. 익스플로러6의 국내 점유율이 50%이하로 떨어졌다고 합니다. 변화는 이렇게 천천히 진행되고 있는 것 같습니다.
2022년 정착설은 오버지만 (하지만 대한민국만큼은 그게 맞을 지도 모릅니다. 더러운 IE6의 노예들)
HTML5와 CSS3가 아직 안정적으로 쓰이기에는 시기상조라는 것은 사실입니다.
HTML5같은 경우 HTML5 규격 완전히 구현 가능한 브라우저가 메이저 브라우저 중에서 하나도 없습니다.
파이어폭스, 오페라, 크롬, 사파리 등도 전부 다 예외가 아닙니다. 아직도 부분지원입니다.
위키에 보면 아직도 빨간색으로 칠해진 곳이 한둘이 아니고, 테스터기 돌려도 만점 하나도 못받았습니다.
CSS3같은 경우에는 특히 표준 권고안 도입이 시급한 상황입니다. 저기 예만 봐도 그러네요.
border radius말이에요. gecko용과 webkit용 코드가 따로 있는 현상황이 정상일까요?
"권고안이 나오든 말든 브라우저들이 나름대로 다 구현해놨으니 상관없다" 라는 의견은 좀 틀린것같네요.
애플이 HTML5와 CSS3 발표를 했을 때도 거기 사용된 코드가 사파리 말고는 구동되지 않아서 논란이 되었죠.
실제로 HTML5와 CSS3의 규격에 대해서는 보이지 않는 전쟁이 시작되었고, 그게 종식되지 않으면 안됩니다.
메서슈미트님 안녕하세요. 남겨주신 견해에 동의합니다. 지금 현재까지의 스코어를 놓고 보자면 HTML5를 포털에서 전면적으로 사용하기는 무리가 있어 보입니다. 아직 불안한 부분들도 많고요. 브라우저들이 전부 HTML5의 모든 속성이나 API를 지원하는 것도 아니니까요. 다만 CSS3는 조금 실험적인 마인드가 있는 포털 운영진이라면 가장 문제 없는 부분부터 서서히 적용해보는 것도 괜찮을 것 같습니다.
단, CSS3는 말씀하신대로 -o-, -webkit-, -moz-와 같은 프리픽스를 브라우저마다 전부 적용해줘야 해서 실용성은 많이 떨어진다고 볼 수 있습니다. 정상적인 것도 아니라고 생각합니다.
제가 본문에서 다소 경솔하게 글을 써서 오해를 안겨드린 것 같습니다. 좋은 글 감사드립니다.
참, 이번에 애플에서 오픈한 HTML5와 CSS3를 이용한 쇼케이스 사이트는 CSS3의 프리픽스를 전적으로 -webkit-만 사용했더라구요. 아예 다른 브라우저를 위한 CSS3 코드는 없습니다. 그래서 일부러 사파리만 사용가능하게 막은 것 같습니다. 크롬에서도 애플의 HTML5 쇼케이스는 잘 돌아갑니다. 동일한 웹킷 엔진을 사용하거든요.
편안한 주말 보내세요~
그만큼 HTML5가 먼 미래의 이야기가 아니라는 말을 하고 싶은 것 같습니다.
또한 이미 많은 다른 곳에서 W3C권고 이전에 HTML5를 사용하기 시작했으며, 지금도 계속 발전해나가고 있는 상황으로 보아 W3C권고 시점을 기준으로 HTML5 사용 여부를 결정해야 한다는 일부의 논리에 대한 반론인 듯 하구요..
현재 우리나라 웹 환경의 가장 큰 문제점이 activeX인 듯 합니다.
외국의 경우에는 꼭 필요한 경우SSL을 사용하지만 우리나라에서는 유독 activeX를 사용한 암호화를 표준으로 삼고 있습니다. (일부에서는 특정 벤더사들이 공기업에 로비를 한 결과라 하더군요)
이런 상황에서, 그리고 비 전문가의 입장에서는 크게 차이가 없고 상대적으로 가벼워 '보이는' IE6를 계속 사용하는 상황도 어찌보면 당연한 일일지도 모릅니다. (내부적으로 엄청 문제가 있고 느릴 수 밖에 없는 구형 브라우져임에도 불구하고 말이죠.)
"현재도 IE6는 전혀 불편하지 않다." 라고 생각하고 있는 많은 사람들을 IE8 이상의 버젼으로 '자발적 업그레이드'를 하도록 이끄는 것. 많은 사람들이 윈도우에 기본적으로 설치되어있으며 여지껏 큰 불만없이 사용해왔던 IE를 버리고 구글크롬 등을 설치하여 사용하는 것 (또한 그런 웹 환경이 우리나라에 정착되는 것) 등을 생각해보면... HTML5, 아니 웹 표준 이라는 용어가 우리나라에서는 그리 가깝게 느껴지지 않는 것이 현실입니다...
과연 이것은... 첫 단추의 문제였던 걸까요?
이번에 유명세를 치른 애플의 HTML5 쇼케이스와 구글의 HTML5Rocks 보셨죠? Bay Area의 많은 사이트들은 이미 HTML5와 CSS3를 잘 활용하고 있습니다. 미래가 아니라 현실이죠. 하지만 윗분들이 댓글을 주셨듯이 우리나라는 아직은 '가까운 미래'정도 되는 위치에 와 있는 것 같습니다. 그렇지만 구글이나 애플과 같은 사이트들이 앞장서서 HTML5와 CSS3의 놀라운 기능 구현을 자랑하고 있으니 우리나라에서 널리 쓰일일도 머지 않은 것 같습니다.
말씀하신대로 첫 단추를 잘못 끼웠습니다. 최근에 대형 포털들이 나서서 IE6 안쓰기 운동을 하고 있는 거 아시죠? 이게 전부가 될 수는 없어도. 큰 변화로의 의미있는 시작이 될 수 있다고 봅니다. 훌륭한 마케팅 캠페인이라고 생각해요.
비전문가들이야 기술은 상관없고 더 편리한 걸 선호하는게 당연합니다. 그런측면에서 사이트에 접속할때마다 액티브엑스를 안 띄우고도 쇼핑이나 은행 업무를 할 수 있다면 사용자측면에서도 더 좋지 않나 생각됩니다. 머지 않아 개발자분들께서 놀랄만한 좋은 일들이 많이 있을 것이라고 생각됩니다. 물론 변화는 정신차리고 보지 않으면 소리도 없이 다가와 있겠지만요^^;
클라이언트 개발자, FT 개발자 등으로 불리고 있습니다. 그러나 어느순간 UI개발자 라는 이름으로 통칭되고 있는것같습니다. 주로 웹어플리케이션의 Front End 기술을 다루는 직업입니다. UI개발자의 근원은
아웃사이더님 안녕하세요~ 말씀하신대료 실제로 UI/UX를 비롯한 프론트단에서의 업무가 매우 다변화 되었습니다. 또한 관련 기술의 업데이트 속도도 빠릅니다.