실무에 바로 적용할 수 있는 웹 제작 꿀팁 및 유용한 자료실 공간입니다.
나눔웹이 제공하는 핵심 노하우와 마케팅 인사이트를 자유롭게 활용해 보십시오.

나눔웹 마케팅 꿀팁

301 리디렉션 설정법, 페이지 주소를 바꿀 때 검색 노출 지키는 순서

홈페이지를 리뉴얼하면서 페이지 주소가 바뀌었다면, 옛 주소마다 301 리디렉션을 걸어 새 주소로 연결해 두어야 검색 노출과 기존 링크를 지킬 수 있습니다.
이 작업을 빼먹으면 검색 결과와 블로그·카페에 남아 있는 링크가 전부 "페이지를 찾을 수 없습니다"로 바뀌고, 새 페이지는 처음부터 다시 평가받게 됩니다.

💡 301과 302는 뭐가 다른가요?

301은 "이 주소는 영구히 옮겨 갔다"는 뜻이라, 검색엔진이 옛 주소 대신 새 주소를 검색 결과에 올리도록 신호를 줍니다. 302는 "잠깐 다른 곳을 보여 준다"는 뜻이라 옛 주소가 계속 기준으로 남을 수 있습니다. 리뉴얼처럼 다시 돌아갈 일이 없는 이전이라면 301을 쓰는 것이 맞습니다.

1. 옛 주소와 새 주소 목록부터 만들기

코드보다 먼저 할 일은 짝 맞추기입니다. 기존 사이트의 메뉴, 사이트맵, 검색 결과에 나오는 주소를 엑셀에 쭉 적고 옆 칸에 대응하는 새 주소를 채웁니다. 실제 리뉴얼 현장에서 자주 보는 실수가 옛 주소를 전부 메인으로 보내는 것인데, 내용이 다른 페이지로 보내면 검색엔진이 사실상 없는 페이지(소프트 404)로 보고 순위를 넘겨 주지 않는 경우가 많습니다. 서비스 소개는 서비스 소개로, 공지 글은 같은 글로 1:1로 연결하는 것이 원칙입니다.

2. .htaccess에 301 리디렉션 작성하기

아파치 서버를 쓰는 일반적인 호스팅이라면 사이트 최상위 폴더의 .htaccess 파일에 적으면 됩니다. 페이지 몇 개는 Redirect 301 한 줄씩, 도메인 전체를 옮길 때는 RewriteRule로 경로를 그대로 붙여 넘깁니다.

# 페이지 단위: 옛 경로 → 새 주소
Redirect 301 /company.html /about
Redirect 301 /sub/service01.php /service/design

# 도메인 전체 이전: 경로는 그대로 유지
RewriteEngine On
RewriteCond %{HTTP_HOST} ^(www\.)?old-site\.com$ [NC]
RewriteRule ^(.*)$ https://www.new-site.com/$1 [R=301,L]

수정 전에는 꼭 원본 .htaccess를 내려받아 백업해 두세요. 오타 하나로 사이트 전체가 500 오류가 나는 파일이라, 문제가 생기면 바로 되돌릴 수 있어야 합니다. 그누보드나 워드프레스처럼 이미 RewriteRule이 들어 있는 경우에는 기존 규칙보다 위쪽에 넣어야 먼저 적용됩니다.

3. 걸어 둔 뒤 확인할 것

브라우저로만 확인하면 캐시 때문에 헷갈릴 수 있으니 터미널에서 응답 코드를 직접 보는 편이 정확합니다.

curl -I https://www.old-site.com/company.html

# 정상이면 이렇게 나옵니다
HTTP/1.1 301 Moved Permanently
Location: https://www.new-site.com/about
  • 응답이 302가 아니라 301인지
  • 옛 주소 → 중간 주소 → 새 주소처럼 여러 번 거치지 않고 한 번에 도착하는지
  • 새 주소가 200으로 정상 응답하는지, 사이트맵에는 새 주소만 들어 있는지
  • 도메인을 옮겼다면 구글 서치 콘솔의 주소 변경 도구로 이전을 알렸는지

리디렉션은 검색엔진이 새 주소를 다 반영할 때까지 시간이 걸리니, 적어도 1년은 지우지 말고 유지하는 것을 권합니다. 옛 도메인도 그 기간 동안은 만료되지 않게 연장해 두셔야 합니다.

"리뉴얼의 마무리는 새 디자인이 아니라, 옛 주소를 잘 이어 주는 일입니다."

나눔웹은 리뉴얼 오픈 전에 기존 주소 목록과 리디렉션 표를 먼저 만들고
오픈 후에도 검색 유입이 끊기지 않았는지 함께 확인합니다.


List of Articles
번호 분류 제목 글쓴이
56 웹 성능 홈페이지 로딩 속도를 3배 높이는 '이미지 최적화' 실무 가이드 나눔웹
55 퍼블리싱 CSS 변수로 유지보수와 테마 기능을 한 번에! (CSS Custom Properties) 나눔웹
54 마케팅 카카오톡 링크 썸네일의 비밀! 클릭률을 높이는 '오픈 그래프(OG)' 세팅법 나눔웹
53 모바일 모바일 꽉 찬 화면 하단 짤림 현상! '100vh'의 함정과 완벽 해결법 나눔웹
52 웹 성능 홈페이지 첫 화면 글자 깜빡임(투명 현상) 1초 만에 해결하는 법 나눔웹
51 퍼블리싱 스마트폰에서 로고가 흐리게 보인다고요? 'SVG' 포맷이 정답입니다. 나눔웹
50 웹 성능 클릭 실수 유발하는 '화면 덜컹거림(CLS)', 단 한 줄로 해결하는 법 나눔웹
49 모바일 고객의 이탈을 막는 1초 디테일, '모바일 맞춤형 키보드' 세팅법 나눔웹
48 UI/UX 모바일에서 버튼 누를 때 생기는 촌스러운 '회색 박스' 없애는 법 나눔웹
47 UI/UX 레이아웃을 망치는 긴 글, 예쁘게 '...'으로 자르는 마법의 CSS 나눔웹
46 UI/UX 상단 메뉴에 제목이 가려진다고요? '부드러운 스크롤' 마법의 2줄 나눔웹
45 모바일 아이폰에서 입력창 누를 때 화면 '자동 확대'되는 현상 막는 법 나눔웹
44 퍼블리싱 지저분한 모바일 스크롤바, 기능은 남기고 쏙 숨기는 마법의 CSS 나눔웹
43 모바일 모바일 웹을 진짜 '앱(App)'처럼! 이미지 꾹 누를 때 뜨는 팝업 막기 나눔웹
42 UI/UX 애플(Apple) 사이트처럼 고급스러운 '반투명 유리' 메뉴 만드는 법 나눔웹
41 퍼블리싱 무거운 플러그인 NO! 넷플릭스처럼 쫀득한 '가로 스와이프' CSS로 뚝딱 만들기 나눔웹
40 UI/UX 1%의 디테일이 브랜딩을 완성합니다! '텍스트 드래그 색상' 바꾸기 나눔웹
39 UI/UX 투박한 파란색 체크박스는 그만! 단 1줄로 우리 회사 컬러 입히기 나눔웹
38 모바일 하단 고정 버튼이 아이폰 '검은 줄'에 겹친다면? (Safe Area 대응법) 나눔웹
37 모바일 앗, 실수로 새로고침! 튕기는 모바일 화면 꽉 잡는 법 (Overscroll) 나눔웹
Board Pagination Prev 1 2 3 Next
/ 3
rhwlsghkcocndgus XE2.1.39 STAGE1.5.4