HTML에서 절대 URL(absolute URL)을 사용해 페이지를 연결하려면 <a> 태그와 href 속성을 함께 사용합니다. 절대 URL은 주로 외부 웹사이트를 링크할 때 활용되며, 도메인을 포함한 전체 주소를 명시하는 것이 특징입니다. 예를 들어 https://www.qries.com/questions.php처럼 프로토콜부터 파일 경로까지 완전한 형태의 URL을 작성합니다.
<a>...</a> 태그 사이에 포함된 모든 내용은 하이퍼링크(hyperlink)가 되며, 텍스트뿐 아니라 이미지도 링크 요소로 사용할 수 있습니다.
<a> 태그의 주요 속성
| 번호 | 속성 및 설명 |
|---|---|
| 1 | href 이동할 대상 URL을 지정합니다. 절대 URL 또는 상대 URL을 모두 사용할 수 있습니다. |
| 2 | rel 현재 문서와 링크된 문서 간의 관계를 지정합니다. 값으로는 nofollow, external, author, bookmark 등이 있습니다. SEO 측면에서도 중요한 역할을 합니다. |
| 3 | target 링크가 열릴 위치를 지정합니다. 주요 값으로는 _self(현재 창), _blank(새 창/새 탭), _parent(부모 프레임), _top(최상위 프레임) 등이 있습니다. |
예제 코드
아래 코드를 실행하면 HTML에서 절대 URL로 외부 페이지를 연결하는 방법을 직접 확인할 수 있습니다.
<!DOCTYPE html> <html> <head> <title>HTML 절대 링크</title> </head> <body> <h1>Qries</h1> <p> <a href="https://www.qries.com/questions.php">Qries</a>를 통해 게임, 정부, 교육, 지질학, 스포츠 등 다양한 주제의 정보를 확인할 수 있습니다. </p> </body> </html>
절대 URL과 상대 URL의 차이
절대 URL은 도메인 이름과 전체 경로를 모두 포함하기 때문에 어느 페이지에서 사용하더라도 동일한 대상을 가리킵니다. 반면 상대 URL(relative URL)은 현재 문서의 위치를 기준으로 경로를 지정하므로, 사이트 내부 페이지 연결에 적합합니다. 외부 사이트로 연결할 때는 반드시 절대 URL을 사용하는 것이 좋습니다.