하이퍼링크 (Hyperlink)
웹(Web)이 왜 "거미줄"이라고 불릴까요? 바로 전 세계의 문서들이 하이퍼링크(Hyperlink)를 통해 얽히고설켜 있기 때문입니다. <a> 태그는 마치 마법의 공간 이동 포탈처럼 클릭 한 번으로 사용자를 다른 페이지나 웹사이트로 이동시켜 줍니다.
🌀 문서 간 공간 이동 포탈 (a 태그)
현재 페이지
클릭! <a href="...">
동작 흐름
🚀
---->
목적지 페이지
href 주소로 순간이동 완료!
단순한 페이지 이동뿐만 아니라, 스마트폰에서 클릭 시 즉시 전화 앱을 열어주는 tel: 기능이나, 이메일 앱을 띄워주는 mailto: 기능도 현업에서 매우 자주 사용됩니다.
| 태그명 | 주요 속성 | 설명 |
|---|---|---|
<a> | href | 이동할 목적지의 URL이나 문서 내 앵커(#)를 지정합니다. |
target | 링크를 열 창이나 프레임을 지정합니다.
|
<!-- 기본 외부 링크 -->
<a href="https://google.com" target="_blank" rel="noopener noreferrer" title="새 창에서 구글 열기">
구글 바로가기
</a>
<!-- 내부 페이지 이동 -->
<a href="/about-us">회사 소개</a>
<!-- 페이지 내 앵커 이동 -->
<a href="#section-2">2번 섹션으로 슝!</a>
<!-- 이메일 및 전화 연결 -->
<a href="mailto:hello@minstudio.com">이메일 보내기</a>
<a href="tel:010-1234-5678">전화 걸기</a>