블로그 링크의 빈 href와 속성 누락: 같은 빈칸으로 묶지 마세요
링크 목록에 빈칸이 보인다면 href 속성이 없는지, 속성은 있고 값만 비었는지를 먼저 나누세요. 두 상태를 한꺼번에 「주소 없음」으로 정리하면 브라우저가 해석한 결과를 놓칠 수 있습니다. 원래 값과 해석된 주소를 함께 기록하는 편이 좋습니다.
아래 설명은 HTML의 a 요소와 HTMLAnchorElement.href를 기준으로 합니다. 실제 페이지에는 스크립트나 다른 기준 주소가 관여할 수 있으므로 저장된 문자열만으로 클릭 결과를 확정하지 않습니다.
1. 두 빈칸의 출발점이 다릅니다
MDN은 href 속성이 없을 때 href 프로퍼티가 빈 문자열을 반환한다고 설명합니다. 반면 속성이 존재하고 값이 빈 문자열이면 유효한 상대 URL로 취급되어 문서의 기준 URL을 가리킵니다.
<a>자료 보기</a>
<a href="">자료 보기</a>첫째는 href가 빠진 요소이고 둘째는 빈 값을 가진 속성이 있는 요소입니다. 두 예에서 보이는 문구가 같아도 주소 기록은 구분해야 합니다. 원하는 상세 자료의 주소가 비어 있는 상태라면 공개 전에 목적지를 다시 지정하세요.
2. 원래 값과 해석된 주소를 나란히 기록하세요
| 기록 항목 | 무엇을 남기나 | 구분할 내용 |
|---|---|---|
| href 속성 존재 | 있음 / 없음 | 빈 문자열과 속성 누락 |
| 원래 속성값 | 입력된 문자열 그대로 | 브라우저가 보완한 절대 주소 |
| 해석된 href | 브라우저가 해석한 URL | 실제 이동 뒤 최종 주소 |
| 공개 클릭 결과 | 도착한 페이지와 내용 | 주소 문자열만 맞는 상태 |
개발 도구로 확인할 수 있다면 getAttribute("href")와 href 프로퍼티를 비교합니다. MDN의 안내처럼 원래 속성값과 기준 URL에 따라 해석된 절대 주소는 다른 표현일 수 있습니다. 다른 사람에게 보낼 점검표에는 로그인 코드나 비공개 주소를 복사하지 않습니다.
3. 임시 버튼이 그대로 남은 경우의 검수 예
가상의 예로 새 원고에 「예약 조건 확인」 버튼을 만들어 놓고 목적지 입력을 미뤘다고 해 봅시다. 미리보기에서 버튼 모양이 보인다는 이유만으로 링크를 완성했다고 처리하지 않습니다. 속성값을 확인하고, 공식 자료나 관련 공개 상세글을 지정한 뒤 저장합니다.
공개 화면에서 버튼을 눌러 목적지가 원하는 자료인지 확인합니다. 같은 페이지로 돌아왔다면 기준 주소, 빈 값, 편집 중 링크 누락 등을 나눠 살펴보세요. 모양이 예쁜 버튼과 정확히 이동하는 버튼은 별도 검수 항목입니다.
4. 자주 묻는 질문
href가 빈 문자열이면 아무 일도 안 일어나나요?
기준 URL에 따라 해석되는 유효한 상대 URL입니다. 동작이 없다고 미리 단정하지 말고 속성값과 실제 결과를 확인하세요.
해석된 href가 주소처럼 보이면 검수가 끝났나요?
원하는 자료인지 별도 확인해야 합니다. 기준 주소로 보완된 값과 의도한 목적지가 같다는 보장은 없습니다.
빈 값을 모두 홈페이지로 바꾸면 되나요?
버튼 문구와 독자가 찾는 자료에 맞는 목적지를 정하세요. 일괄 홈페이지 연결은 상세 자료를 찾는 문제를 해결하지 못할 수 있습니다.
5. href 프로퍼티 원문 예시 보기
MDN은 속성 누락, 빈 문자열, 상대 주소, 절대 주소를 나눠 보여 줍니다. 내 링크 목록의 원래 값과 해석된 값을 비교할 때 필요한 경우를 골라 읽으세요.
자료 확인: 2026년 10월 10일. MDN, HTMLAnchorElement: href property
대표 썸네일은 이해를 돕기 위해 AI로 제작한 삽화입니다.
