2023년 신상 호텔 리스트
최근에 오픈한 호텔을 찾는다면 살펴보세요

HTML - a 태그

조회수: 113

설명

a 태그는 링크를 만들어준다.
예를 들어서 상식닷컴 웹사이트로 이동할 수 있게 링크를 만들어보겠다.
이게 기본이다. 현재 페이지에서 이동하는 거다.
a href="https://sangseek.com"상식닷컴/a

href="원하는 URL"을 넣는 거다.

새로운 창을 열어서 이동할 수 있게 할 수 있다.
target="_blank"를 넣어야 한다.

상식닷컴
a href="https://sangseek.com" target="_blank"상식닷컴/a

검색 엔진 최적화

검색 엔진 최적화를 위해서 rel 속성을 추가할 수 있다.
예를 들어서 광고 및 보상이랑 연관이 있는 링크는 sponsored를 추가하면 된다.
<a rel="sponsored" href="https://www.agoda.com/partners/partnersearch.aspx?pcs=1&cid=1829268">아고다</a>
sponsored 대신 nofollow를 넣어도 된다.
관련 정보는 여기에서 보자.

보안을 위해서 noopener랑 noreferrer를 사용할 수 있다.
a href="https://sangseek.com" rel="noopener"상식닷컴/a
a href="https://sangseek.com" rel="noreferrer"상식닷컴/a

이렇게 동시에 여러 개를 사용할 수 있다.
a href="https://sangseek.com" rel="noopener noreferrer"상식닷컴/a

본인 사이트가 아닌 외부 사이트를 링크 거는 경우 noopener랑 noreferrer를 사용하면 되고 본인 사이트의 다른 페이지를 링크 거는 경우에는 사용할 필요가 없다고 본다.

이메일

이메일 주소를 삽입하면 바로 해당 이메일 주소로 보낼 수 있게 적용이 가능하다.
<a href="mailto:[email protected]">이메일 보내기</a>
이메일 보내기

전화번호

전화번호도 이메일처럼 바로 해당 전화번호로 전화를 걸 수 있게 적용이 가능하다.
a href="tel:0212345678">02 1234 5678/a>
전화하기

장소 이동

아주 긴 글이 있다고 하자. 원하는 곳으로 바로 이동할 수 있게 적용할 수 있다.
<a href="#description">
앞에 #을 넣고 값을 넣어야 한다.
이동하려고 하는 곳에는 동일한 값을 id에 넣어줘야 한다.
<h2 id="description">설명</h2>
설명으로 가기