친구가 긴 안내문을 보내며 “준비물은 여기 봐”라고 했다고 해봅시다. 보통은 목차부터 찾거나, 화면을 한참 내려야 합니다.

그런데 이번 링크는 열자마자 중간의 ‘준비물’ 항목에 도착합니다. 첫머리도 안 거쳤는데 본론부터 나옵니다.
페이지가 급한 게 아니라, 링크가 볼 곳까지 알려 준 경우일 수 있습니다.
주소 끝에 꽂아 둔 책갈피
주소 끝에 #과 글자가 붙어 있으면, 그 부분이 문서 안의 특정 지점을 가리킬 수 있습니다. 이런 주소 조각을 프래그먼트라고 합니다.[1]
example.com/guide#준비물
안내문 주소 + 그 안에서 볼 지점
문서 안에도 링크와 맞는 지점의 이름표가 있어야 합니다. 브라우저는 그 이름표를 찾아 해당 위치로 이동합니다.[2]

“394쪽을 펴세요.” 책 한 권을 주면서 어디부터 읽을지 짚어 주는 것과 비슷합니다. 책 전체가 다른 책으로 바뀐 건 아니고요.
이 글에서도 바로 가 볼까요?
아래 링크는 실제로 움직입니다.
이 글의 요약 항목으로 바로 가기 ↓지금 읽는 글 안에서 아래의 ‘오늘은 이것만 기억’으로 이동합니다. 새 글이나 새 탭이 열리는 예시가 아닙니다. 주소 끝의 # 뒤 표시는 이동한 지점에 맞춰 바뀝니다.
도착한 곳의 ‘예시로 돌아가기’를 누르면 이 자리로 돌아옵니다. 문서를 새로 여는 대신, 읽을 위치가 달라지는 것을 확인할 수 있습니다.
책갈피가 언제나 같은 곳을 보장하진 않습니다
링크가 가리킨 이름표가 문서에서 없어지거나 바뀌면, 기대한 항목으로 가지 못할 수 있습니다. # 뒤에 아무 글자나 붙인다고 새 지점이 생기는 것은 아닙니다.
또 사이트가 # 뒤의 값을 자체 기능으로 사용하면 탭이나 화면 상태가 바뀌는 등 다른 동작을 할 수도 있습니다. 모든 # 링크가 문서 안에서 똑같이 움직이는 것은 아닙니다.[3]
주소의 물음표 뒤에 붙는 정보와도 구분해서 보세요. 오늘은 끝의 #가 특정 위치를 가리킬 수 있다는 것만 알면 됩니다.
오늘은 이것만 기억.
바로 가기 링크의 도착 지점입니다. 같은 글의 요약 항목으로 왔습니다. 예시로 돌아가기 ↑
- 주소 끝의 #는 문서 안의 특정 지점을 가리킬 수 있습니다.
- 링크를 공유할 때는 글 제목뿐 아니라 실제로 도착한 항목도 확인합니다.
- 원하는 곳이 아니면 목차나 검색으로 항목을 찾고, 사이트가 제공하는 항목별 링크가 있는지 봅니다.
긴 글에서 필요한 부분을 매번 찾기 번거로우니, 주소에도 책갈피가 필요해진 겁니다. 다만 책갈피가 가리키는 자리가 사라지면 길 안내까지 보장되지는 않습니다.
처음부터 다 읽으라는 링크도 있지만, “여기부터 봐”라는 링크도 있습니다.
[3] MDN — hashchange
친구와 준비물 이야기는 가상 상황입니다. 원본 장면은 페이지 탐색과 지정 위치로 이동하는 경험을 빗댄 것이며 실제 웹사이트 화면이 아닙니다.