2012년 블로그 결산

오늘은 2012년의 마지막 날이다(한국 시간으로는 2013년의 시작). 어제 WordPress로부터 ‘Annual Report’를 받았다. 작년에도 비슷한 보고서를 받았는데, 올해는 훨씬 발전된 모습이다. 업데이트 속도가 더 빨라지고, 더 편리해지고, 더 기능이 많아지고 있는 것을 느낀다. 워드프레스가 약 2년 전부터 유료화 정책을 적극 시행해서 프리미엄 서비스를 열심히 홍보하더니, 그게 확실히 효과가 있었나보다. 워드프레스는 기본적으로 무료 블로깅 플랫폼이고 대다수의 사람들이 무료로 쓰고 있지만 나는 이런 저런 프리미엄 서비스들을 쓰다 보니 매년 100달러가 넘는 돈을 내고 있는데, 좋은 서비스에 돈을 내면 그 가치가 나에게 돌아온다는 생각이 확실히 든다 (아직 에버노트와 드랍박스를 무료로 쓰고 있는데, 항상 빚진 느낌이다).

리포트에 따르면, 올 한 해동안 36만 뷰 정도가 나왔다. 대략 그 중 3분의 2가 고유 방문자(unique visitor)이니, 24만 정도가 고유 방문이다. 같은 사람이 여러 번 방문하는 경우도 많이 있을테니, 사람 숫자로는 8만명 정도가 되지 않을까 싶다. 8만 명이라니, 생각해보면 아찔한 숫자이다. 매년 5만 5천명이 리히텐슈타인(Liechtenstein)을 방문하는데, 내 블로그 방문자만큼 되려면 7년이 걸린다며 유럽의 작은 나라보다 더 방문자가 많다고 알려준다. 가장 많은 사람들이 방문한 날은 2012년 11월 12일. ‘스토리가 중요한 이유‘를 포스팅한 날.

숫자로 보는 블로그의 한 해 성과. 26개 새 글
숫자로 보는 블로그의 한 해 성과. 26개 새 글, 36만 방문.

2012년에 가장 많이 읽힌 글은 아래 다섯 개이다.

  1. 한국 인터넷에서 잘못 끼워진 첫 단추, 그 이름은 네이버 (NAVER)
  2. 내가 영어 공부한 방법
  3. MBA를 준비하는 분들께 드리는 글
  4. 프로덕트 매니저(Product Manager)란?
  5. 스토리가 중요한 이유

사실 이 중 몇 개는 쓴지가 좀 된 글인데 아직도 방문 수가 높다. 첫 번째네이버‘ 글은 블로그 처음 시작할 때 즈음에 쓴 건데 아직도 이렇게 조회수가 높다는 게 좀 의아하다. 이 글을 일부러 찾아온다기 보다는 구글에서 ‘네이버’를 검색했다가 우연히 발견해서 읽게 되는 게 아닌가 싶다 (네이버에서 ‘네이버’로 검색해서는 이 글을 찾을 수 없다).

구글에서 '네이버'로 검색하면, 네이버 관련 글 두 개가 두 번째 페이지에 뜬다'
구글에서 ‘네이버’로 검색하면, 네이버 관련 글 두 개가 두 번째 페이지에 뜬다’

어쨌든, 이 글 덕분에 새로 유입되는 방문자가 많을 것으로 생각한다. 올해 8월에 ‘네이버 뉴스캐스트의 문제점‘이라는 제목의 하나 더 썼다. 나 말고도 수없이 많은 사람들이 지적한 문제고, 네이버 측에서도 문제 해결을 위해 노력하고 있었던지, 그 글을 쓴 후 얼마 지나지 않아 수많은 언론사들이 제목만 자극적으로 편집해서 경쟁하는 뉴스캐스트 방식을 없애고, 2013년 1월 1일 부터는 언론사 페이지를 직접 보여주는 ‘뉴스 스탠드’ 방식으로 바꾸겠다고 발표한 바 있다. 오늘 들어가보니 뉴스 캐스트와 병행해서 뉴스 스탠드가 나타나고 있다. 여전히 트래픽을 끌어오기 위한 ‘충격’, ‘뚝’, ‘알몸 시위’ 등의 자극적인 제목과 사진 위주라 썩 마음에 들지는 않지만, 그래도 뉴스캐스트에 비해서는 많은 발전이라고 생각한다.

네이버 '뉴스스탠드' 화면
네이버 ‘뉴스스탠드’ 화면

네이버와 언론사 이야기를 하면 또 말이 길어질 수 있으니 이 정도로 줄이기로 하자.

두 번째로 많이 읽힌 글은 ‘내가 영어 공부한 방법‘이다. 이 글을 포스팅하고 나서 ‘영어 공부’라는 주제에 대해 관심이 생각보다 높다는 것을 알게 되어 ‘TED 영상으로 영어 액센트 연습하기‘란 글을 하나 더 포스팅했었다. 영어 교육 사업은 거의 망하는 일이 없다더니, 영어는 누구에게나 골치거리인가보다.

올해 세 번째로 조회수가 높았던 글은 ‘MBA를 준비하는 분들께 드리는 글‘이었는데, 그동안 후배들에게 MBA에 관한 질문을 많이 받아 한 번 정리해봐야겠다고 생각하고 쓴 글이었다. 요즈음에 한국에서도 좋은 MBA 과정이 많이 생겨나기는 했지만, 여전히 MBA는 대개의 경우 유학을 의미하므로 막연한 환상을 가지고 접근하게 되기 쉽다. 나 역시 ‘따뜻한 봄, 넓은 대학 캠퍼스의 푸른 잔디에 누워서 책을 읽고 친구들과 토론하는’ 환상을 가지지 않았다고 말할 수 없다. MBA를 생각하기 전에 비용, 영어 말하기/듣기 실력, 졸업 후 진로 등에 대해 좀 더 비판적으로 고민을 해 보고 나서 결정을 해야 할 것 같다.

네 번째는 ‘프로덕트 매니저(Product Manager)란?‘이다. 올해 초에 썼던 글이다. 좀 드라이(dry)한 주제라 인기가 없을 것이라고 생각했는데 의외로 많은 사람들이 읽고 공감해 주었다.

마지막으로 순위에 오른 글은 지난 달에 썼던 ‘스토리가 중요한 이유‘이다. ‘Tell to Win’이라는 책을 읽고 나서 감명을 받아 나만의 생각을 정리해본 것이다. 이 글을 쓴 날 가장 많은 사람들이 방문했고, 가장 많은 ‘Like’ (1000개 이상)를 받았다. 아마 내년에도 순위권에 오르지 않을까 한다.

워드프레스에서 보내 준 또 다른 자료는 방문한 나라별 순위인데, 총 127개국에서 방문을 했다. 물론 한국이 제일 많지만, 미국과 일본에서의 방문도 꽤 된다. 아프리카나 남미의 나라들도 약간씩 보인다.

총 127개국에서 방문했고, 한국, 미국, 일본 순으로 많았다.
총 127개국에서 방문했고, 한국, 미국, 일본 순으로 많았다.

블로그를 쓰면서 느꼈던 보람을 지난번에도 한 번 이야기한 적이 있는데, 올 한 해도 지인들을 비롯해 많은 분들로부터 격려와 감사 메시지를 받았고, 새로운 좋은 분들을 많이 만났다. 만약 지금 망설이는 분이 있다면 김창원 님이 제안하신대로 가벼운 마음으로 새 해에 블로깅을 시작해보면 어떨까?

2013년에도 정성을 쏟은 글들로 찾아뵐 것을 약속드리며..

코세라(Coursera), 온라인 교육의 혁명

Coursera (코세라) 로고
Coursera (코세라) 로고

최근, 수업을 하나 들었다. 스탠포드 대학의 앤드류 Andrew Ng 교수가 강의하는 Machine Learning (머신 러닝)이라는 수업이다. 퀴즈도 풀고 숙제도 제출했다. 손으로 쓴 숫자를 감별해내는 알고리즘도 만들어서 테스트해봤다. 보통 이런 건 처음에만 의욕을 가지고 하다가 그만두게 되지만, 이번에는 달랐다.

Machine Learning은 Coursera라는 온라인 대학 강의 사이트에서 가장 있는 수업 중 하나이다. 수업을 듣고 나자 머신 러닝이 이미 얼마나 널리 사용되고 있는지, 왜 그 비중이 앞으로 높아질 수밖에 없는지 이해할 수 있게 되었다. 말 그대로 ‘기계가 스스로 배우도록’하는 방법인데, 이러한 기계에 많은 양의 데이터와 결과를 입력하면, 새로운 데이터에 정확히 반응할 수 있도록 기계가 ‘훈련’된다. 데이터가 많을수록 기계는 더 똑똑해진다. 예를 들어, 사진 관리 애플리케이션인 피카사(Picasa)에서 제공하는 얼굴 인식 기술은 머신 러닝을 응용한 것이다. 많은 사람들이 감탄하는 구글 번역기(Google Translate)도 마찬가지이다. 구글 번역기가 어떻게 전 세계의 수많은 언어를 다른 언어로 번역할 수 있는지에 대해서는 구글이 만든 “Inside Google Translate (구글 번역기의 내부)” 라는 짧은 비디오에 잘 설명되어 있다. 단어별, 또는 문장별로 직접 번역을 하는 것이 아니라, 수많은 문서와, 그 문서를 사람이 번역한 것을 구글 번역기에 집어 넣어 ‘교육’시키면, 컴퓨터가 언어의 패턴을 직접 이해할 수 있게 되고, 새로운 표현을 입력했을 때 최대한 사람이 하는 것과 가깝게 번역한다. 이 뿐 아니라, 구글이 가진 기술의 전방위에 Machine Learning이 적용되어 있다. 나한테 이렇게 큰 도움을 준 스탠포드 교수의 수업을, 나는 Coursera에서 돈을 전혀 내지 않고 수강했다. Coursera는, Andrew Ng 교수가 만든, 온라인 교육에서 가장 큰 혁신을 가져 온 서비스 중 하나이다.

지난 달, 뉴욕타임즈는 “The Year of MOOC (MOOC의 해)“라는 제목으로 비중 있는 기사를 실었다. MOOC는 Massive Open Online Course(수많은 사용자를 위한 오픈 온라인 코스)의 약자인데, 소위 말하는 ‘온라인 강의’를 모두 일컬어서 지칭하는 단어이다. 인터넷이 처음 등장했을 때부터 사용되었던 말이지만, Coursera의 대성공과 함께 올해의 유행어가 되었다. 지난 2012년 1월에 Coursera를 공동 창업한 앤드류 교수의 말에 따르면, 1년이 채 지나기 전에 유저 수가 170만명으로 늘어 ‘페이스북보다 빠르게 성장하고 있다고’ 했다. 그가 강의했던 Machine Learning의 경우, 무려 13,000명이 퀴즈와 숙제를 끝까지 마치고 그에게서 ‘수료증’을 받았다.

‘Non-profit(비영리)’ 회사 Coursera는 클라이너 퍼킨스 등으로부터 지금까지 무려 $22 million (240억원)의 펀딩을 받았으며, 수많은 대학의 ‘스타 강사들’이 만드는 새로운 수업을 계속해서 추가하며 공격적으로 성장하고 있다. 또한, 지난 달에는 빌 & 멀린다 게이츠 파운데이션으로부터 입문 수준의 온라인 코스를 개발하는 조건으로 $3 million (33억원)을 기부받았다. 2012년 9월 기준으로 33개 대학의 200개 강의가 올라와 있는데, 아래는, 오늘 아침에 이메일로 도착한, 새로 개설한 과목들 중 일부이다. Coursera의 모든 강좌는 명성이 있는 대학의 교수들에 의해 만들어진다. 그 다음으로는 2013년 1월 28일부터 시작하는 스탠포드 대학의 ‘컴퓨터 비전’ 수업을 들을 예정이다.

Coursera에서 새로 개설한 과목들. 흥미로운 주제들이 많이 눈에 띈다.
Coursera에서 새로 개설한 과목들. 흥미로운 주제들이 많이 눈에 띈다.

스탠포드 대학의 2012년 한 학기 등록금은 $13,350 달러(1500만원), 즉, 1년에 약 4만 달러이다(가을, 겨울, 봄 학기로 구성되어 있다). 한 학기당 20학점 정도를 수강한다고 하면, 학점당 670달러이고, 한 과목이 보통 3학점이라는 것을 생각하면 한 과목당 약 2000달러이다. 세계 최고의 명성을 가진 대학의 2000달러짜리 수업들이, Coursera에 모두 무료로 올라가 있다. 누가 관심을 보이지 않겠는가?

여기서 중요한 것은, 이러한 강의들이 단순히 수업 시간에 하는 강의를 뒤에서 비디오로 찍어서 올려둔 수준이 아니라, Coursera를 통해 수강하는 사람들의 위해 따로 제작되었다는 것이다. 강의 중간에 퀴즈도 나오고, 약 1시간 정도의 강의 후에는 숙제가 있다. 이 숙제는 채점이 되고, 자신의 프로필에 점수가 기록된다. 이 정도이니, 이 수업 하나당 100달러씩 받는다고 해도 나는 기꺼이 돈을 낼 준비가 되어 있다.

이러한 온라인 강의를 Coursera가 처음 시작한 것은 물론 아니다. 그 전에도 대학가 주축이 되어 만들어진 교육 웹사이트들이 많이 있었다. MIT Open Courseware, Berkeley Webcast 등이 대표적이다. 그리고 OpenCulture라는 곳에 가면 무려 550개의 대학 강의들이 주제별로 정리되어 있다. 나는 끊임 없이 뭔가를 배우는 것을 좋아해서, 이런 웹사이트가 생길 때마다 관심 있게 관찰하고, 그 중 몇 개 수업을 골라 들어보기도 했다. 하지만, Coursera에서 수업을 들을 때만큼 끈기 있게 했던 적은 한 번도 없었다. 재미있을 것 같아 시작했지만 비디오를 보다가 지루해져서 중단해버리는 경우가 대부분이었다.

무엇이 달랐을까?

첫째, 앞서 이야기했듯, Coursera의 강의들은 효과적인 온라인 교육을 위해 따로 제작되었다. 단순히 수업 시간에 카메라 하나 놓고 촬영하거나, 1시간이 넘는 강의를 덩그러니 올려놓았는데, Coursera에서는 교수의 얼굴과 슬라이드, 그리고 슬라이드 위의 노트가 효과적으로 표시되고, 강의 비디오 하나가 15분을 넘는 일이 없다. 비디오를 잘라놓은 덕분에 심리적 부담감이 적고, 비디오를 다시 보고싶을 때 쉽게 원하는 비디오를 찾을 수 있다. 한편, 비디오 재생 속도도 쉽게 조절할 수 있다. 잘 안다고 생각되는 부분은 2배 속도로 지나가면 된다. 앤드류 교수는 한 인터뷰에서 이 모든 것이 의도적인 설계라고 설명했다. 사소하지만 훌륭한 디자인이라고 생각한다. 요즘처럼 컨텐츠가 홍수를 이루는 때에, 비디오 하나가 1시간이 넘으면 누가 그걸 가만히 앉아 끝까지 볼 수 있겠는가.

둘째, 비디오 중간에 퀴즈가 나온다. 그리고 매 강의가 끝날 때마다 짧은 퀴즈가 있다. 수업을 하나 들어보면 이게 얼마나 큰 도움이 되는가를 알게 된다. 퀴즈가 갑자기 튀어나오니, 비디오를 멍하니 보고 있다가도 긴장을 하게 된다. 자신이 강의를 제대로 이해했는지 확인할 수 있다. 그리고 매 1시간 강의 후에 있는 퀴즈를 풀어보면서 이해를 더 깊이 할 수 있다. 이렇게 이해를 하면 숙제를 할 수 있게 된다.

셋째, 숙제가 있고, 채점이 된다. 그리고 숙제마다 기한이 있다. 숙제를 늦게 제출하면 감점된다. 이 부분이 가장 재미있었는데, 숙제가 ‘자동 채점’이 된다. 그렇다고 자동 채점을 하기 위해 객관식 문제가 나오는 것이 아니다. Machine Learning의 경우, 대부분의 숙제는 알고리즘을 프로그래밍하는 것인데, 구현이 제대로 되었는지 확인하기 위해 ‘채점기’가 다른 숫자를 알고리즘에 대입해본다. 그리고 원하는 결과가 나오면 점수를 받고, 그렇지 않으면 점수를 받지 못하게 되어 있다. The Chronicle (크로니클) 지와의 인터뷰에서, 앤드류 교수는 다음과 같이 이야기했다.

I actually enjoy working through problems with students. What I don’t enjoy is grading 400 homeworks. And so our thinking was to automate some of the grading so it frees up more faculty time for the interactions. (저는 학생들이 문제를 해결하는 과정을 함께 하는 것이 즐거워요. 제가 즐기지 않는 것은 400개의 숙제를 채점하는 것이죠. 그래서 채점하는 과정을 자동화하면 교수들이 학생들과 같이 일하는 시간이 늘어날 것이라 생각했어요. 단순히 객관식 문제 뿐 아니라 보다 복잡한 문제도 자동으로 채점하게 할 수 있어요.)

넷째, 강의마다 스케줄이 있고, 그 스케줄에 맞게 새로운 강의가 업데이트된다. 다른 대부분의 온라인 강의 사이트의 경우, 그냥 강의 수백 개가 올라와 있고, 그 중 원하는 것을 선택해서 시작할 수 있게 되어 있다. ‘자신의 스케줄에 맞게’ 시작하고 진행하면 된다. 편리하니 좋다. 그런데 그게 문제이다. 수업 스케줄이 따로 없으니 시간이 날 때 하나씩 듣다 보면 수업 하나 끝내는 데 1년이 걸린다. 아니, 1년만에 끝내기라도 하면 다행이다. Coursera의 강의들은 모두 스케줄이 있고, 그래서 어떤 강의는 원하더라도 시작할 수가 없다. 그리고 스케줄대로 진행되기 때문에 그 수업을 듣고 있는 다른 학생들과의 상호 작용이 가능해진다. 같은 시기에 같은 강의를 듣고, 같은 숙제를 하고 있기 때문이다.

마지막으로, 웹사이트를 깔끔하게 참 ‘잘 만들었다‘. 이는 Coursera의 두 공동창업자 – Andrew Ng과 Daphne Koller – 가 컴퓨터과학과 교수라는 것이 큰 영향을 끼쳤다고 생각한다. 둘은 소프트웨어를 매우 잘 이해하고 있었고, 자신의 아이디어를 소프트웨어로 구현할 수 있었다. 그리고 소프트웨어를 잘 만드는 똑똑한 학생들을 주변에 많이 두고 있었다.

결국, Coursera가 가진 이 모든 장점은 ‘오프라인 교육의 경험’을 최대한 온라인으로 가져오려는 노력의 결과이다. 그래서 Coursera가 다른 모든 웹사이트를 누르고 성공했다고 생각한다.

여기서 앤드류 교수에 대해 잠깐 설명해보자. 그는 1976년에 영국에서 태어났으며, 홍콩과 싱가폴에서 교육을 받았다. 카네기 멜론 대학 컴퓨터과학과를 졸업하고 MIT에서 석사 학위, 버클리에서 박사 학위를 받은 후 2002년부터 스탠포드에서 교수 생활을 시작했다. 인공 지능과 머신 러닝이 전공 분야이며, 이 분야에서 100 개 이상의 논문을 썼다. 2008년에는 MIT 테크놀러지 리뷰에서 매년 발표하는 TR35에서 세계에서 가장 혁신적인 사람 35세 미만 35명 중 한 명에 포함되기도 했다 (출처: Wikipedia). 그는 전부터 교육을 온라인으로 옮기는 것에 관심이 많았던 것 같다. 2008년에는 Stanford Engineering Everywhere라는 웹사이트를 만들었는데, 그는 여기에도 Machine Learning 강의를 올려두었었다. 그가 수업시간에 했던 강의를 비디오로 찍어 올려둔 것에 불과했지만, 그의 첫 강의 비디오의 조회수는 38만이 넘는다. 이러한 성공에 고무되어 스탠포드에서 인공지능을 가르치는 다프네 교수와 함께 Coursera라는 회사를 만들기로 결심한 것이 아닌가 싶다.

코세라를 공동창업한 앤드류와 다프네 스탠포드 교수
코세라를 공동창업한 앤드류와 다프네 스탠포드 교수
칸 아카데미를 만든 살만 칸(Salman Khan)
칸 아카데미를 만든 살만 칸(Salman Khan)

온라인 교육의 혁명을 이야기하면서, 칸 아카데미(Khan Academy)를 빼놓을 수 없다. Coursera가 탄생하기 전, 2011년을 뜨겁게 달구었던 웹사이트이다. 설립자 살만 칸(Salman Khan)은, 방글라데시 출신의 어머니와 인도 출신의 아버지 사이에서 태어났으며, MIT에서 학사, 석사를 받고 하버드 경영대학원에서 MBA를 받은 후 헷지펀드 매니저로 일하던 중, 인도에 있는 사촌 동생에게 온라인으로 수학을 가르치기 시작했다. 이왕 만드는 거 다른 학생들도 보면 좋겠다 싶어서 유투브에 강의를 올려놓았더니 조회수가 크게 증가했다고 한다. 얼마 후, 그는 일을 그만두고 하루 종일 방에서 강의를 만드는 일에 집중했으며, 그가 만든 강의는 수백 개에 달한다. 처음엔 초등학생 수준의 수학 설명 비디오로 시작했지만, 지금은 온 분야를 망라하는 다양한 주제의 강의가 올라와 있는데, 그의 해박하고 광범위한 지식이 놀랍다. 이러한 과정을 2011년 3월에 TED에 나와서 설명했는데, 참 재미있게 들었다. 이 비디오는 거의 2백만명이 시청했다. 예전에 ‘스토리가 중요한 이유‘에서도 썼지만, 이렇게 개인의 스토리가 담겨 제품이 나오니 정말 많은 사람들에게 공감을 사고 큰 인기를 끈 것 같다. 가끔 웹사이트에 가서 짧은 강의 하나씩 들어보면 재미있다.

한편 Coursera와 비슷하게 대학 교수들의 강의 위주로 만든 Udacity도 관심있게 지켜볼 만하다. MIT와 하버드 대학에서 각각 무려 $30 million (약 330억원)을 출자해서 만든 edX도 있다. 대학 강의는 아니지만, 전 분야에 걸쳐 다양한 주제에 대해 온라인 및 오프라인 강의를 모아둔 Udemy 또는 SkillShare도 인기가 있다.

마지막으로, 스탠포드 대학에서 HCI로 석사 과정을 마치고, 현재 MIT에서 박사 과정에 있는 김주호씨(@imjuhokim)가 TEDy Boston에서 강연한 1시간 반짜리 비디오, “MIT, 하버드, 스탠포드 학생 백만명 시대 – 학교가 필요 없어진다?” 를 소개한다. MOOC의 역사와 현재 인기 있는 서비스들을 자세히 분석해서 설명했다.

지메일이 핫메일을 이긴 진짜 이유 (Ajax가 가져온 유저 인터페이스의 혁신)

Gmail의 탄생

2004년 4월 1일, 만우절. 지메일(Gmail)이 세상에 등장했다. 그 전에 대부분의 사람들은 마이크로소프트 아웃룩(Microsoft Outlook)이라는 데스크탑 프로그램을 사용하고 있었다. 데스크탑 프로그램의 가장 큰 단점은 설치를 해야 한다는 것이었다. 사람들은 브라우저에서 바로 이메일을 확인하기를 원했다. 그런 사람들을 위한 웹메일이 탄생했다. 그 중 가장 인기있었던 것은 마이크로소프트가 인수해서 발전시킨 핫메일Hotmail이었다. 그 때 한국에서는 한메일(Hanmail)이 인기였다. 이러한 웹메일이 편리하기는 했지만, 느렸고, 사용하기 불편하다는 것은 여전히 단점이었다. 무엇을 하든지 페이지 전체가 새로 로드되는데, 그 때마다 화면 전체가 껌벅 하는 것이 거북했다. 그리고 아웃룩에서 편리하게 쓸 수 있는 많은 발전된 기능들이 웹메일에서는 지원되지 않았다.

내가 처음 지메일을 쓰기 시작한 것은 2005년 초였다. 같이 일하던 파트너가 미국 샌디에고에 있어서 샌디에고로 출장가서 일하던 때였는데, 내가 대용량 파일을 보내야 하는데 뭐가 좋을까 고민하고 있는 것을 보더니 그가 지메일을 사용해보라고 권했다. 자기한테 초대장이 있으니 보내주겠다는 것이었다. 당시로서는 파격적인, 무려 1기가 바이트나 되는 용량을 무료로 제공한다고 했다. 당시 다른 웹 메일 서비스는 수십 메가 정도밖에 제공하지 않는데 1기가바이트를 준다니 믿기 힘들 정도였다 (지금은 가입하면 10기가바이트를 무료로 제공한다).

지메일을 처음 썼을 때의 느낌은 빠르고 쾌적하다는 것이었다. 핫메일이나 한메일에서와는 달리 지메일에서는 새로운 이메일을 확인하거나 이메일을 발송하고 난 후에 화면 전체가 깜빡하는 일이 없었다. 새로운 이메일을 작성하고, 답장하고, 이전 이메일을 확인하는 모든 것이 아주 빨랐다. 그 비결은 Ajax(Asynchronous JavaScript and XML)라는 기술에 있었다.

Gmail이 탄생한 지 정확히 5년이 되던 2009년 4월 1일, 와이어드(Wired)에 ‘Gmail Hits Webmail G-Spot(지메일이 웹메일의 지스팟을 발견했다)‘라는 재미있는 제목으로 실린 글에 다음과 같은 구절이 있다 (발췌).

It’s difficult to ignore the enormous influence Gmail has had not only on web-based e-mail services, but on rich web applications in general. Several of the concepts introduced by Gmail, which were at the time on the bleeding edge of application design, have since been adopted by the web’s mainstream. (지메일이 웹 기반의 이메일 서비스 뿐 아니라 풍부한 웹 애플리케이션 전체에 미친 영향을 무시할 수 없다. 당시에는 생소했던 지메일에 처음 소개된 많은 기능이 지금은 웹 전체에 적용되어 있다)

The biggest was the use of Ajax, a technique for building web interfaces that gave Gmail that extra snappiness, more closely matching the desktop applications it eventually lured us away from. (그러한 영향 중 가장 큰 것이 Ajax의 사용이다. 이 기술을 사용한 덕분에 Gmail은 쾌적한 느낌을 주었고, 데스트탑 애플리케이션을 더 가깝게 따라할 수 있었다.)

Before Ajax, users would click a link or a button on a webpage, and then they’d have to wait for the entire page to reload in order to see the result. Using Ajax, web programmers could build an application that redrew pieces of the page on the fly without having to reload the whole thing. A user could see new elements appearing and disappearing on the page as they clicked, minus all the waiting. (Ajax 시대 이전에는, 유저가 웹 페이지의 링크나 버튼을 클릭할 때마다 페이지 전체를 다시 불러왔고, 그 때마다 기다려야 했다. Ajax 기술을 이용해서 화면의 일부만 업데이트할 수 있었고, 이제 클릭을 하면 새로운 내용만 화면 위에 나타나거나 사라진다. 기다릴 필요도 없어졌다.)

Ajax란?

Ajax란 Asynchronous JavaScript and XML(비동기식 자바스크립트와 XML)의 약자이다. 여기서 가장 중요한 것은 ‘비동기식‘이라는 단어이다. 사용자가 버튼을 클릭하거나 요청을 해야만 웹 브라우저가 새로운 내용을 가져오는 이전의 방식과는 달리, 화면의 일부분만 업데이트된다. 이 과정을 설명하기 위해, 웹 브라우저에 무언가가 표시되기까지의 과정을 간략히 표현하면 다음과 같다.

웹 브라우저와 웹 서버 사이의 정보 교환
웹 브라우저와 웹 서버 사이의 정보 교환 (출처: tonymarston.net)

즉, 브라우저에서 페이지 요청하고, 서버에서 요청한 페이지를 찾은 후 필요한 작업을 한 후 결과물을 브라우저로 보내준다. 그러면 브라우저에서 이 내용을 표시한다. 그러나 Ajax 방식을 사용할 때는 중간에 한 가지 과정이 더 있다. 브라우저가 서버에 페이지 전체를 요청하는 대신, 필요한 내용만 요청한다. 그 결과가 오면 화면 전체에 뭔가를 그리는 대신 화면 위에 있는 내용을 곧바로 조작한다. 이미지가 새로 나타나게 할 수도 있고, 텍스트가 사라지게 할 수도 있고, 새로운 뭔가를 띄울 수도 있는 등, 무엇이든 조작할 수 있다. 웹페이지는 문서 객체(Document Object)라는 것으로 구성되어 있는데, 이를 이해하는 것이 중요하므로 아래에서 간략히 설명을 해보겠다. 웹페이지는 HTML(Hypertext Markup Language)이라는 언어로 표현되어 있다는 것은 대부분 이미 알고 있을 것이다. 아주 간단한 HTML 코드 하나를 이용해서 예를 들어 보겠다.

<HTML>
<HEAD>
<TITLE>이것은 타이틀입니다</TITLE>
</HEAD>
<BODY>
<P>이것은 하나의 문장입니다</P>
<IMG SRC="elephant.jpg"></IMG>
</BODY>
</HTML>

위 코드를 브라우저에서 로드하면 다음과 같은 결과를 볼 수 있다.

elephant
위에서 예로 든 HTML 코드를 실행한 화면

코드를 가만히 살펴보면 정말로 간단하다. 처음에 <HTML>로 시작하는데, HTML언어로 쓰여져 있다는 것을 알리는 것이다. <TITLE>로 감싸져 있는 것은 말 그대로 타이틀이다. 이 안에 타이틀이 들어가는데, 여기 있는 내용이 브라우저의 타이틀로 사용된다. 그 다음은 <BODY>라고 정의되고, 그 아래에 <P…> 로 시작하는 한 줄이 있다. ‘P’는 ‘Paragraph(문장)’의 약자이며, 그 사이에 문장이 들어간다. 그 다음은 <IMG…>로 시작되는데, IMG는 Image(이미지)의 약자이다. 이미지를 표시하는데, 이미지 파일 이름을 입력하면 위와 같이 코끼리 이미지가 나타난다.

위와 같은 HTML 코드는 실제로 브라우저에서 처리되기 전에 아래와 같이 분해가 된다.

dom
문서 객체 모델(Document Object Model)

이렇게 분해된 모습을 ‘문서 객체 모델(DOM: Document Object Model)’이라고 부른다. 이것이 중요한 이유는, 일단 이렇게 분해되고 나면 조작하기가 쉽기 때문이다. 예를 들어, 이 상태에서 코끼리 그림을 고양이 그림으로 바꾸고 싶다면, 페이지 전체를 다시 구성할 필요 없이 “IMG” 아래 “elemphant.jpg”라는 요소만 “cat.jpg”로 바꾸면 된다. 이런 식으로 하면, 웹 페이지 위에 있는 어떤 것이든 조작할 수 있게 된다. 웹페이지에 새로 보여줘야 하는 내용이 서버에서 와야 할 경우가 있다. 그럴 경우, 서버에 그 내용을 요청해놓고 다른 작업을 한다. 원하는 내용이 도착하면 그 때 업데이트한다.

이해를 돕기 위해 또 다른 예를 들어보겠다. 소포를 주문해놓고 기다리는 경우를 생각해보자. 한 화가가 화실에서 그림을 그리고 있다고 하자. 노란색 물감이 떨어졌다. 전화로 노란색 물감을 추가 주문했다. 이 경우, 화가는 두 가지 선택을 할 수 있다. 하나는 물감이 올 때까지 기다리는 것이다. 이것이 바로 “동기(Synchronous)” 방식이다. 또 한가지는, 노란색 물감이 필요한 일은 그대로 두고 가진 물감으로 그림의 다른 부분을 그리다가, 소포가 도착하면 그 때 노란 물감으로 필요한 작업을 하는 것이다. 이것이 “비동기(Asynchronous)” 방식이다. Ajax에서 A의 약자가 바로 Aynchronous(비동기 방식)를 의미한다.

페이지 전체를 새로 로드하는 것이 첫 번째 방식과 비슷하다. 이 경우, 사용자는 버튼을 눌러 놓고 (즉, 노란색 물감을 주문하고) 페이지 로드가 모두 끝날 때까지 가만히 기다려야 한다. 두 번째 방식의 경우, 사용자는 버튼을 눌러 놓고 다른 일을 할 수 있다. 노란색 물감이 도착하면, 그 때 물감을 필요한 곳에 사용한다.

내가 알는 한, 지메일에 처음으로 Ajax 기술이 전면 적용되었다. 지메일이 세상에 등장하기 전을 회상해보자. 이메일을 모두 작성하고, “보내기”를 누르고 나면 이메일이 전송된 후 새로운 화면이 뜰 때까지 기다려야 했다. 모든 과정이 동기화되어있기 때문에 모든 과정이 순차적으로 일어나는 것이다. 하지만 지메일에서는 “보내기”를 누른 후 기다릴 필요가 전혀 없다. 이메일을 보낸 후 다른 일을 있으면, 아래와 같이 이메일이 성공적으로 전송되었다는 메시지가 페이지의 맨 위에 뜬다. 만약 보내기에 실패하면 이를 알리고 다시 보낼 수 있도록 해준다.

sent
지메일에서, 이메일이 성공적으로 전송되면 화면에 뜨는 메시지

Ajax 기술이 훌륭하게 사용된 또 다른 사례는 주소창이다. 지메일에서는 상대방 주소를 타이핑하기 시작하는 순간 그 단어로 시작되는 주소가 추천된다. 예를 들어서, “al”을 타이핑하면 주소 중에 “al”이 포함된 사람들이 모두 표시된다.

lookup
주소창에 이름을 타이핑하기 시작하면 즉시 그 글자가 포함된 이메일 주소를 추천해준다.

지금은 너무 당연하게 생각되는, 널리 사용되는 기술이지만, 당시에는 데스크탑 애플리케이션에서나 찾아볼 수 있는 매우 혁신적인 기술이었다. 그 전에는 이러한 주소 자동 완성 기능을 사용하고 싶다면 데스크탑 애플리케이션인 마이크로소프트 아웃룩을 이용해야만 했다. 웹 메일에서는 불편하게 써야 한다는 것을 당연하게 여겼다. 하지만, 지메일의 등장으로 웹에서도 마치 아웃룩에서처럼 편리하게 사용할 수 있게 된 것이다.

이러한 기술이 지메일에 처음 등장한 것은 아니지만, 지메일에서 훌륭하게 쓰이는 것을 보고 많은 사람들이 도입해서 사용하기 시작했다. 사실, Ajax라는 용어도 지메일이 성공한 이후에 생긴 것이다.

지메일의 창시자, 폴 부크하이트
지메일의 창시자, 폴 부크하이트

이 기술 뒤에는 구글에서 지메일을 처음 만든 폴 부크하이트(Paul Buchheit)가 있다. 구글의 23번째 직원이었고, 구글의 모토는 “Don’t be evil”이 되어야 한다는 말을 처음 했던 그는, 예전부터 이메일에 관심이 많았다. 하지만 검색 엔진이 전문 분야인 회사에서 인터넷 이메일을 만든다는 것이 쉬운 일을 아니었다. 어쨌든 그는 종류의 이메일을 만들고 싶어했고, 보다 사용하기 편리한 이메일 서비스를 만들고 싶어했다. 책 “Founders At Work“를 보면, 그가 어떤 계기로 지메일을 만들게 되었는지 설명이 되어 있다.

1996년. 핫메일(Hotmail)이 등장하기 전이었지요. 이메일을 확인하려면 꼭 기숙사에 돌아가서 접속해야 했어요. 말이 안된다고 생각했어요. 웹 기반 이메일이 등장해야 한다고 생각했죠. 그래서 제가 하나 만들어봤었어요. 우연히도 그 이름이 Gmail이었죠. 구글에서 만든 Gmail과는 관련이 없었어요. 시간이 지나고, 구글에서 일을 시작한 후에 구글 그룹스 프로젝트를 마친 후였어요. 이메일을 만들어보고 싶어 구글 그룹스에서 썼던 코드를 사용해서 혼자 작업하기 시작했어요. 특히 저에게는 검색 기능이 중요했어요. 당시 하루에 500개나 되는 이메일을 받고 있었거든요. 첫 Gmail은 하루만에 만들었는데, 그걸 동료들에게 보여줬더니 검색 기능이 유용해보인다고 하더군요. 그래서 개선하기 시작했어요.

당시에도 자바스크립트는 다양하게 사용되고 있었지만, 간단한 작업을 하는 정도였지, 이메일같은 복잡한 곳에 쓰이지는 않고 있었다. 자바스크립트를 많이 쓰게 되면 처음 로딩하는 시간이 길어져 적합하지 않다고 생각했기 때문이다. 하지만, 그는 인터넷 속도가 빨라지면서 그 문제는 곧 해결될 것이라고 예상했고, 그의 예상은 적중했다. 사람들은 처음 로딩에 시간이 조금 걸리긴 하지만 일단 로드가 끝나면 너무나 쾌적한 지메일을 좋아했고, 나 역시 그 이후로는 줄곧 지메일만 사용하고 있다.

Ajax 기술을 본격 도입한 이러한 공헌 때문에 사람들은 폴 부크하이트가 Web 2.0 시대를 열었다고 한다. 실제로 많은 웹사이트가 그 이후 달라졌고, Ajax 기술은 구글맵, 구글 캘린더, 구글 리더 등 거의 대부분의 구글 제품에 많이 사용되고 있다.

등장한 지 10년이 되어 가고, 셀 수 없이 많은 웹사이트에 널리 사용되고 있는 기술이지만, 어찌된 이유인지 한국의 웹사이트에서는 거의 적용이 되지 않고 있거나 제한적으로만 적용되고 있는 듯하다. 이유야 여러 가지 있겠지만, 한국에서는 인터넷 속도가 너무 빨라서 매번 페이지 전체를 불러오더라도 느리다는 것을 인식하지 못해서인 것 같기도 하다. 그럼에도 불구하고 불편한 것은 사실이다. 그런 사이트를 방문할 때마다 참 답답하고 귀찮다. 보다 널리 적용되어 쾌적한 경험을 주게 되면 좋겠다.