본문 바로가기

언어공부/HTML

(생활코딩) HTML 링크 걸기 <a>

태그가 웹의 왕국이라면 <a> 태그는 왕국의 제왕이다.

현대의 HTML은 150여 개 태그로 이루어져 있지만, 이들 모두 <a> 태그 아래에 있다.

검색 엔진들은 <a> 태그 덕분에 전 세계의 웹을 항해하면서 웹 페이지를 발견할 수 있고,

<a> 태그가 없다면 검색엔진은 존재하지 않는다.

 

HyperText가 바로 이 <a> 태그를 의미 하며, anchor의 첫 글자를 띈 <a>이다.

achnor는 배가 정박할 때 사용하는 덫을 의미이다. 정보의 바다에 정박한다는 의미일 수 있다.

 

<a>태그는 링크의 기능을 한다.

 

작성한 글 중 HTML에 공식 사용 설명서의 링크를 걸어보도록 하자.

"html specification"로 검색 했을 때,  HTML을 만드는 W3C라는 국제기구에서 만든 공식 설명서를 찾는다.

해당 링크를 복사 한 후, <a href="링크주소">링크 할 부분</a> (href=hypertext reference)으로 태그를 작성한다.

 

에디터에 링크 줄 부분 <a>태그로 작성하고 저장한 후,

 

웹페이지를 열어보면 해당 부분에 하이퍼링크가 걸린 것을 확인할 수 있다.

여기서 해당 링크를 클릭했을 때 해당 창에서 바로 링크가 되는데,

새 창에서 열리게 하고 싶으면, <a>태그 안에  target="_blank" 속성을 추가해준다.

 

target 속성 추가 시 새창에서 링크되는 것을 확인할 수 있다.

 

추가로 해당 링크가 클릭하기 전에 무엇에 대한 링크인지 툴팁으로 알려주고 싶을 경우, 

<a>태그 안에 title="링크설명" 속성을 추가해준다.

 

title속성 추가 시 링크에 커서를 갖다대면 링크의 정보가 나오는 것을 확인할 수 있다.