목차 #링크가 다른 주소로 열릴 때: HTML의 base 기준 주소를 확인하세요
href="#intro"라고 적혀 있어도 HTML에 base 기준 주소가 있으면 다른 문서 주소로 해석될 수 있습니다. MDN은 조각 링크도 base를 기준으로 해석되어 해당 기준 URL에 조각이 붙은 요청을 만들 수 있다고 설명합니다. 앵커 ID만 고치기 전에 실제 이동 주소를 확인하세요.
1. 상대 주소의 기준이 바뀌는 경우
HTML의 base 요소는 문서 안 상대 URL에 사용할 기준 URL을 지정합니다. 문서에 여러 base가 있다면 첫 href와 첫 target만 적용된다는 MDN 설명도 있습니다. 이 글에서는 href 기준 주소의 영향만 살펴봅니다.
문제 확인은 공개 페이지에서 버튼이나 목차를 눌렀을 때의 주소, 링크에 적힌 href, 문서의 base href를 각각 적는 것으로 시작합니다. 어느 하나를 다른 값으로 추측해 대신 쓰지 마세요.
2. 가상 주소로 보는 조각 링크
<base href="https://example.com/guide/"> <a href="#intro">도입</a>
MDN의 설명에 따라 이 조각 링크는 https://example.com/guide/#intro를 기준으로 해석됩니다. 현재 보고 있는 다른 문서의 #intro로 이동한다고 무조건 생각하면 안 됩니다. example.com은 설명용 가상 주소이며 실제 자료 목적지로 제안하는 링크가 아닙니다.
템플릿의 base를 제거하거나 바꾸면 다른 이미지·상대 링크에도 영향이 갈 수 있습니다. 목차 한 개의 문제를 고치려고 기준 주소를 바꾸기 전에 영향 범위를 확인하세요.
3. 링크 점검표
| 자료 | 적을 값 |
|---|---|
| 목차 원문 | href에 적힌 상대 주소 또는 #조각 |
| 문서 기준 | base href가 있는지와 그 값 |
| 실제 클릭 | 최종 문서 URL과 조각 |
| 앵커 대상 | 도착 문서에 ID가 실제 있는지 |
검사는 편집 미리보기와 공개 페이지를 구분해 수행합니다. 프레임 안 문서나 테마가 서로 다른 기준을 갖는 상황에서는 부모 주소만 보고 결론 내리지 않습니다. 수정 후에는 목차뿐 아니라 상대 이미지와 다른 버튼도 확인하세요.
4. 자주 묻는 질문
모든 잘못된 목차는 base 때문인가요?
아닙니다. ID 누락·중복 등 다른 원인도 있습니다. 실제 주소가 다른 문서로 바뀌는지부터 관찰하세요.
base만 지우면 되나요?
기준 주소에 의존하는 다른 리소스가 있을 수 있으므로, 템플릿 전체의 영향을 확인한 뒤 수정합니다.
MDN의 base와 문서 조각 링크 설명 읽기자료 확인: 2026년 10월 8일. MDN: base element and in-page anchors
대표 썸네일 삽화는 이해를 돕기 위해 AI로 제작했습니다.
