A Href 링크: 그것들은 무엇이며 어떻게 사용하나요?

A Href 링크란 무엇인가?

“a href 링크”(또는 “href 링크”)는 <a> 태그와 href 속성을 사용하여 클릭 가능한 하이퍼링크를 생성하는 HTML 코드입니다.

예를 들어, 이 href 링크는 “Semrush” 하이퍼링크를 생성합니다:

다른 유형의 HTML 링크(예: <link> 태그)가 있습니다. 그리고 하이퍼링크를 생성하는 다른 방법(예: JavaScript)이 있습니다. 하지만 대부분의 링크는 <a> 태그를 사용하여 생성되며, 이는 앵커 태그 또는 앵커 요소로도 알려져 있습니다.

앵커 요소는 시작 태그 <a>와 종료 태그 </a>로 정의됩니다.

href 속성(하이퍼텍스트 참조 속성)은 링크 대상 또는 목적지를 정의합니다. 이는 종종 웹페이지 URL입니다. 하지만 다른 가능한 값이 있습니다.

앵커 태그에는 앵커 콘텐츠도 포함되어야 합니다—링크가 연결된 콘텐츠입니다. 많은 경우, 이는 앵커 텍스트(예: “Semrush”)입니다. 하지만 이미지와 같은 HTML 요소일 수도 있습니다.

콘텐츠 관리 시스템(CMS)에는 href 링크를 수동으로 코딩할 필요가 없도록 하는 도구가 있을 수 있습니다. 하지만 배경에서 어떻게 작동하는지 이해하는 것이 도움이 됩니다.

팁: Semrush의 Site Audit 도구를 사용하여 사이트의 링크 문제와 기타 기술 문제를 확인하세요. 최대 100개의 URL을 무료로 크롤링할 수 있습니다.

Href 링크가 중요한 이유는?

Href 링크는 하이퍼링크를 생성하는 가장 일반적으로 사용되는 방법이기 때문에 중요합니다. 그리고 하이퍼링크는 사용자와 웹 크롤러가 인터넷을 탐색하고 디지털 리소스에 액세스하는 데 도움이 됩니다.

웹사이트에 추가할 수 있는 하이퍼링크의 두 가지 주요 유형이 있습니다: 내부 링크와 외부 링크. 그리고 a href 링크를 사용하면 둘 다 생성할 수 있습니다.

내부 링크는 도메인 내 위치나 리소스로의 하이퍼링크입니다.

예시에는 다음이 포함됩니다:

• 사이트의 다른 페이지로의 탐색 링크
• 사이트의 다른 페이지로의 맥락 링크
• 페이지의 앵커 링크(또는 점프 링크)
• 도메인 서버의 파일(예: ebooks)로의 링크

내부 링크를 효과적으로 사용하면 사용자가 사이트를 탐색하도록 장려할 수 있습니다. 이는 구매, 콘텐츠 공유 또는 다른 바람직한 행동을 더 할 가능성이 높아질 수 있습니다.

게다가 내부 링크는 Google이 도메인의 페이지를 발견하고 이해하는 데 도움이 됩니다. 그리고 검색 엔진 결과 페이지(SERP)에서 더 높은 순위를 이끌 수 있습니다.

외부 링크(또는 아웃바운드 링크)는 도메인 외부의 위치나 리소스로의 하이퍼링크입니다.

적절히 사용하면 외부 링크는 콘텐츠에 가치를 더합니다.

예를 들어, 신뢰할 수 있는 소스로 링크하여 신뢰를 구축할 수 있습니다. 또는 사이트에 없는 유용한 도구를 공유할 수 있습니다.

Google의 John Mueller는 평판이 좋은 사이트로의 외부 링크가 웹사이트 순위에 도움이 되지 않는다고 주장합니다. 하지만 많은 SEO 전문가들은 도움이 된다고 믿습니다.

A Href 링크를 위한 5가지 모범 사례

A href 링크를 생성할 때 이러한 모범 사례를 따르세요. 하이퍼링크가 제대로 작동하고 사이트에 최대한 이익이 되도록 하기 위함입니다.

1. 적절한 Href 속성 값 선택

Href 속성 값은 링크 대상입니다. 이는 웹페이지, 웹페이지의 일부, 파일, 이메일 주소 또는 전화번호일 수 있습니다.

링크 대상은 href 속성의 따옴표 사이에 배치됩니다:

Href 값의 주요 유형을 탐색해 보겠습니다:

상대 URL

상대 URL은 동일한 웹사이트의 리소스로의 경로입니다.

예를 들어, Semrush 블로그 로고의 href 값은 “/blog/”입니다:

일부 웹 개발자는 모든 내부 링크에 상대 URL을 사용합니다. 간결하기 때문입니다. 그리고 사이트 마이그레이션 후에도 여전히 작동할 수 있습니다.

그러나 SEO 목적으로 절대 URL을 사용하는 것을 권장합니다.

절대 URL

절대 URL은 프로토콜, 도메인 및 추가 경로나 매개변수를 포함한 URL의 전체 경로입니다.

예를 들어:

외부 링크를 추가할 때는 절대 URL을 사용해야 합니다.

하지만 내부 링크에도 도움이 됩니다. 항상 중복 페이지의 선호 버전인 캐노니컬 URL로 링크할 수 있기 때문입니다.

이는 검색 엔진에 대한 모호함이나 혼란을 제거합니다. 따라서 SEO에 도움이 될 수 있습니다.

Google 비디오에서 John Mueller는 캐노니컬 URL로 링크하는 것이 “아마도 조금 더 합리적일 것입니다. 왜냐하면 웹사이트의 비-WWW 버전에 액세스하는 등의 걱정을 하지 않아도 되기 때문입니다.”라고 말했습니다.

앵커 링크

앵커 링크(또는 점프 링크)는 동일한 페이지의 다른 부분으로의 링크입니다.

예를 들어, 이 기사의 목차의 모든 링크는 앵커 링크입니다.

점프 링크를 생성하려면 링크하려는 요소에 id 속성(id=”id-name”)을 부여하세요.

이렇게:

그런 다음, href 값으로 #id-name을 사용하여 링크를 생성하세요.

이렇게:

대안으로, 페이지 상단으로 점프하려면 href=”#top” 또는 href=”#”을 사용하세요.

Mailto 링크

href=”mailto:” 속성은 사용자의 이메일 프로그램에서 새 이메일을 여는 mailto 링크를 생성합니다.

이는 일반적으로 대상 이메일 주소와 함께 사용됩니다.

예를 들어, 사이트 푸터에 다음과 같은 href 링크가 있습니다:

하이퍼링크를 클릭하면 다음과 같은 이메일 초안을 생성합니다:

a href 코드에 제목, 본문 콘텐츠, CC 주소 등의 매개변수를 추가할 수도 있습니다.

예를 들어, 구직자들이 “Web Developer Role” 제목으로 이력서를 jobs@example.com으로 보내도록 하려면 다음과 같은 HTML 링크를 추가할 수 있습니다:

공백 대신 “%20”이 사용된다는 점에 유의하세요. 이는 매개변수가 제대로 작동하도록 돕는 URL 인코딩의 예입니다.

Tel 링크

Tel 링크를 생성하려면 전화번호와 함께 href=”tel:” 속성을 사용하세요.

이렇게:

호환되는 장치에서 사용자가 하이퍼링크를 클릭하면 다이얼러 앱에서 번호가 열립니다. 이를 통해 쉽게 전화를 걸 수 있습니다.

2. 다른 앵커 태그 속성 사용

Href 속성은 앵커 요소에서 링크 대상을 정의하기 때문에 중요합니다. 하지만 사용자가 링크를 클릭할 때 발생하는 일을 결정하기 위해 다른 앵커 태그 속성을 추가할 수 있습니다.

이러한 속성은 검색 엔진이 링크를 이해하는 데도 도움이 되며, 따라서 SEO에 이익이 됩니다.

가장 일반적인 속성의 간단한 개요는 다음과 같습니다:

앵커 속성	목적	앵커 태그 예시
Download	브라우저에게 연결된 리소스를 열지 않고 다운로드하도록 지시합니다. 따옴표 사이에 설명적인 파일 이름을 포함하세요.	<a href=”example.pdf” download=”Filename”>Download </a>
Rel	검색 엔진에게 사이트와 연결된 리소스의 관계에 대해 알립니다. 예를 들어, rel=“nofollow”는 검색 엔진이 링크를 연결된 페이지의 지지로 취급하지 않도록 요청합니다. (이는 링크 빌딩의 중요한 개념입니다.)	<a href=”https://www.example.com/” rel=”nofollow”>Anchor Text</a>
Target	브라우저에게 링크를 어디에서 열지 알려줍니다. 예를 들어, target=”_blank”는 새 탭이나 창에서 리소스를 엽니다. target=”_self”는 동일한 프레임에 유지합니다.	<a href=”https://www.semrush.com/” target=”_blank”>Semrush</a>
Title	사용자가 링크 위에 마우스를 올릴 때 툴팁을 표시합니다. 따옴표 사이에 툴팁 텍스트를 포함하세요.	<a href=”https://www.semrush.com/” title=”Semrush homepage”>Semrush</a>

팁: 다른 사이트의 특정 종류의 링크(백링크)는 SEO에 이익이 될 수 있습니다. Semrush의 Backlink Analytics 도구로 백링크를 쉽게 분석하고 경쟁자와 비교할 수 있습니다.