대상 속성
target
속성은 사용자가 링크를 클릭할 때 링크를 열 위치를 지정합니다.
아래 링크를 클릭하면 현재 있는 것과 동일한 브라우저 탭/창에서 TechStacker의 첫 페이지로 이동합니다.
<a href="https://techstacker.com/">Link to front page</a>
따라서 다른 웹사이트에 링크하면 사용자는 귀하의 웹사이트에서 귀하가 링크한 웹사이트로 이동하게 됩니다. 이것을 원할 수도 있고 원하지 않을 수도 있습니다.
이것은 기본적으로 <a>
이기 때문에 발생합니다. 요소에는 target
이 있습니다. 값이 _self
인 속성 — 즉, 사용자가 있는 동일한 창에서 링크가 열립니다.
따라서 이 링크 요소:
<a href="https://techstacker.com/"></a>
다음과 같이 컴퓨터/브라우저에서 읽습니다.
<a href="https://techstacker.com/" target="_self"></a>
당신은 그것을 볼 수 없기 때문에 혼란 스러울 수 있습니다 (그러나 이제는 알 수 있습니다).
새 브라우저 탭에서 링크를 열려면 기본 _self
를 재정의할 수 있습니다. _blank
가 있는 값 값:
<a href="https://youtube.com" target="_blank" rel="noopener"
>If you click this, the YouTube website opens in a new tab</a
>
언제 어떤 것을 사용해야 하나요?
간단한 대답은 다음과 같습니다. 사용자를 웹사이트에서 멀리 옮기고 싶지 않은 경우 SEO를 위해 target="_blank"
를 사용하세요. .
그렇지 않으면 아무 것도 하지 마십시오. 링크는 기본적으로 동일한 브라우저 창에서 열립니다(_self
를 통해 값).
중요: target="_blank"
를 사용할 때 noopener
를 추가해야 합니다. 보안상의 이유로 속성과 함께 사용하십시오. 적어도 외부 웹사이트에 연결할 때. noopener 속성에 대해 자세히 알아보기