연습장

6. HTML의 핵심 개념인 Hyperlink 본문

HTML5

6. HTML의 핵심 개념인 Hyperlink

js0616 2024. 6. 24. 17:06

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

 

HTML5 Tag - Link | PoiemaWeb

HyperText의 Hyper는 컴퓨터 용어로서 텍스트 등의 정보가 동일 선상에 있는 것이 아니라 다중으로 연결되어 있는 상태를 의미한다. 이것은 HTML의 가장 중요한 특징인 link의 개념과 연결되는데 기존

poiemaweb.com

 

 

 

HyperText 의 Hyper 는 컴퓨터 용어로서 텍스트 등의 정보가 동일 선상에 있는게 아니라 다중으로 연결되어 있는 상태를 의미한다.

HTML 의 가장 중요한 특징인 link 의 개념과 연결되는데 기존 문서나 텍스트의 선형성, 고정성의 제약에서 벗어나

사용자가 원하는 순서대로 원하는 정보를 취득할 수 있는 기능을 제공한다. 

한 텍스트에서 다른 텍스트로 건너뛰어 읽을 수 있는 이 기능을 하이퍼링크(hyper link) 라 한다.

 

선형성 :  컴퓨터 용어로서 텍스트 등의 정보가 동일 선상에 존재 , 글이 1차원으로 나열된 그대로 읽는 느낌  인가..??

 


 

href

href 어트리뷰트는 이동하고자 하는 파일의 위치(경로)를 값으로 받는다.

경로(path)란 파일 시스템 상에서 특정 파일의 위치를 의미한다.

 

 

디렉터리

파일과 다른 디렉터리를 갖는 파일 시스템 내의 존재, 폴더

 

루트 디렉터리 

파일 시스템 계층 구조 상의 최상위 디렉터리

Unix : /

Windows: C:\

 

홈 디렉터리

시스템의 사용자에게 각각 할당된 개별 디렉터리

Unix : /User/{계정명}

Windows: C:\User\{계정명}

 

작업 디렉터리

작업 중인 파일이 위치한 디렉터리이다.

./

 

부모 디렉터리

작업 디렉터리의 부모 디렉터리이다.

../ 

 

 


 

파일 경로

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

 

절대경로

현재 작업 디렉터리와 관계없이 특정 파일의 절대적인 위치를 가리킨다.

루트 디렉터리를 기준으로 파일의 위치를 나타낸다.

C:\users\leeungmo\Desktop\myImage.jpg

 

상대경로

현재 작업 디렉터리를 기준으로 특정 파일의 상대적인 위치를 가리킨다.

./index.html

 

 

href 어트리뷰트에 사용가능한 값

절대 경로 

상대 경로

fragment idenifier :  페이지 내의 특정 id를 갖는 요소에의 링크 ,  <a href = "#top"> Go to top </a>

메일 : mailto:

script : href=”javascript:alert(‘Hello’);”

 

 

target

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

 

_self : 현재창 (기본값)

_blank : 새창 

 

<a href = "https://www.google.com" target ="_blank" rel="noopener noreferrer" > google 새창 </a>

google 새창

google 새창

 

 

<a href ="https://www.google.com" target = "_self" > google 바로 </a>

google 바로

 

 

 

target="_blank"를 사용해 외부 페이지를 오픈하는 경우, 이동한 외부 페이지에서 자바스크립트 코드를 사용해 악의적인 페이지로 리다이렉트할 수 있는 보안 취약점(Tabnabbing 피싱 공격)이 있다. 따라서 rel="noopener noreferrer"를 추가해 Tabnabbing 피싱 공격에 대비할 것을 권장한다. 참고로 noopener 속성은 성능 상 이점도 있는 것으로 알려져 있다. 

 

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

 

 

XSS ??

XSS 취약점은 공격자가 삽입한 악성스크립트로 인해 발생하기 때문에 입력값 검증을 통해 악성스크립트가 삽입되는 것을 방지해야 하며, 악성스크립트가 입력되어도 동작하지 않도록 출력값을 무효화해야 한다.

 

입력값 필터링의 경우 데이터베이스에 악성스크립트가 저장되는 것을 원천적으로 차단해야 한다. 또한 악성스크립트가 삽입되어도 동작하지 않도록 출력값을 검증하여 스크립트에 사용되는 특수문자를 HTML Entity로 치환하여 응답하도록 한다.

아래와 같이 <, >, ', " 등 스크립트에 쓰이는 문자가 입력될 경우 스크립트로 동작하여 XSS 공격이 가능할 수 있으므로 의미가 없는 일반 문자로 치환해야 한다.

 

https://www.fis.kr/ko/major_biz/cyber_safety_oper/attack_info/security_news?articleSeq=3408