Next.js SEO 7 분 소요
Next.js 다국어 SEO: 서버 렌더링, hreflang, canonical 가이드
언어별 URL, 서버 렌더링 콘텐츠, canonical, hreflang, 사이트맵을 올바르게 구성하는 방법입니다.
S
Supacode Editorial
제품 및 엔지니어링
핵심 답변
AI로 앱을 잘 만드는 비결은 짧은 피드백 루프예요.
- 언어마다 고유하고 크롤링 가능한 URL을 사용하세요.
- 첫 HTML 응답에 번역 콘텐츠와 메타데이터를 포함하세요.
- canonical과 hreflang을 상호 연결하고 사이트맵에도 반영하세요.
1. 언어별 URL을 사용하세요
영어 /blog, 일본어 /ja/blog, 한국어 /ko/blog처럼 안정된 URL을 제공하면 사용자와 검색 엔진이 각 언어 버전에 직접 접근할 수 있습니다.
2. 번역을 서버에서 렌더링하세요
제목, 본문, 내비게이션, 메타데이터가 첫 HTML 응답에 올바른 언어로 포함되어야 합니다.
3. canonical과 hreflang을 함께 유지하세요
각 페이지는 자신을 canonical로 지정하고 모든 번역 버전을 상호 hreflang으로 연결해야 합니다. 사이트맵에도 같은 관계를 넣으세요.
FAQ
자주 묻는 질문
언어를 쿠키로만 바꿔도 되나요?
검색 노출을 원한다면 언어별 URL을 제공하는 편이 안전합니다.
번역 페이지의 canonical은 영어여야 하나요?
아니요. 실제 번역 페이지는 대개 자기 자신을 canonical로 지정하고 hreflang으로 다른 언어를 연결합니다.
쓸모 있는 첫 버전부터
아이디어를 바로 테스트해 보세요.
누가 쓰고 무엇을 하려는지 설명해 주세요. Supacode가 코드를 만들어 실시간 미리보기로 보여 주고, 모든 변경을 복원할 수 있는 버전으로 저장해요.