혹시 지금 운영하고 계신 웹사이트의 주소창을 한번 확인해 보시겠어요? 만약 주소가 www.mysite.com/board/view.php?id=1029&code=3d5f&ref=unknown 처럼 외계어 같은 암호로 되어 있다면, 죄송하지만 검색 로봇에게 "내 글은 읽지 말고 그냥 가세요"라고 대문을 걸어 잠근 것과 다를 게 없답니다.
오늘은 제 지인이 쇼핑몰을 처음 만들 때, 단순히 개발하기 편하다는 이유로 복잡한 URL 구조를 썼다가 몇 년 동안 검색 유입이 바닥을 기었던 안타까운 사연을 통해, 검색 로봇과 사람이 모두 좋아하는 '명당 주소' 만드는 법을 알려드릴게요.
🧭 검색 1등석을 차지하는 URL의 3가지 조건
CONDITION 1. 의미를 알 수 없는 파라미터(?id=123) 대신 직관적인 경로(/guide/creator)를 쓰세요.
CONDITION 2. 검색 로봇이 무시하는 샵(#)이나 해시뱅(#!)은 URL에 포함하지 마세요.
CONDITION 3. 페이지 이동 버튼은 자바스크립트가 아닌 <a href> 태그로 만드세요.
💡 이웃님을 위한 상식 한 스푼!
URL은 인터넷상의 '도로명 주소'와 같아요. 복잡한 지번 주소보다 알기 쉬운 도로명 주소가 길 찾기에 유리하듯, 웹사이트 주소도 단어만 보고 내용을 유추할 수 있어야 검색 점수가 올라간답니다.
"주소가 이게 뭐니?" 제 친구 박 사장의 실수
제 오랜 친구인 박 사장이 의류 쇼핑몰을 창업했을 때의 일이에요. 나름 큰돈을 들여서 홈페이지를 만들었는데, 저한테 자랑스럽게 보내준 링크를 보고 제가 경악을 금치 못했었죠. 주소가 mysite.web-hosting.com/item.do?cate=15&p_id=9981&sort=desc 이런 식이었거든요.
제가 박 사장에게 "야, 이 주소만 보고 이게 무슨 옷인지 알겠냐?"라고 물었더니, 친구는 "개발자가 이게 관리하기 편하다던데?"라며 대수롭지 않게 여기더라고요.
결과는 뻔했어요. 네이버나 구글 같은 검색 로봇은 이런 복잡한 기호로 된 주소를 정말 싫어하거든요. 로봇은 URL을 보고 "아, 이 페이지는 청바지에 대한 내용이구나"라고 힌트를 얻고 싶은데, 의미 없는 숫자 놀음만 있으니 내용을 파악하기가 훨씬 어려웠던 거죠. 결국 박 사장은 나중에 큰 비용을 들여 사이트를 싹 다 뜯어고쳐야 했답니다.
좋은 주소 vs 나쁜 주소, 한 끗 차이의 비밀
그렇다면 도대체 어떤 주소가 '검색 친화적'인 걸까요? 핵심은 '사람이 읽어서 이해할 수 있는가'예요. 예를 들어 '크리에이터 가이드' 페이지를 만든다고 가정해 볼게요.
🚫 로봇이 싫어하는 주소 (Bad)
mysite.com/1001125/1079/action.do?tab=guide
(해석 불가: 1001125가 뭐지? 1079는 또 뭐고?)
✅ 로봇이 좋아하는 주소 (Good)
mysite.com/guide/creator
(해석 완료: 아하! 가이드(Guide) 중에서도 크리에이터(Creator) 관련 글이구나!)
이웃님, 보시기에도 아래쪽이 훨씬 깔끔하고 직관적이죠? 이렇게 ?id=123 같은 파라미터를 최소화하고, 단어로 된 경로(Path)를 사용하는 것이 SEO의 첫걸음이에요. 그리고 mysite.web-hosting.com 같은 임대형 도메인보다는, 내 브랜드 이름이 들어간 mysite.com 같은 독립 도메인을 쓰는 게 신뢰도 면에서 훨씬 유리하다는 점도 잊지 마세요.
혹시 주소 뒤에 샵(#)이 붙어 있나요? 당장 떼세요!
요즘 유행하는 원페이지 사이트나 포트폴리오 사이트들 보면 mysite.com/#about, mysite.com/#contact 처럼 중간에 샵(#)이 들어간 경우가 많아요. 이걸 전문 용어로 '프래그먼트(Fragment)'라고 하는데요. 원래는 긴 문서에서 특정 문단으로 점프하기 위해 만든 기능이지, 페이지를 나누는 용도가 아니에요.
문제는 검색 로봇이 이 샵(#) 뒤에 있는 글자를 싹 무시한다는 점이에요. 로봇의 눈에는 /#about이나 /#contact나 전부 똑같은 메인 페이지 하나로 보여요. 열심히 페이지를 10개를 만들었는데 로봇은 1개밖에 못 보는 참사가 벌어지는 거죠. 그러니 콘텐츠가 다르다면 반드시 독립된 URL(/about, /contact)을 사용하셔야 해요.
로봇을 위한 친절한 이정표, 링크 태그의 중요성
마지막으로 제가 박 사장 사이트를 뜯어고칠 때 가장 공을 들였던 부분이에요. 바로 '버튼'과 '링크'의 차이인데요. 박 사장네 개발자가 "요즘은 이게 트렌드야"라며 모든 메뉴 버튼을 자바스크립트(onclick)로 만들어놨더라고요.
그런데 검색 로봇은 마우스를 클릭해 볼 수가 없어요. 로봇은 오직 <a href="주소">라고 적힌 파란색 링크 텍스트만 따라서 이동하거든요. 아무리 예쁜 버튼을 만들어놓고 span이나 div 태그에 자바스크립트를 걸어놔 봤자, 로봇에게는 그저 '누를 수 없는 그림'일 뿐이에요. 내 사이트의 구석구석을 로봇에게 소개하고 싶다면, 반드시 표준 방식인 a 태그를 사용해 주세요.
📌 개발자에게 전달할 수정 요청서
1. "URL에 복잡한 특수기호(?=&) 빼고, 단어로 된 주소(Path)로 바꿔주세요."
2. "페이지 이동할 때 샵(#)이나 해시뱅(#!) 들어간 주소 쓰지 말아 주세요."
3. "메뉴나 링크 버튼은 onclick 말고 <a href> 태그로 코딩해 주세요."
4. "독립 도메인(.com, .kr)을 연결하고 보안 접속(https)을 적용해 주세요."