웹사이트를 처음 만들고 운영하는 분들 사이에서 항상 단골로 나오는 질문이 하나 있어요. 바로 내 사이트 주소에 'www'를 붙일 것인지(www.example.com), 아니면 'www' 없이 깔끔하게 갈 것인지(example.com, 이걸 non-www라고 불러요) 결정하는 문제죠. 오늘 이 문서에서는 어떤 방식이 여러분의 사이트에 가장 좋은지에 대한 조언을 해드릴게요!
HTTP URL 구조를 보면, 맨 앞에 나오는 http:// 나 https:// (이걸 프로토콜이라고 해요) 바로 뒤에 따라오는 첫 번째 문자열을 도메인 이름(domain name)이라고 부릅니다. 이 도메인 이름은 여러분의 웹 문서(HTML, CSS, JS 등)가 살고 있는 서버의 주소 역할을 하죠.
여기서 잠깐 부연 설명을 드리자면, '서버'라는 게 반드시 물리적인 컴퓨터 한 대를 의미하는 건 아니에요. 성능이 아주 좋은 물리적 컴퓨터 한 대 안에 여러 개의 서버가 사이좋게 들어가 있을 수도 있고요. 반대로 사용자가 너무 많이 접속하는 거대한 서비스라면, 여러 대의 컴퓨터가 힘을 합쳐서 하나의 서버처럼 동작하며 사용자들의 요청을 분산 처리(로드 밸런싱)하기도 한답니다.
하지만 여기서 가장 중요한 핵심은, 의미론적으로 봤을 때 "하나의 도메인 이름은 단일 서버를 나타낸다"는 사실이에요!
네(Yes), 하나만 골라서 쭉 밀고 나가셔야 합니다.
어느 쪽을 여러분의 '공식(canonical)' 주소로 삼을지는 전적으로 여러분의 자유예요. 하지만 한 번 정했다면, 갈대처럼 흔들리지 말고 일관성 있게 유지해야 해요. 그래야 방문하는 유저들에게도 혼란을 주지 않고, 무엇보다 구글이나 네이버 같은 검색 엔진에게 일관된 인상을 줄 수 있거든요. 웹사이트 내부에서 링크를 연결할 때나, 이메일/SNS 등으로 링크를 공유할 때도 언제나 여러분이 선택한 그 공식 도메인 하나만 사용하셔야 합니다. (참고로, 여러분 사이트 내부에서 이동할 때는 상대 경로 URL을 사용하면 도메인 주소를 일일이 적지 않아도 돼서 관리가 훨씬 편해요!)
아니요(No), 사실 두 개 다 작동하게 둘 수도 있어요.
가장 중요한 건 "어떤 도메인이 진짜 우리 사이트의 공식 도메인인가?"에 대해 일관성을 갖는 거예요. 이 공식 도메인을 우리는 캐노니컬(canonical, 표준) 이름이라고 부릅니다. 여러분이 작성하는 모든 절대 경로 링크는 반드시 이 표준 이름을 써야 하죠.
그렇다고 비표준 도메인을 아예 막아버려야 하냐? 그건 아니에요! 비표준 도메인으로 접속해도 정상적으로 페이지가 보이도록 하면서, 검색 엔진이나 유저에게 "진짜 공식 도메인은 저거야~"라고 알려주는 HTTP 기술이 두 가지나 있거든요.
결론적으로, 여러분의 도메인 중 하나를 표준(Canonical) 도메인으로 콕 찝어 선택하세요! 그리고 비표준 도메인으로 들어오는 사람들도 문제없이 서비스를 이용할 수 있도록 만드는 두 가지 기술을 아래에서 바로 설명해 드릴게요.
여러분의 웹사이트 중 어떤 것이 '표준(canonical)'인지 명시하고 처리하는 데는 크게 두 가지 방법이 있습니다.
서버 쪽에서 처리하는 아주 깔끔하고 강력한 방법이에요. 'www'와 'non-www' URL 요청은 보통 같은 서버로 들어오게 되는데요, 이때 서버가 요청을 확인해서 만약 사용자가 '비표준 도메인'으로 접속했다면 적절한 HTTP 301 상태 코드로 응답하도록 설정하는 겁니다.
301 Moved Permanently 코드는 브라우저와 검색 엔진에게 "이 페이지 이사 갔으니까, 앞으로는 저쪽 주소로 가!"라고 영구적인 이동을 알려주는 역할을 해요. 예를 들어 여러분이 'non-www'를 표준으로 정했다면, 누군가 'www'를 붙여서 들어왔을 때 'www'가 없는 URL로 튕겨(Redirect) 보내버리는 거죠.
동작 예시를 볼까요?
1. 사용자가 브라우저에 http://www.example.org/whaddup을 입력해서 서버에 요청을 보냅니다. (우리의 표준 도메인은 example.org라고 가정해 볼게요.)
2. 서버는 이 요청을 받고, 상태 코드 301과 함께 Location 헤더에 진짜 주소인 Location: http://example.org/whaddup을 담아서 응답합니다.
3. 이 응답을 받은 클라이언트(브라우저)는 군말 없이 http://example.org/whaddup으로 다시 요청을 보내서 사용자에게 화면을 띄워줍니다. 이 과정은 순식간에 일어나서 사용자는 주소창이 스르륵 바뀌는 것만 보게 됩니다.
실제 서버에서 어떻게 설정하는지 궁금하시다면, HTML5 boilerplate 프로젝트에 있는 Apache 서버에서 한 도메인을 다른 도메인으로 리다이렉트 하는 방법 예시를 참고해 보세요!
<link rel="canonical"> 태그 사용하기서버 설정을 직접 건드리기 어렵거나, 프론트엔드 단에서 확실하게 쐐기를 박고 싶을 때 사용하는 방법입니다. HTML 문서의 <head> 영역에 특별한 <link> 요소를 넣어서 "이 페이지의 진짜 원본 주소는 이거야!"라고 콕 찝어 알려주는 거죠.
이 태그는 우리 눈에 띄는 시각적인 변화를 주지는 않아요. 하지만 검색 엔진 크롤러(구글봇 등)에게 페이지의 진짜 집 주소를 알려주는 엄청나게 중요한 역할을 합니다. 이렇게 해두면 구글이 똑같은 내용을 가진 www 페이지와 non-www 페이지를 보고 "어? 이거 똑같은 글을 복붙해놨네? 중복 콘텐츠 스팸이군!" 하고 사이트 순위를 떨어뜨리는 불상사를 막을 수 있어요.
이 태그를 적용할 때는 두 도메인에서 똑같은 화면(콘텐츠)을 제공하면서 태그만 살짝 추가해 주면 됩니다. 아까의 예시를 다시 빌려오면, http://www.example.org/whaddup에 접속하든 http://example.org/whaddup에 접속하든 똑같은 내용을 보여주되, HTML <head> 안에는 무조건 아래와 같은 코드가 들어가게 만드는 거죠.
<link href="http://example.org/whaddup" rel="canonical" />
주의할 점! 앞서 설명한 301 리다이렉트 방법과는 다르게, 이 방법은 브라우저 주소창의 URL을 강제로 바꿔주진 않습니다. 따라서 사용자의 브라우저 방문 기록(History)에는 non-www 주소와 www 주소가 각각 독립적인 별개의 기록으로 남게 됩니다.
지금까지 배운 기술들을 잘 섞으면, 사용자가 주소창에 www를 치든 치지 않든 여러분의 서버가 똑똑하게 반응하도록 만들 수 있습니다.
사용자가 굳이 www를 칠지 안 칠지 우리가 미리 예측할 수는 없기 때문에, 두 경우 모두에 대비하는 것은 아주 훌륭한 접근법이에요. 핵심은 어떤 형태를 여러분의 공식(canonical) 주소로 쓸 것인지 딱 하나만 정하고, 사용자가 다른 형태로 들어왔을 때 우리가 정한 표준 주소로 자연스럽게 리다이렉트 시키거나 안내해 주는 것입니다!