저는 전공상 홈페이지를 만들어야한다는 사람을 꽤 자주 접하게 되는데 대부분 홈페이지가 어떻게 구성되는 지 알지 못하기에 계속 중복되는 설명을 하게 되더군요. 이번 글에선 그 중복되는 이야기를 정리해볼까 합니다.

※ 이 글은 비전공자들을 구독대상으로 작성되었습니다.

홈페이지는 어떻게 만들지?

홈페이지를 어떻게 만들지도 모르는 사람이 홈페이지를 공부해서 처음부터 만들어 나가는 것은 너무나도 고된 일입니다. 기술이 발전하면서 쉬운 저작 도구도 많이 나온게 사실이지만 그에 비해 현대의 웹은 너무 많이 발전해버렸습니다. 더군다나 사용자의 요구사항과 눈높이도 덩달아 올라가서 처음 배운 사람이 어느정도 만들 즈음이면 지금까지 만든 홈페이지는 이미 필요 없는 상황이 되어 있을겁니다.

홈페이지는 기본적으로 눈에 보이는 것(글, 그림, 동영상 등)을 웹 게시물의 형태로 구조화한 것을 서버에서 전송해주는 것입니다. 따라서 홈페이지를 만드려면 "눈에 보이는 것"에 해당하는 사이트 콘텐츠와 그 내용을 어떻게 구조화 할 것인가에 대한 스토리보드, 그리고 서버개발적 요소들이 필요합니다.

사이트 콘텐츠와 스토리 보드

홈페이지에서 무슨 이야기를 할 것인가 하는 부분입니다.

상당수의 사람들이 막상 이야기를 들어보면 홈페이지가 필요하다는 생각만 할 뿐, 홈페이지에 무엇을 넣어서 사용자에게 무엇을 보여주고 싶은지 구체화를 안해보는 경우가 많습니다.

여러분이 스스로도 구체화하지 못하는 모호한 상상을 마법같이 만들어주는 도구나 기술자는 이 세상에 없습니다.

일단 기본 기획이 나오지 않으면 디자이너도, 개발자도 아무것도 할 수 없습니다. 일단 어떤 사이트가 필요한지, 어떤 내용을 고객에게 어떻게 전달할 것인지를 고민해보세요.

실제 제가 최근에 겪은 예를 들면 이런 아이디어가 나올 수 있습니다.

"나는 우리 학원 홈페이지를 만들 것이다."

하지만 이것만으로는 목적을 알 수 없습니다. 저는 이 고객과 긴 시간 대화를 해보면서 다음과 같은 정보를 얻어냈습니다.

"네이버에 검색했을 때 잘 나오면 좋겠어."1

"따뜻하고 원생을 잘 챙겨주는 이미지의 학원임을 어필하고 싶어"

"젊은 학원"

"학원생에게만 제공되는 영상 강의 서비스가 필요해"

어떤 홈페이지가 필요한지 좀 더 구체적이게 되었습니다. 하지만 아직 기능적인 부분은 알 수 없습니다. 조금 더 구체적으로 들어가보도록 하겠습니다.

1. 학원의 이미지를 어필하고 싶다.

학원의 이미지를 어필하려면 학원 소개가 필요합니다. 학원 소개를 어떻게 하느냐에 따라 학원의 이미지가 달라질 것입니다. 이런 내용은 일단 기본적인 내용의 틀을 학원 주인이 정해서 준 다음 작문에 소질이 있는 사람이 교정하는 것이 좋겠죠.

2. 젊은 학원

역시 학원 소개가 필요합니다. 저는 여기에 추가로 원장 소개교사 소개를 제안했습니다. 실제로 교사진에 대한 정보를 제공하면 더욱 방문자의 신뢰를 얻을 수 있을테니까요.

3. 동영상 강의를 제공하고 싶다.

상당히 중요한 기능입니다. 이런 부분을 언급하지 않고 홈페이지 제작을 의뢰했다간 큰 낭패를 보게 됩니다. 왜냐하면 단순히 학원 홍보를 하는 사이트와 동영상 강의를 하는 사이트는 다르기 때문입니다. 의뢰자 입장에서는 사소하다고 생각하는 기능이 엄청난 변수가 될 수 있습니다.

이런 기능은 대체적으로 부가적인 문제를 포함하는 경우가 많습니다. 가령 이 사이트의 경우엔 학원 원생만 영상을 볼 수 있어야 하고, 관리자가 영상을 올릴 수 있어야 하므로 회원 시스템과 등급 시스템이 반드시 필요합니다. 영상이 자동으로 올라갈 리 없으므로 영상을 처리해주는 서버단 프로그램도 필요합니다.

4. 검색에 잘 나왔으면 좋겠다

이 문제는 좀 심각한 주제입니다. 뒤에서 설명하겠습니다.

요약

단순히 "학원 홈페이지" 라는 이름이었지만, 뚜껑을 열어보니 생각보다 많은 상세 사항들이 나오게 됩니다. 이런 사항들을 알려주지 않으면 디자이너도, 개발자도 아무것도 할 수 없습니다.

방문자 타게팅

홈페이지 방문자는 어떤 컴퓨터를 쓰고 있을까요? 어떤 사람은 Windows 7에서 Internet Explorer 10으로 접속할 수도 있고, 어떤 사람은 비전공자는 들어보지도 못했을만한 프로그램으로 접속할 수도 있습니다.

홈페이지 개발에 있어서 모든 사용자를 지원하는 것은 사실상 불가능에 가깝습니다. 왜냐하면 Microsoft사의 Internet Explorer이 다른 브라우저에 비해 너무나도 열악하기 때문입니다. 웹 개발에 있어서 최신 기술들은 대부분 Internet Explorer를 포기했습니다. 왜냐하면 이미 Microsoft도 IE를 포기하고 Edge라는 새 브라우저를 만들었을 정도니까요.

하지만 국내 사용자들은 아직도 IE를 가장 많이 사용하고 있습니다. 그렇기에 적절한 절충선이 필요한데, Windows XP를 사용하는 경우엔 IE 6~8 버전대를, Windows 7을 사용하는 경우엔 IE 8~11 버전대를 사용합니다. 국내의 Windows XP 점유율은 아직도 높은 편이지만 PC방 등의 환경들은 대부분 Windows 7 이상을 채택한 상황입니다.

방문자들이 어떤 환경에서 접속할 지 대략적인 자료가 있어야 범위를 좁힐 수 있습니다. 그래야 사용할 수 있는 기능을 추스릴 수 있기 때문입니다.

디자인적 요소

홈페이지의 모양은 자동으로 만들어지는 것이 아닙니다. 디자이너의 손을 거쳐서 만들어지는 것이죠. 디자이너를 통해 UI(사용자 인터페이스)와 UX(사용자 경험)을 구성해야합니다.

홈페이지 개발에서 많은 분들이 오해하는 부분 중 하나는 홈페이지에 들어가는 리소스입니다. 이미지나 동영상, 글꼴 등은 모두 저작권자가 존재하고, 저작권자 저작권을 행사할 수 있습니다. 따라서 합법적으로 돈을 주고 사용하는 것이 맞습니다.

이는 홈페이지 개발 단계 뿐만 아니라 홈페이지 개발 후에 운영시에도 적용되는 문제입니다. 홈페이지를 운영하는데 삽입한 이미지에 구입하지 않은 폰트가 사용되었다던가 하면 그로 인한 저작권 싸움에 휘말릴 것입니다.

개발적 요소

홈페이지는 그냥 보이는게 아닙니다. 보여지게 구성해야 비로소 보여지는 것입니다. 우리가 보기에는 매우 단순한 기능들이지만 사실 홈페이지로 만드려면 매우 힘든 문제가 되는 경우도 많습니다. 이러한 부분들은 결국 개발자가 개발을 해야하고, 다른 사람에게 맞기게 되면 그에 따른 비용이 발생합니다.

개발에는 돈만 드는 것이 아니라 시간이 듭니다. 당연히 작업의 난이도와 투입되는 개발자의 실력, 수에 영향을 받습니다. 하지만 그 중에는 개발자를 아무리 많이 투입해도 1명이 할 때와 진행 속도에 별 도움이 안되는 경우도 있습니다. 산모가 10명 있다고 아이가 한 달 만에 나오진 않습니다.2

홈페이지 제작에서 개발을 하게 되는 부분은 크게 두 가지인데, 사용자에게 직접적으로 보여지는 부분과, 서버단에서 돌아가는 부분입니다. 후자의 경우는 사용자 눈에 바로 보여지지 않기 때문에 개발을 하지 않고 있는 것이 아니냐며 항의하는 경우도 많이 봤습니다. 하지만 그쪽 개발이 안되면 결국 사이트가 돌아가지도 못하는 경우가 허다하므로 중도 해약등은 하지 않는게 좋습니다.

서버와 도메인, 인증서

기본적으로 서버는 컴퓨터입니다. 홈페이지용 서버는 누가 접근하려고 해도 24시간 켜져있는 컴퓨터여야 합니다. 그리고 서버에는 서버용 프로그램들이 설치되어야 합니다. 그렇기 때문에 비전공자들이 관리하기에는 무리가 있기때문에 대부분 임대를 합니다. 대체적으로 서버의 일부만 빌려서 웹 전용으로만 쓰는 웹 호스팅과 그 외의 경우를 위한 서버 호스팅으로 나뉘는 편입니다.3 서버 임대도 물론 돈이 듭니다.

서버만 있다고 되는 것은 아니고 도메인도 필요합니다. 서버를 실제 건물을 지을 수 있는 땅이라고 하자면 도메인은 해당 땅에 부여되는 주소입니다. 홈페이지를 만드는 것은 그 땅(서버)위에 건물을 짓는 것 같은 작업인 것이죠4 이 역시 연단위로 임대를 해야합니다. 이 부분은 대행을 맞기지 않는 한 직접 해야하는 부분입니다. 도메인 주소는 생각보다 중요한 요소인데, 짧고 기억하기 좋으며 인상적인 주소가 좋습니다.

그리고 또 한가지 변수가 있다면 인증서입니다. 개인정보를 취급하는 홈페이지를 위해 사용자와 홈페이지 사이의 통신을 암호화하는데에 필요합니다. 국내 사이트라면 국내법 상 개인정보를 취급하는 사이트라면 무조건 필요하고, 해외 사이트도 인증서를 사용하는 추세입니다. 인증서는 인증 기관의 신뢰도에 따라 가격이 더 비싸며, 역시 연단위로 갱신이 필요합니다.

검색에 잘 나오기

대부분의 사람들이 홈페이지를 들어오는 출입문이 되는 것이 바로 검색엔진입니다. 따라서 검색엔진에 검색했을 때 잘 나와야 홈페이지가 의미있게 되는 경우가 많습니다.

국내의 경우엔 거의 대부분의 사람들이 검색을 네이버에서 합니다. 그리고 네이버는 외부 자료의 추적력이 약한 검색 엔진이지요. 따라서 네이버는 외부 자료를 직접 수집하는 대신 키워드 광고라는 시스템을 채택했습니다. 간단히 말하면 비싼 돈을 주면 검색했을 때 사람들이 잘 보는 자리에 자신의 사이트가 나오게 해주는 것입니다. 키워드 광고는 키워드에따라 단가가 다르다고 알고 있습니다. 보다 사람들이 자주 찾는 검색어는 그만큼 가격도 상승하겠죠.

해외의 경우엔 구글의 점유율이 높은 편입니다. 구글도 키워드 광고가 있긴 하지만 구글은 외부 자료를 적극적으로 활용하는 편입니다. 구글에 잘 나오기 위해선 구글을 위한 전략이 필요합니다. 이러한 전략을 검색 엔진 최적화(Search Engine Optimization)이라고 합니다.

홈페이지는 누구 것인가?

이렇게 개발한 홈페이지는 누구 것일까요? 여러분의 것이라고 생각하실텐데 일부분에 대해서는 아닐 수도 있습니다. 몇몇 제작사들은 홈페이지를 제작해서 고객에게 전달하는 것이 아닌 개발 후 임대를 해주곤 합니다. 이런 경우에는 나중에 홈페이지 서버를 옮기거나, 직접 서비스 코드에 무언가를 추가하고 싶어도 마음대로 할 수 없게 됩니다. 하지만 임대형도 나름의 장점이 존재하므로 적절한 선택이 필요합니다.

또한, 소유권이 자신에게 있다는 것은 책임소재 또한 자신에게 있음을 의미합니다. 자신의 사이트에 저작권법에 저촉되는 이미지 등이 사용된다던가 하는 경우엔 그 책임은 사이트의 주인이 지게 됩니다.

더 고민해볼 만한 요소

  • 보안 (고객 고유정보는 어떻게 관리하지?)
  • 소스 (내 홈페이지의 소스를 내가 관리할 수 있을까?)
  • 확장성 (내 홈페이지에 나중에 기능을 추가하는 것이 가능할까?)
  • 가용성 (내 홈페이지는 손님이 늘어나도 괜찮을까?)

이렇게 홈페이지 개발에 있어서 알아야할 아주 기초적인 부분들에 대해 알아보았습니다. 이 글에선 실제 개발을 어떻게 하는지 등에 대한 정보는 다루지 않았는데, 이 글은 어디까지나 비전공자를 대상으로 하는 글입니다.

그리고 이 글을 쓴 작성자는 Snoin이란 팀에 속해있고, Snoin은 웹 개발을 전문적으로 담당하고 있습니다. 실제 개발 의뢰에 대한 문의가 있으신 분은 http://snoin.com 으로 문의주시면 감사하겠습니다.


  1. 이 문제는 좀 더 뒷 단락에서 상세히 설명합니다.

  2. 맨먼스 미신의 명언 중 하나죠

  3. 그 외에도 많은 방식이 존재합니다.

  4. 하지만 홈페이지 개발을 포함한 모든 프로그램 개발은 건축과는 다른 메타포를 갖습니다.