문돌이를 멘붕시키는 URL의 세계
문돌이의 得tem 시리즈
"득템 (得tem)" 이란 어떤 형태로든지 통상적인 수준보다 좋은 아이템을 입수한 상황을 뜻하는 게임 용어를 말한다. 문돌이의 得tem 시리즈를 통해 개발자들에게 천대받고, 디자이너들에게 무시받으며 꾸역꾸역 "기획자"로서 삶을 사는 많은 문돌이들에게 유용할 만한 팁들을 하나씩 소개하고자 한다.
** 1화 보기 - 크롬 브라우저로 업무시간에 온라인쇼핑 대놓고 하는법
가끔 카톡같은 메신저에서 링크 공유할때 무지막지하게 생긴 아래와 같은 링크를 공유하는 문돌이들이 있다.
특히 쇼핑몰에서 발견한 아이템을 친구나 단톡방에 공유할때 주소창에 있는 URL을 여과없이 복붙하다 보니 저런 길다란 암호문처럼 생긴 URL이 채팅창을 도배하게 되는건데, 나같은 문돌이들이 URL의 세계에 대해 개념이 전무하다보니 벌어지는 일이다.
URL의 세계에 대해 어느정도 이해력이 생기면 온라인상에서 호구되는 길을 조금이나마 막을 수 있을 뿐 아니라, 우리가 부모님이나 애인보다 더 많이 끼고 살고 있는 이 인터넷 세상의 이해도가 한층 높아지기 때문에 오늘의 득템 시리즈에서는 이 URL이란 놈에 대해 우리 문돌이들이 꼭 알아야 할 내용만 발라내 보려고 한다.
1. URL이 뭔가요? --> www.로 시작하는거 아닌가요? --> 네, 일단 한대 맞고 시작할게요
사실 내 얘기다. 필자가 인터넷에 대한 지식이 1도 없던 순도 100% 문돌이 시절, URL이라는거는 의례 "www..."로 시작하는 인터넷 주소를 의미하는 거라고 알고 있었다. 먼 옛날 인터넷 관련 교양과목에서 팀 버너스리 경 이름 넉자는 들어봤고 www가 월드와이드웹의 약어라는 것만 기억했지, www는 그냥 인터넷 주소 치려면 항상 맨 앞에 붙이면 되는 이름표 같은거로 생각하던 문돌이였다.
www를 또 인터넷에 찾아보기 시작하면 아마 머리가 아득해 질거다. CERN에서 근무하던 팀버너스리가 HTML 형태로 만들어진 웹페이지들을 HTTP라는 약속된 형태로 서로 연결해 나가며, 누구나 새로운 웹페이지들을 만들고 기존 페이지들을 참조해 나가며 페이지들이 거미줄처럼 서로 얽히고 섥혀나가는 거대한 월드 와이드 웹이 어쩌고 저쩌고... 하는 설명이 수십페이지가 나온다.
세계 최초로 www에 업로드 된 사진이라는데, 팀 버너스리 같은 기관 CERN의 여직원들이 만든 코믹 밴드라고 한다. 다들 할머니가 되어계실듯 ㅎㅎ(출처 - http://upload.wikimedia.org/wikipedia/en/c/c0/Les_Horribles_Cernettes_in_1992.jpg)
결론은 우리가 보고 있는 이 웹의 세계가 수십년전 (1991년에 소개됐다고 하니 사실 30년남짓 밖에 안된 사건이다) 팀버너스 형님의 www 프로젝트에 의해 소개되다 보니 너나 나나 할거 없이 모두 www로 시작하는 호스트네임을 만들게 된것 뿐이지, www는 어디까지나 서브도메인의 하나일 뿐이다.
2. URL의 구조를 문돌이 방식으로 이해해 보자
지금 글은 쓰고있는 중이라 발행하진 않았지만, 이 글을 발행하게 되면 아마도 아래와 같은 URL을 가지게 될거다.
https://brunch.co.kr/@andrewyhc/118
이 주소를 보면 크게 4가지 구조로 이루어져 있다 --> 1) https:// + 2) brunch + 3) co.kr + 4) @andrewyhc/118
저렇게 구조를 나누는 이유가 뭔지를 지금부터 여자친구와 동거를 하게 되는 예시에 빗대어 설명해 보도록 하겠다 (혹시 URL 구조에 대해 이미 잘 알고 있는 분이라면 여긴 스킵하시고 바로 3번 섹션으로 이동바람).
1) https:// --> 여친과 뭘 어떻게 공유하는건지에 대한 약속을 표시하는 부분 --> 집? 전화번호? 차? .. 금고??
전문용어로 Scheme이라고 부르는 부분이고, 유식한 말로 뭘 어떻게 교환하는건지를 서로 약속한 프로토콜이라고 대다수의 인터넷 글에서 설명하는데, 쉽게 말해 여친과 동거하게 되는 상황에서 당신의 "어떤 대상물"을 공유하는것에 대해 미리 여친과 정해놓은 약속인 것인지를 나타내는 부분이다.
집에 대한 거면, 여친에게 "37°35'09.4"N 126°58'27.4"E에 위치한 내 집에 이 열쇠로 구멍에 쑤셔 넣고 왼쪽으로 175도 돌렸다가 오른쪽으로 35도 돌리면 딸칵! 하고 문이 열리게 되어있어"라고 미리 약속된 내용이 있는데, 이게 그 집열쇠에 대한 거다~~ 하고 알려주는 부분이라는 뜻이다.
http나 https (이 두개가 또 다른 내용인데, http가 맨처음 개발된 웹 프로토콜이고 https는 그 교환에 암호화 규약을 추가해서 더 안전하게 한다.. 이정도만 알고 있어도...)는 웹사이트에 대한 링크라는 거고, ftp라는것도 있는데 그건 웹페이지가 아닌 파일교환에 대한 프로토콜 (실제로 ftp:// 이렇게 시작한다), mailto라는건 이메일에 대한 프로토콜.. 등등이 있다.
2) brunch --> 우리집 주소는 37°35'09.4"N 126°58'27.4"E... 라고 알려주면 차일게 뻔하니 이름을 붙여서 알려주는 부분
모든 인터넷 사이트에는 해당 사이트의 리소스가 들어있는 (글, 이미지, 동영상 등등) 위치를 나타내는 고유의 주소가 존재하는데 이를 IP 주소라고 부르고, 202.131.30.11 이런식으로 생겼다. 우리 인간은 이런 무미건조한 숫자 조합따위는 부르기도 어렵고 기억하기도 곤란하기 때문에 이걸 부르고 기억하기 쉽게 이름을 붙여줄 수 있게 미리 약속해 놨는데, 그걸 바로 도메인 주소라고 한다.
여친한테 집 주소 알려줄때 위도 경도 좌표를 찍어서 알려주는 미친놈은 없을거고... 종로구 세종로에서 "청XX"를 찾으면 되~ 하고 이름을 붙여서 알려주는 부분이라는 뜻이다.
3) co.kr --> 우리집이 미국에 있는지, 서울에 있는지, 주거지인지, 회사인지, 상가건물인지 등에 대한 가장 기초적인 정보를 알려주는 부분
모든 도메인 맨 끝에 있는 .com .kr .gov .org .cc 등에 대한 부분인데 굳이 어려운 말로 최상위 도메인 (Top-level domain)이라고 부른다. com은 원래 미국 회사들이 쓰던건데 전 세계 누구나 쓰도록 풀려서 가장 유명한 TLD가 된거고, gov는 지금까지도 미국 정부 밖에 못쓰고 다른 나라 정부는 go를 쓴다고 나무 위키에서 설명하고 있다.
여친은 저 정보를 통해 대략적으로 우리집이 미국에 있는지, 아파트인지에 대한 내용을 파악할 수 있는데 사실 내가 "힐스테이트"라고 불리는 곳에 살고 있지만 알고보니 30년된 현대아파트건물에 도배를 새로 한 것일수도 있듯이, org를 쓴다고 이 주소가 꼭 기관용 주소인건 아니다.
4) @andrewyhc/118 --> 집 안에 있는 tv, 냉장고, 내 일기장 등등에 대한 경로
당신이 brunch.co.kr에 접속하면 수 많은 작가들의 글을 볼 수 있을텐데, 그 수 많은 작가들 중 내가 쓴 118번째 글로 연결해라~~ 하고 말해주는 부분이 바로 이 부분이고, 이걸 유식한 말로는 resource path라고 한다.
여친과 동거를 결심했는데 당연히 가재도구나 집 안의 모든 내용물에 대한 액세스 권한을 줘야 할것이 아닌가? 청소기는 어디있고, 내 일기장은 여기 있는데 열쇠로 잠겨있고, tv는 여기 있는데 내 어둠의 영상들은 비번이 걸려있고... 이런 세세한 내용들에 대한 링크들을 생성할 수 있다.
3. URL을 복잡하게 만드는 리소스 패스
사실 이 글의 본론은 여기부터이다. 서두에서 보여준 쇼핑몰의 세부 페이지 링크가 저렇게 덕지덕지 복잡해 지는 원인이 바로 이 리소스 패스라고 불리는 부분에서 발생한다. 이 부분을 이해하려면 웹사이트가 당신 브라우저에 보여지는 방식에 대한 아주 대략적인 공부가 필요하다.
1) 한개의 웹사이트에는 수십-수백개의 별도의 페이지가 맞물려 있고, 각 유저별, 상황별로 수십-수백가지의 경우의 수를 고려해서 디자인된다.
당신이 아마존에서 쇼핑하는 경우를 예로 들어서 살펴보겠다.
아마존에는 대략 상품이 6억개 이상이 등록되어 있다고 하는데 (4억개라는 곳도 있고... 정확한 통계는 확인하기 어렵다) 만일 이 6억개의 제품 관련 정보를 별도의 웹 페이지로 만들어서 아마존을 만든다면? 아마 그 아마존 사이트는 너무 복잡해서 사용이 불가능하게 될거다.
웹사이트를 돌아가게 만드는 가장 중요한 요소가 흔히들 db라고 부르는 데이터베이스인데, 아마존같은 쇼핑몰이라면 6억개의 상품 db (상품 이름, 이미지, 스펙, 내용....), 유저 db (유저 이름, 성별, 구매 이력 등등 너에대한 모든것), 기타 db (리뷰, 알림, 주문 등등) 등등 수없이 많은 db가 존재할 것이다.
한 개의 웹페이지라는 건, 해당 페이지를 접근하는 특정 유저의 특정 상황에서의 조건들을 통해 미리 저장된 db에서 필요한 내용들을 골라서 그때 그때 조합해서 보여주는걸 말한다. 예를들어, "홍길동"이라는 유저가 "미국"지역에서 "paper tablet"라는 검색어를 쳤고, 그중 "iskn"라는 제품을 클릭해서 보고 있는 페이지... 라는 정보들이 저 URL 리소스 패스에 모두 담겨지는 것이다.
홍길동씨가 어떤 경로로 iskn 태블릿 페이지에 도달했는지가 위 URL에 모두 담겨있다.물론, 실제 아마존의 리소스 패스는 이 외에도 당신의 과거 검색 패턴, 구매 이력, 시즌 정보, 프라임 유저 정보 등등 엄청나게 복잡한 경우의 수를 고려해서 구성되고, 그런 관계로 아래와 같은 어마무지한 링크가 만들어 진다.
위 링크에서 리소스 패스는 co.uk/ 뒤에부터 시작되는데, 저 타블렛 제품에 대한 정보가 저장된 파일에 대한 경로인 /iskn-Slate-Pencil-Graphic-Tablet/dp/B0751RBN9R, 그 뒤에 쿼리라고 불리는 /ref= 뒷 부분들이 내가 저 제품을 클릭하게 된 경로에 대한 다양한 정보를 호출해서, 그 상황에 필요한 정보를 웹 페이지에 리턴해 주는 URL이 된 것이다.
이 내용을 알게되면, 사실 친구한테 저 태블릿에 대한 링크를 공유할때 굳이 저걸 다 복붙 안하고 쿼리부분은 날려버린 https://www.amazon.co.uk/iskn-Slate-Pencil-Graphic-Tablet/dp/B0751RBN9R/ 주소만 공유해 주더라도 해당 제품에 대한 페이지가 동일하게 뜬다는 것을 알 수 있다.
2) 쿼리에는 당신을 호갱으로 만드는 다양한 입력값이 존재한다.
위 1)번 섹션에 있는 아마존 링크는 사실 내가 아마존UK 메인 페이지에 "The Technology of Tomorrow"라는 코너에 소개된 제품을 클릭했을때 나타난 URL인데, 내가 만일 검색창에 "paper tablet"이라는 검색어를 입력해서 제품들을 보다가 저 iskn The Slate 제품을 발견하고 들어온 페이지의 주소는 아래와 같이 달라진다.
저 암호문을 해독하자는 뜻은 아니고, 웹사이트가 (특히 쇼핑몰이) 당신이 해당 제품을 보게된 경로에 대해 어떤 식으로 파악하는 지에 대해 알아보자는 것에 의의가 있다. 1번 링크에 "?pf_rd_s=merchandised-search-3"라고 쓰여진 부분과, 2번 링크에 "?keywords=paper+tablet" 라고 쓰여진 부분에 주목하자. 1번링크의 저 부분이 바로 내가 메인 페이지에 소개된 섹션을 타고 들어온 유저라는걸, 2번 링크의 해당 부분이 내가 검색창에 paper tablet이라는 검색어를 쳐서 훑어보다가 들어온 유저라는걸 보여준다.
이 쿼리 구조를 이해하는게 중요한 이유는, 가끔 쇼핑몰들이 같은 제품에 대해 다른 경로로 접근한 유저에 대해 다른 가격 혹은 조건을 보여주는데에 있다. 인간은 합리적이지 못한 존재이기 때문에, 메인 페이지에서 에디터가 멋드러지게 소개한 태블릿 컨텐츠를 타고 들어온 사람의 기대가격대와 (1번 유저) 구체적인 경쟁 모델을 검토하는 와중에 해당 제품을 클릭한 사람의 기대가격대 (2번 유저)는 다를 것이다. 아마도 2번 유저의 기대 가격이 더 타이트할 수 있을텐데, 왜냐하면 1번 유저와 달리 2번 유저는 이미 다른 경쟁 모델, 더 저렴한 가격대의 제품들에 대한 정보가 더 있는 상태에서 해당 제품을 보고 있구나~ 하고 판단할 수 있기 때문이다.
저 제품의 가격은 109 파운드 인데, 만일 1번 유저의 기대가격은 110 - 130 파운드 정도, 2번 유저는 90 - 100 정도를 보고 있을거라고 예상할 경우 마케팅 담당자로서 2번 유저한테도 제품을 팔기 위해 한정된 사이트 프로모션 예산을 더 태워서 2번 유저한테만 갑자기 time deal을 띄워서 9파운드를 할인한 100파운드로 제품가격을 변경할 수 있다.
즉, 마케팅 담당자는 두명 모두에게 제품을 다른 가격으로 판매하면서 둘 다를 만족시키는게 가능한 거고, 아쉽지만 1번 고객은 호갱님이 되는 것이다.
같은 제품도 어떤 경로로 타고 들어갔는지에 따라 다른 가격을 보여주는 URL 쿼리의 마법..? 호갱님..?4. 제품 구매할때 반드시 해야하는 체크리스트
위와 같은 상황은 사실 쇼핑몰 뿐 아니라 항공권 구입, 숙박 예약 등등 수없이 많은 사이트에 존재하기 때문에, 저런 URL 구조에 대한 이해가 없으면 호갱되기 딱 좋은 세상에 우리는 살고 있다. 그나마 저런 단순 무식한 방법으로 URL 쿼리에 파라메터로 해당 유저 경로에 대한 정보를 알려주는 방식은 요즘 많이 쓰지 않고, 아래와 같은 내용들을 종합해서 더 지능적으로 이루어진다.
- 웹 브라우저 쿠키에 저장된 해당 고객의 제품 서칭 기록
- 로그인된 유저의 경우 해당 유저의 과거 구매 이력
- 프라임 유저일 경우 비슷한 프로필을 가진 유저가 딜 가격에 반응하는 확률 데이터
- 해당 고객의 리뷰 정보와 구매 결정간의 상관관계
...
자잘한 제품 구매하는거 아니라면 왠만하면 구매결정을 하기 전에 아래와 같은 내용을 꼭 돌려보고 가격이 변하는지 안변하는지를 체크해 보도록 하자.
1) 리소스 패스에서 제품 관련된 주소 외에 URL쿼리를 모두 삭제해보고 해당 페이지에 다시 들어가 보기
--> URL에 호갱님 유입 맥락을 파라메터로 넘겨주는 단순 무식한 방법을 쓰는 쇼핑몰의 경우 이것만 해봐도 가격 장난 치는걸 잡아낼 수 있다.
--> /? 로 시작되는 연결된 내용들이 보통 URL쿼리 부분인데, 가끔 해당 페이지를 띄우기 위한 필수 데이터 정보가 포함되는 경우가 있으니 무턱대고 다 지워버리면 안된다.
2) 브라우저 쿠키를 모두 삭제하고, 로그아웃한 상태에서 동일한 제품 페이지를 열어보기
--> 위에 말했듯이 쿠키에 해당 사이트 정보 뿐 아니라, 가끔 경쟁사이트 정보까지 읽어내서 이 호갱님의 기대가격선을 파악하려 드는 사이트들이 있다 (특히 항공권 사이트에서 많이 시도한다).
3) 크롬의 Incognito 모드를 적극 활용하자
--> 크롬 브라우저의 경우 File > New Incognito Window를 클릭하면 Incognito라고 불리는 창이 별도로 열린다. 이건 모든 쿠키/캐시를 초기화 한 브라우저 창을 여는 기능이다.
--> 해당 모드로 동일한 사이트를 열어보고 가격이 어떻게 되는지 확인해 보자.
4) 최저가격 경쟁사가 명확한 분야라면 해당 사이트에서 동일 제품을 선 검색해 본 후 해당 사이트를 접속해 보자
--> 항공권 가격비교 영역처럼 사람들이 동일 항공권을 최저가격으로 검색해 보는 사이트가 아주 명확한 경우가 있다 (예를들면 스***캐너). 이런 경우 가끔 동일 항공권인데 거기서 검색해 본 후 경쟁 사이트로 넘어가는 경우 일부러 딜 가격을 태우는 경우가 있다.
URL의 세계는 위 내용들 외에도 서브 도메인 구성, 리디렉션 등등 문돌이로서 알게되면 도움이 될만한 내용이 더 많은데, 후속 시리즈 글에서 더 자세히 다뤄볼 예정이니 이 글이 1이라도 도움이 되었다면 댓글, 구독, 공유하기 등으로 응원 부탁드린다.
글쓴이는 노마드태스크 (Nomadtask)라는 퀘스트 기반의 글로벌 마케팅 캠페인 플랫폼의 Co-founder 및 디자이너로 일하고 있다. 원래는 비즈니스를 전공하고 기획자로 일하다가 스타트업을 창업하고 본업을 스타트업 파운더+디자이너로 전향했는데, 그 과정에서 득템한 다양한 스킬들을 연재하고 있다.
노마드태스크 - https://nomadtask.com/
