워드프레스 컨디셔널 태그 – WordPress Conditional tag

워드프레스에서는 Conditional Tag – 컨디셔널 태그라고 상황에 따라 화면에 노출되는 내용을 제어해주는 기능이 있습니다. 먼저 제가 겪은 상황을 하나 예를 들어보겠습니다.

CASE – 구글 애드센스 광고 삽입과 관련된 문제

구글애드센스 광고를 손쉽게 삽입해줄 수 있는 easy adsense 라는 플러그인을 사용하고 있었습니다. 워드프레스는 플러그인이 운영을 편리하게 도와주지만, 플러그인이 많을수록 사이트가 무겁고 느려집니다. 웹브라우저에 보여지기까지 이것저것 불러들어야할 것들이 많아진다는 이야기죠.

하지만 구글 애드센스 광고를 굳이 그렇게까지 플러그인에 의존해서 과한 로딩을 만들어주고 싶지 않아서 직접 코드를 삽입하기로 했습니다. 그런데 문제가 생겼습니다. 테마에 따라 다르게 설정되어있습니다만, 워드프레스 상에서 TwentySeventeen 테마의 single.php 기본 코드를 확인해보면 아래와 같은 구문이 발견됩니다.

content라는 템플릿을 호출해서 사용한다는 이야기인데요. 해당 템플릿 파일은 themes/twentyseventeen/template-parts/post/content.php  이런 경로를 타고 가서 필요한 내용을 불러다 쓰게 만들어져 있습니다.

대략적으로 구조를 단순하게 파악하자면 아래와 같이 이해할 수 있습니다.

그래서 본문에 구글 애드센스 소스코드를 삽입하면, 아래와 같이 정상적으로 글 상단에 연금저축과 관련된 광고가 노출되는 구글애드센스가 삽입된게 보입니다.

구글애드센스

본문에서는 원하는 위치에 제대로 삽입된것이 확인됩니다.

그런데 문제는 목록화면에서도 제가 삽입한 구글 애드센스 코드가 노출된다는겁니다. 바로 아래사진처럼 말이죠.

구글애드센스

제목과 섬네일이미지와 구글애드센스가 죄다 뒤섞여있는 총체적인 난국입니다.

제가 원하는건 그저 본문 상단과 하단에 노출되는 것인데, 이렇게 컨텐츠를 죄다 가리는 상황을 바라는건 아니었습니다. 그래서 이 상황을 어떻게 해결해야하나 보니 컨디셔널 태그를 활용하면 된다는 답을 얻었습니다. 역시 구글.

컨디셔널 태그 Conditional Tag

컨디셔널 태그는 워드프레스 코덱스 페이지  에서 더 많은 상황을 제어할 수 있도록 소개하고 있지만, 저는 지금 첫 화면에서 보여지는 목록에서 구글애드센스가 뜨지 않도록 하고 싶은 상황이기 때문에 is_home() 과 is_front_page() 컨디셔널 태그를 활용하기로 했습니다. is_front_page() 만 사용해도 해결이 되는 상황입니다만, 블로그 페이지를 따로 보여질 상황을 위해서 is_home() 까지 설정해주는 것이 권장되는 상황입니다.

보통 첫화면 에서 is_home() 과 is_front_page()를 동시에 사용할 경우엔 아래와 같은 방식으로 사용됩니다.

위의  php 코드 내용은 이런 뜻입니다 “만약에 첫 화면(정적인페이지,최근글) 그리고 블로그 화면 이라면 수행해야할 명령” 그런데 제가 하고 싶은건 첫화면이나 블로그 화면이라면 하지마! 라는 명령을 하고 싶은 상황입니다. 그런 경우엔 아래처럼 사용해야합니다.

차이점은 느낌표가 앞에 들어간 겁니다. 보통 프로그래밍을 배울때 if문을 배울때 느낌표가 앞에 들어가면 not이라는 의미라고 설명합니다만, 저는 이해가 잘 안가더군요. 그래서 그냥 이해하기 쉽게 이야기하자면 저런 상황에서는 이런걸 하지말라는 의미로 쓰는겁니다.

그래서 위의 컨디셔널 태그를 활용해서 구글 애드센스가 첫화면에서는 보여지지 말라고, 느낌표를 붙여서 소스 코드를 삽입해주었더니 정상적으로 작동하게 됐습니다.그 결과는 아래와 같습니다.

애드센스

지저분하게 구글애드센스가 목록에 노출되지 않게 되었습니다

  1. 워드프레스란
  2. 워드프레스의 용도
  3. 워드프레스를 사용하는 두 가지 방법
    1. 로컬 설치
    2. 서버/호스팅 설치
  4. 워드프레스를 더욱 유용하게 해주는 것들

워드프레스란

워드프레스 – WordPress는 CMS입니다. Contents Management System – 컨텐츠 관리 시스템이라고 합니다만, 쉽게 생각하면 워드프레스 자체가 블로그에서 시작되었다는 점을 들어 ‘글을 효율적으로 관리해주는 프로그램’이라고 생각하면 좋습니다.

블로그를 장기간 운용하다보면 수천개의 글들과 그에 따른 미디어 파일들도 수 없이 많이 늘어나기 마련인데요. 이러한 부분들을 손쉽게 관리해줄 필요가 있기 때문에 생겨났다고 볼 수 있겠죠. 다만 윈도우나 맥 같은 OS에서 돌아가는 소프트웨어가 아니라 서버/호스팅에 설치해서 사용하는 웹 응용소프트웨어입니다.

워드프레스의 용도

워드프레스가 블로그에서 시작되었지만, 오픈 소스로 공개되어 운용되다보니 많은 사람들이 직접 필요한 기능들을 덧붙이기 시작했고, 이러한 기능들 또한 무료로 많이 공개되었습니다. 그러다보니 점차 사용자가 늘어나고 사용자들이 직접 참여해서 만들어가는 형태가 되서 더더욱 효율적인 면모로 거듭나는 선순환 구조가 성립됐습니다.

이러한 강력한 생태계가 성립된 덕분에 워드프레스는 다양한 용도로 뻗어나갈 수 있게 되었습니다. 플러그인이라고 불리는 추가 기능들을 가져다 설치하면 워드프레스는 쇼핑몰이 될 수도 있고, 커뮤니티가 될 수도 있고, 갤러리/포트폴리오 사이트로 변신할 수도 있습니다. 기업 홍보용 홈페이지는 물론이고, 언론사 홈페이지로 활용되는 사례도 있습니다.

www.news-y.co.kr www.news-y.co.kr

하지만 워드프레스가 만능은 아닙니다. 어디까지나 기본은 블로그에서 시작되었기때문에, 쇼핑몰 기능을 이용했을때 장기적인 측면에서 봤을때 국내 솔루션들에 비해서 부족한 기능들이 많아서 필요한 기능들을 구현하기 위해서는 개발자 없이는 어려운 실정입니다. 추가적인 기능을 지나치게 많이 추가하면 사이트가 무거워져서 로딩이 오래 걸리거는 문제도 발생할 수 있음을 간과할 수 없습니다.

그럼에도 불구하고 전세계의 25% 가량의 웹사이트가 워드프레스로 만들어지는 이유는 10이라는 목표에 도달하기 위해 1부터 시작하지 않고, 적어도 4~5에서 시작할 수 있기때문에 상대적으로 가벼운 접근성에서 그 장점을 찾아볼 수 있습니다.

특별한 기능 추가가 필요하지 않다면, 이미 만들어진 기능 안에서 디자인 정도는 HTML/CSS에 대한 기술을 가진 디자이너 혼자서도 충분히 활용 가능한 수준이기 때문입니다.

워드프레스를 사용하는 두 가지 방법

워드프레스는 보통 설치형 블로그라고 알려져 있습니다만, 네이버 블로그나 텀블러, 블로거처럼 가입하면 바로 사용할 수 있는 가입형 블로그 서비스도 제공되고 있습니다.

워드프레스 닷컴에서는 가입형 서비스를 제공하고 있기때문에 가입과 동시에 무료로 블로그를 이용할 수 있긴 합니다만, 추가적인 기능을 추가하거나 테마 (스킨)을 바꾸기 위해서는 추가적인 사용요금이 발생할 수 있습니다.

기본적으로 주어지는 기능과 무료 테마로도 충분히 이용은 가능합니다만, 입맛대로 고쳐쓰려면 돈이 드는 셈이죠.

워드프레스 org 에서는 워드프레스 웹 응용소프트웨어를 다운로드 받을 수 있습니다. 서버에서 직접 압축해제 할 수 있는 tar.gz 파일이나 하드에서 압축을 풀 수 있는 zip 파일로 제공됩니다. 이 말은 가입해서 사용하는게 아니라 직접 서버나 호스팅에 설치해야 사용이 가능하다는 이야기입니다.

설치형 워드프레스 로컬 설치

위의 방법은 워드프레스를 내 컴퓨터에 설치해서 어떻게 돌아가는지 확인해볼 수 있는 방법입니다. 추가적인 비용이 필요하지 않고, 실제로 워드프레스가 어떻게 작동하는지 공부하기 좋은 방법입니다. 하지만 특별한 설정 없이는 외부에서 내가 만든 워드프레스 사이트를 접속할 수 없기때문에 특별히 개발이나 공부 용도로 사용하기에 좋은 방법입니다. 위의 튜토리얼에서는 오토셋을 활용한 방법을 보여주고 있습니다만, WAMP1 나 APM2  이나 어떤 방법이건 PHP 웹서버를 구축할 수 있는 방법이라면 상관 없습니다.

맥에서도 물론 사용이 가능합니다. WAMP나 MAMP나 이미 눈치 채셨겠지만, 모두 앞글자가 OS를 이야기하는 것이죠. 리눅스에서도 LAMP를 이용해서 설치할 수 있습니다. 관련 컨텐츠는 제가 얼마전에 작성한 포스트를 참고하시면 도움이 될 것입니다.

설치형 워드프레스 호스팅 설치

해당 튜토리얼에서는 닷홈을 이용한 설치를 안내하고 있습니다만, 유료호스팅이라고 할지라도 대부분 방법이 유사합니다. 카페24와 같이 사용자가 많은 호스팅들은 더욱 간편하게 워드프레스를  버튼하나로 설치할 수 있는 옵션을 제공하기도 합니다.  하지만 별도로 하위 폴더를 생성하고 설치하는 경우도 있기때문에 직접 설치하는 방법을 추천하고 싶습니다.

설치과정을 간략하게 요약하자면 아래와 같습니다.

  1. wordpress.org 에서 워드프레스 압축파일을 받아서 압축을 풀어 놓는다.
  2. ftp 접속을 통해 (ftp 접속 관련정보는 호스팅마다 별도로 제공하고 있는 내용을 참고합니다) 압축이 풀린 파일들을 올립니다.
  3. 업로드가 끝나면 해당 도메인으로 접속합니다.
  4. 설치화면에서 요구되는 내용(은 호스팅에서 제공되는 정보를 참고해서 입력합니다.

위의 단계를 통해서 설치가 완료되기때문에 적절한 데이터를 입력하는 것만으로 간단하게 끝납니다.

워드프레스를 더욱 유용하게 해주는 것들

워드프레스를 더욱 효율적으로 사용하기 위해서는 플러그인이라는 외부기능들을 설치해 주어야 합니다. 아래에서는 워드프레스를 처음 설치하고 거의 필수적으로 설치해야할 플러그인들을 소개 하고 있습니다.

젯팩

젯팩은 워드프레스를 만든 매트 물렌웨그의 회사 automattic에서 제공하는 플러그인입니다. 자유로운 선택권을 주기 위해서인지 처음부터 설치되어있지는 않지만, 많은 사용자들이 거의 필수적으로 설치하고 있습니다. 관련 포스트 노출, 소셜 공유 기능 등 편리한 기능들을 제공하고 있습니다.


아키스멧

아키스멧 Akismet은 스팸 댓글들을 걸러주는 유용한 플러그인입니다. 이 플러그인도 필수로 추천되는 플러그인 입니다.


Yoast SEO

Yoast SEO 와 All in one SEO 두가지 플러그인이 거의 막상막하로 선호되고 있습니다만, 늘 All in one SEO를 쓰다가 바꿔봤는데 생각보다 만족스러워서 Yoast SEO를 활용하고 있습니다. SEO는 사이트 검색 노출에서 중요한 부분이기 때문에, 플러그인의 도움을 받는 것이 좋습니다.


Google XML Sitemaps

사이트맵을 만들어주는 플러그인입니다. 구글이나 네이버에 사이트맵을 제출할때 필요합니다. 사이트맵을 제출해야 검색결과에 수월하게 반영되기 때문에 이 플러그인도 필수적으로 설치하는 것이 좋습니다.


Updraft Plus WordPress Backup PlugIn

백업 플러그인은 갑작스레 워드프레스 사이트가 망가졌을 경우 백업본을 이용해 되살릴 수 있도록 도와주는 플러그인입니다. 네이버 블로그와 같은 가입형 블로그와 다르게 워드프레스 설치형 블로그는 사용자가 직접 컨텐츠에 대해 보호하고 관리해줘야할 필요가 있습니다. 따라서 백업은 항상 중요하게 강조해도 모자라지 않습니다. 몇가지 설정을 통해서 구글 드라이브나 드롭박스 같은 클라우드에 스케쥴에 맞춰 자동으로 백업본을 저장해줄 수 있으므로 무척 편리하게 사용할 수 있습니다.


이 밖에도 유용한 플러그인들은 무척이나 많습니다만, 다짜고짜 좋다고 무작정 다 깔아놓다보면 사이트가 너무 무거워지기때문에 적절히 필요한 것들만 설치해주는 것이 좋습니다. 그리고 워드프레스가 업데이트 될때마다 플러그인들도 같이 업데이트가 되는데 제작자가 신경쓰지 않고 내팽겨쳐놓은 플러그인들도 있습니다.

이미 워드프레스에 기능이 삽입되서 더 이상 사용할 필요가 없어진 플러그인이거나 인기가 없는 플러그인들은 그렇게 사장되기도 하기 때문에, 잘못 설치하면 사이트가 마비되는 상황도 발생 할 수 있습니다. 따라서 가급적이면 사람들이 많이 이용하고, 최근에 나온 플러그인을 사용하는 것이 안전한 방법입니다.


  1. WAMP = Windows + Apache (서버) + MySQL(DB) + PHP(언어) 
  2. Apache (서버) + PHP(언어) + MySQL(DB) 

워드프레스 언더스트랩 – understrap 테마를 이용해서 새로운 테마를 만들고 있습니다. 먼저 언더스트랩 테마에 대해서 간략하게 소개하자면, 워드프레스의 아버지 매트 뮬렌웨그에 의해 설립된 오토매틱에서 제공하는 언더스코어에 부트스트랩을 입힌 테마입니다. 언더스트랩은 자식테마도 미리 준비해두어 더욱 편리하게 사용할 수 있도록 준비해두고 있는데요.

마침 css 전처리기인 sass와 node.js 환경에서 gulp를 통해 scss 컴파일과 브라우저 싱크 – 소스 파일을 변경해서 저장할때마다 브라우저를 자동으로 새로고침해주는 기능을 사용할 수 있도록 제공하고 있어서 해당 기술들을 공부할 겸 실험적으로 만들어보고 있습니다.

저는 지금까지 워드프레스 자식테마를 이용할때는 style.css와 function.php 파일을 복사해두고 주로 css 파일만 수정하는 식으로 사용해왔습니다. 부득이하게 기능적으로 추가/삭제를 할 경우엔 header, sidebar, footer, single.php 파일들을 가져다가 override-덮어 씌우는 식으로 사용했는데 최근 테마들은 partial-부분화를 통해서 구성되다 보니 위에 나열한 php 파일들을 수정해서는 해결이 안되는 상황들이 발생합니다.

single.php안에 구성되는 내용들을 보면 메타 정보나 댓글, 포스트 내용등을 호출할때 해당 파일안에서 모두 함수를 구현해두는게 아니라 1차 하위 템플릿 폴더 (loop-template)안의 content-single.php 파일을 함수를 호출하고 그 안에서 또 별개의 1차 하위폴더(inc)에서  template-tag.php의 함수를 호출해서 불러다 쓰는 경우엔 단순히 하위폴더를 통채로 복사해 가져와서 자식테마에 override – 덮어씌우는 방식으로 진행하려 해도 적용이 되지 않더군요.

그래서 검색을 해보니 국내 사이트에서는 이러한 내용 에 대해서 심도있게 다루고 있는 사이트를 발견하지 못했습니다. 어쩔 수 없이 부족한 영어 실력으로 끙끙대며 찾아보니, 해외사이트에서는 이미 몇 년 전에 공개된 내용들을 보고 해결 할 수 있었습니다.

해법은 생각보다 간단합니다. 이런식으로 함수 부분들을 수정해야할 경우에는 자식테마의 function.php 에 동일한 함수를 재작성/수정을 통해 override 시켜야 내용이 반영됩니다.

이런 방식으로 자식테마의 function.php 파일을 통해 부모테마에서 적용되는 함수를 덮어 씌워버리면 우선권을 갖기때문에 부모테마가 업데이트되더라도 문제가 발생하지 않습니다.

공부해둔 것들을 기록하지 않으면 까먹는 사태가 빈번해서 정리하고 공유할 겸 포스팅하게 됐습니다. 비슷한 문제로 고민하시는 분들에게 도움에 되면 좋겠습니다.

네이버 블로그

네이버 블로그 스킨 제작에 대해서

네이버 블로그 스킨에서 제공하는 기능을 활용하면 배너를 삽입하는것은 물론이고 약간의 트릭을 이용해서 홈페이지처럼 보이게 만드는 것도 가능합니다. 기본적으로 HTML과 CSS에 대한 선행지식이 필요한 관계로 전혀 경험이 없다면, 따라하시는데 다소 생소한 표현때문에 어려움을 느낄 수도 있습니다. 그렇지만 최대한 설명을 덧붙여서 어려움을 덜어드리도록 노력해보겠습니다.

위젯 기능 활용

네이버 블로그 스킨은 위젯이라는 기능을 수 년 전부터 지원하고 있습니다. 하지만 여전히 베타상태로 놔두고 있는 이유는 보안이나 관리상의 이유가 크지 않나 싶은데요. 너무 많은 자유도를 허용하다 자바스크립트 범벅으로 난장판이 됐던 다음 카페의 선례가 있기 때문인가 싶습니다. 지금은 보안상의 이유로 대부분의 커뮤니티에서 스크립트 입력을 허용하지 않고 있습니다.

CSS 활용

네이버 블로그 스킨에서는 CSS도 무조건 인라인 형태로 서술되야합니다. 때문에 반복적으로 같은 내용을 필요로 할때 반복작업으로 인한 피로감이 좀 있습니다. 그리고 일부 태그들은 또 여전히 적용되지 않고 있는 문제도 있고, 네이버에서 임의로 다른 태그로 대체해서 적용하는 경우도 있기때문에, 약간의 시행착오를 감수해야합니다.

홈페이지 처럼 보이게 만드는 트릭

일단 네이버 블로그 스킨을 홈페이지 형태로 만드는 방식에 대해서 간단한 개요를 이야기하자면, 네이버 블로그 상단 부분에 배경이미지를 깔고, 그 위에 투명한 위젯을 올려서 원하는 형태로 버튼이나 배너 같은 요소들을 삽입합니다. 엄연히 이야기하자면, 위젯을 이용해서 레이아웃을 구성한다고 볼 수 있습니다.

테이블 태그 사용 지양

덧붙여서 아직도 테이블 태그를 활용하는 방법을 고수하는 네이버 블로그 스킨 강좌들이 있는데, 테이블 태그를 사용하는 것 자체는 크게 상관 없으나 만드는 사람 입장에서 불필요한 코드를 많이 사용해야합니다. 그리고 버튼이 한 두 개라면 모르겠지만, 많은 양의 버튼을 테이블 태그로 생성하게 되면 그만큼 많은 로딩 시간이 소요됩니다.

테이블 태그로 박스를 만들 경우와 div 태그로 각각 폭 170픽셀, 높이 600픽셀의 박스를 만들 경우를 각각 아래 예시에서 보여드리도록 하겠습니다.

같은 결과물을 보여주지만, 내부에서 돌아가는 모양새는 다릅니다. 한 눈에 보아도 태그의 양이 확연히 차이가 납니다. 테이블 태그는 브라우저가 해석할때 구조적으로 먼저 table을 찾고, tr로 행을 찾고, td로 열을 찾고 그 안에 내용을 불러오는 식이라 3번에 걸친 과정이 필요합니다. 그와 반대로 div 태그는 그냥 한 번에 내용을 불러올 수 있습니다. 버튼 하나 쯤이라면 큰 차이가 안느껴지겠지만, 버튼을 많이 만들수록 이 문제는 더 크게 다가올 수 있습니다.

때문에 위지윅 wyswyg 방식의 나모웹에디터,드림위버를 사용해서 웹사이트를 만들어봤던 분들은 다소 생소할 수 있습니다만, 따라 해보시다보면 어느 정도 이해가 갈 겁니다.

본 튜토리얼은 아래와 같은 과정을 걸쳐서 진행됩니다.

  1. 구상단계
  2. 디자인(포토샵)
  3. 디자인을 스킨에 적용하기(네이버 블로그 관리자 기능, HTML/CSS)
  4. 버튼을 클릭할 때마다 새창으로 뜨는 문제 해결하기
  5. 프롤로그 기능 활용
  6. 포스팅 영역을 활용해서 조금 더 홈페이지처럼 보이게 만들어보자
  7. 에필로그

덧붙여서 말씀드리자면, 본 튜토리얼을 통해 네이버 블로그에 대한 기능적 이해를 돕는데만 활용하시고, 가능하면 홈페이지형 블로그는 만들지 않으셨으면 좋겠습니다. 그 이유는 에필로그에서 설명드리겠습니다.

그래도 뭔가 단기간에 성취할 수 있는 방법이 있지 않을까요? 검색엔진최적화 같은 것도 있던데?

SEO(Search Engine Optimize 검색엔진최적화) 작업은 그냥 “나를 건너뛰지말고 뒷페이지라도 좋으니 꼭 목록에라도 올려주세요” 라고 검색엔진에 요청하는 작업일 뿐입니다. 물론 가이드라인은 있죠. 최소 몇 글자 이상 되는게 좋고, 이미지에는 꼭 alt 속성에 해당 이미지에 대한 키워드를 넣어주고 뭐 그런 기본적인 작업들 역시 상위 노출보다는 검색엔진에게 놓치지 말고 내 컨텐츠를 퍼가도록 편의를 제공하는 역할일 뿐입니다.

그러면 검색엔진마다 자체적으로 컨텐츠의 질을 가늠합니다. 담당자가 일일이 만져서 선정하는게 아니라 자동화된 프로그램이 컨텐츠를 일정한 룰에 기반하여 선정한다는거죠. 심지어 이 프로그램은 갈수록 진화합니다. 개발자도 아닌 컨텐츠 생산자가 그 내부 알고리즘까지 파악해서 검색엔진 입맛에 딱 맞는 결과를 도출한다? 사실상 불가능에 가깝습니다. 검색엔진최적화 라는 용어에 대해서 오해를 해선 안되는 이유가 바로 이런 겁니다.

그래서 주로 선택하는 방법이 많은 컨텐츠를 작성해서 양으로 승부하는겁니다. 내 서비스를 혼자서 홍보하자니 한계가 있죠? 그래서 댓가를 주고 리뷰를 작성하게 합니다. 네이버에 맛집 쓰레기 홍보성 글이 넘쳐나는 이유가 바로 이런겁니다. 근데 이 마저도 어느정도 홍보비를 투자한 분들이 누리는 부분입니다만, 대부분 사업 초기 창업자들은 그냥 서비스로 해주는줄 압니다. 당연하게도, 사람이 움직이고 시간이 소요되면 그게 다 비용으로 연결됩니다.

상위노출 저도 하고 싶습니다. 돈 벌고 싶어요.

참고로 저의 블로그를 이야기해보자면, 컨텐츠를 하나 만드는데 수시간씩 걸립니다. 그냥 광고성 글들이라면 뭐 알맹이 없는 이야기만 온갖 꾸밈어를 넣어서 재잘재잘 반복적으로 키워드를 넣고 이러쿵 저러쿵 늘어놓으면 되겠죠. 그나마도 이런 류의 컨텐츠는 점점 걸러내도록 검색엔진도 진화하고 있습니다. 점점 양보다 질을 중요하게 여기게 된거죠. 블로그 리뷰도 엄연히 블로그에 최적화 된 글쓰기에 필요한 능력이 개발되야하는 영역입니다.

이야기가 옆으로 많이 샜습니다만, 홈페이지 제작 그리고 상위노출에 대해서 오해를 많이 하시는 부분들이 많아서 이야기를 해야할 것 같다는 생각이 들었습니다. 절대 단기간에 이뤄지는 일들이 아니라는걸 꼭 명심하셔야되요. 하다못해 가게를 차리고 몇 년을 한 자리에서 꾸준히 장사해도 손님들이 들어오면서 하는 말이 “여기 이런데가 다 있었어?” 라면서 오는 사람들이 꼭 있습니다. 그만큼 사람들은 관심있는 것만 기억합니다. 수 년을 행인들이 그 길을 지나쳤고, 수 년간 한 자리에서 장사를 했음에도 행인들에게 관심이 없으면 그 가게는 없는 것과 마찬가지인거죠.

웹사이트도 똑같습니다.  하루에도 수 많은 웹사이트가 만들어지고 또 그것 못지 않게 많은 웹사이트가 사라집니다. 그 안에서도 서로 눈에 띄려고 애를 쓰고요. 제가 만들어드린 대부분의 블로그와 웹사이트 중 지금도 서비스를 유지하고 있는 곳 정말 한 손으로도 꼽을 정도입니다. (그다지 많이 만들지도 않았는데 이래요)

그게 제 잘못은 아니라고 확실히 말씀 드릴 수 있는 이유는, 디자이너는 디자인을 하는 사람이지 웹사이트를 홍보하는 사람이 아니기때문입니다. 디자이너의 역할은 사람들이 사이트에 들어왔을때 서비스를 시각적으로 얼마나 명확하게 전달해주느냐입니다. 홍보는 마케터가 하죠. 마케터는 시장을 분석하고 서비스를 그에 맞게 어떻게 전달할까 고민하는 사람들입니다. 디자인과 완전 분야가 다릅니다.

디자인 할 줄 아는 마케터

하지만 보통 마케터를 따로 고용해서 쓰지 않는 분들이 많습니다. 디자이너에게 마케팅까지 요구하죠. 그럼 디자이너는 둘 중 하나를 포기해야합니다. 디자인을 포기하던지 마케팅을 포기하던지. 근데 보통 사장님들은 당장 판매수가 급급하다고 마케팅에 주력할 것을 요구하니 대부분의 그런 상황에 처한 디자이너들이 디자인을 포기할 수 밖에 없습니다. 직함은 디자이너인데 하는 일은 마케팅인거죠. 어느샌가 사장님 시야에는 그냥 포토샵 할 줄 아는 마케터가 앉아있는 상황이 됩니다. 이게 또 적성에 맞으면 더할 나위없이 좋긴 합니다만, 흔치 않은 사례죠.

3편에서 이야기를 마무리 짓도록 하겠습니다.