5. HTML의 HyperLink

HTML link는 hyperlink를 의미하며 a(anchor) tag가 그 역할을 담당한다.

<a href="http://www.google.com">Visit google.com!</a>

 

디렉터리(Directory)

디렉터리는 파일과 다른 디렉터리를 갖는 파일 시스템 내의 존재물로서 폴더라고도 불리운다.

파일 경로(File path)

파일 경로는 파일 시스템에서 파일의 위치를 나타내는 방법이다. 경로에는 절대경로와 상대경로가 있다.

 

<a href="#top">Go to top</a>

- 이걸로 브라우저 창 맨위로 이동도 가능

 

target 어트리뷰트

target 어트리뷰트는 링크를 클릭했을 때 윈도우를 어떻게 오픈할 지를 지정한다.

_self	링크를 클릭했을 때 연결문서를 현재 윈도우에서 오픈한다 (기본값)
_blank	링크를 클릭했을 때 연결문서를 새로운 윈도우나 탭에서 오픈한다

<a href="http://www.google.com" target="_blank" rel="noopener noreferrer">Visit google.com!</a>

target="_blank"를 사용해 외부 페이지를 오픈하는 경우, 이동한 외부 페이지에서 자바스크립트 코드를 사용해 악의적인 페이지로 리다이렉트할 수 있는 보안 취약점(Tabnabbing 피싱 공격)이 있다.

따라서 rel="noopener noreferrer"를 추가해 Tabnabbing 피싱 공격에 대비할 것을 권장한다. 참고로 noopener 속성은 성능 상 이점도 있는 것으로 알려져 있다. 자세한 내용은 아래 링크를 참고하기 바란다.

https://tech.lezhin.com/2017/06/12/tabnabbing

https://blog.coderifleman.com/2017/05/30/tabnabbing_attack_and_noopener/

Tabnabbing 공격과 rel=noopener 속성

 

 

내가 몰랐던 점

1. href에 #top로 브라우저 상위로 갈 수 있다는 점
2. target속성을 사용했을 때 보안취약점이 있다는 점을 알게 되었다.

출처

https://poiemaweb.com/html5-tag-link

HTML5 Tag - Link | PoiemaWeb