Rel="Noopener"란 무엇이며 WordPress에서 어떻게 사용합니까?

웹사이트를 구축하고 유지 관리할 때 우리는 항상 우리가 관리하는 사이트의 보안을 고려해야 합니다. 블로그는 특히 일반적으로 가지고 있는 아웃링크의 수를 고려할 때 추가 수준의 관리가 필요합니다. 아웃링크를 관리하려면 항상 최적화되도록 하기 위해 다양한 작업이 필요합니다. 아웃링크의 보안을 감독하는 데 도움이 되는 도구 중 하나는 HTML rel=”noopener” 속성입니다. 간단하지만 사이트 보안을 위해 놀라운 일을 할 수 있습니다.

이 게시물에서는 noopener 링크가 정확히 무엇이며 WordPress에서 rel=”noopener” 속성을 사용하는 방법을 살펴보겠습니다.

Rel="Noopener" 속성이란 무엇입니까?

간단히 말해서, rel=”noopener” 속성은 새 탭/창에서 열리는 링크에 추가됩니다. WordPress에 링크를 추가할 때 링크가 같은 창에서 열릴지 다른 창에서 열릴지 선택할 수 있습니다. 다른 창에서 열기를 선택하면 WordPress는 일반적인 target=”_blank” 속성과 함께 rel=”noopener” 속성을 HTML에 자동으로 추가합니다.

새 창에서 열리는 링크에 rel=”noopener” 속성을 추가하는 목적은 무엇입니까? 우선, 사용자 경험 및 방문자 측정항목 측면에서 새 탭에서 외부 링크를 열어 사이트를 완전히 떠나지 않도록 하는 것이 좋습니다.

그러나 이 속성이 존재하는 주된 이유는 보안 때문입니다.

리버스 탭내빙

rel="noopener" 속성은 악의적인 의도, 특히 역 탭내빙(reverse tabnabbing)이라는 피싱 공격으로부터 사이트를 보호합니다.

역 탭내빙은 악성 사이트가 window.opener.location.assign() 을 사용하여 실제 페이지를 가짜 페이지로 교체하는 경우입니다. 그것은 다음과 같이 작동합니다: 상위 페이지라고 하는 링크가 추가된 페이지는 해당 링크를 통해 하위 페이지로 연결됩니다. 그런 다음 악의적인 하위 페이지는 window.opener.location.assign() 을 사용하여 상위 페이지에 자신을 첨부하고 가짜 페이지로 원본 사이트를 모방합니다.

모방된 사이트에 로그인 위젯이 있고 사용자가 정보를 입력하면 해당 정보가 모두 악의적인 하위 페이지에 의해 도용됩니다. rel="noopener" 속성이 하는 일은 자식 페이지를 통한 역 탭 이동을 통해 부모 페이지가 악의적인 의도로 공격받지 않도록 보호하는 것입니다.

Noreferrer는 어떻습니까?

rel=”noopener” 속성은 Firefox 및 기타 이전 브라우저를 제외한 대부분의 브라우저에서 작동합니다. WordPress가 기본적으로 rel=”noopener” 속성을 링크에 추가하면 rel=”noreferrer” 속성을 함께 추가해야 합니다. 최신 WordPress로 업데이트했다면 두 속성이 자동으로 링크에 추가됩니다.

rel=”noreferrer” 속성은 링크를 보내는 메인 페이지에서 리퍼러 정보를 수집하지 않도록 브라우저에 지시합니다.

링크는 다음과 같아야 합니다.

 <a href="https://www.example.com" rel="noopener noreferrer" target="_blank">예제 앵커 텍스트</a>

Noopener 링크는 Dofollow 및 Nofollow 링크와 어떤 관련이 있습니까?

rel=”noopener” 속성이 있는 링크가 dofollow 및 nofollow 링크와 관련되어 있지만 실제로는 그렇지 않다는 것은 일반적인 오해입니다. 차이점은 noopener 및 noreferrer 링크는 보안 목적을 위한 반면 dofollow 및 nofollow 링크는 페이지 순위 및 SEO에 관한 것입니다.

예를 들어, rel=noopener 속성이 있는 링크는 dofollow 또는 nofollow가 될 수 있습니다. 그 선택은 당신에게 달려 있습니다. 사실, 우리는 당신이 반드시 확인해야 할 그것에 대한 심층 기사를 얼마 전에 게시했습니다.

추가된 모든 링크는 자동으로 팔로우(추종) 링크로 귀속됩니다. 그들이 nofollow인지 확인하려면 링크가 다음과 같아야 합니다.

 <a href="https://www.example.com" rel="noopener noreferrer nofollow" target="_blank">예제 앵커 텍스트</a>

Noopener 링크가 SEO에 영향을 줍니까?

rel=”noopener” 속성이 있는 링크가 SEO에 영향을 줄 수 있다는 것은 신화입니다. noopener 및 noreferrer 링크를 사용하면 SEO에 전혀 영향을 미치지 않습니다. Dofollow 및 Follow 링크는 SEO에 영향을 미칩니다!

다음과 같이 기억하십시오.

• noopener 및 noreferrer: 보안 관련
• nofollow 및 dofollow: SEO 및 도메인 기관에 해당

언제 Rel="Noopener" 속성을 사용하는 것이 좋은가요?

매번 모든 링크에 rel=”noopener” 속성을 사용해야 합니다. 당연히 WordPress는 이제 rel=”noopener” 속성을 기본값으로 추가합니다. 보안은 블로그에서 전자상거래, 제휴 링크로 가득 찬 사이트에 이르기까지 모든 종류의 사이트에서 매우 중요합니다.

경우에 따라 rel=”noopener” 및 rel=”noreferral” 속성을 추가하는 기본 기능을 실행 취소할 수 있습니다. 하지만 그렇게 하지 않는 것이 좋습니다. 사이트가 보안 위험에 노출될 수 있습니다.

귀하의 제휴 링크는 어떻습니까?

rel=”noopener” 및 rel=”noreferer” 속성을 사용하여 제휴사 링크가 어떻게 영향을 받는지 걱정된다면 그럴 필요가 없습니다. 대부분의 제휴 링크는 URL 자체에 제휴 ID가 있으므로 링크를 통해 제휴 하위 페이지에 추천 정보를 보낼 필요가 없습니다. 실제로 rel=”noopener” 및 rel=”noferrer” 속성을 제휴사 링크에 추가하는 것은 일반적인 관행이어야 합니다. 보증하는 사이트의 보안을 항상 확신할 수는 없습니다.

제휴사 링크에 대한 조언: 항상 안전하다고 확신할 수 있는 사이트로 링크하십시오. 판매하는 모든 것으로부터 제휴 수입을 제공하는 백만 개의 사이트에 연결하지 마십시오. 당신이 제품에 대해 정직하다면 팔로워들은 제휴 링크를 클릭하고 싶어할 것입니다. 사이트를 링크로 채우는 대신 실제로 제품을 검토하는 경우에는 더욱 그렇습니다.

이 기사에서는 우리가 보증하는 훌륭한 WordPress 제휴 프로그램을 많이 찾을 수 있습니다.

Rel="Noopener" 속성에 대한 마지막 생각

이 게시물에서 우리는 rel=”noopener” 속성과 그 동반자인 rel=”noreferrer” 속성 뒤에 숨은 목적을 살펴보았습니다. 우리는 그들의 목적이 무엇인지, 그리고 새로운 WordPress 업데이트가 이제 이것을 모든 링크에 기본값으로 추가하는 방법을 살펴보았습니다. 그럼에도 불구하고 WordPress가 작동하는지 항상 다시 확인해야 합니다. 또한 noopener 링크가 dofollow 및 nofollow 링크와 어떻게 관련되고 어떻게 다른지 살펴보았습니다.

rel="noopener" 속성은 웹사이트를 안전하게 유지하기 위해 존재하며 항상 사용해야 한다는 것을 기억하십시오. SEO나 제휴사 링크에는 영향을 미치지 않습니다. 이 기사가 모든 내용과 모든 콘텐츠의 링크에 속성을 포함하는 것이 중요한 이유를 더 잘 이해하는 데 도움이 되었기를 바랍니다.

댓글로 여러분의 생각을 알려주세요. 리버스 탭 내빙의 피해자가 된 적이 있습니까? 항상 rel=”noopener” 속성을 사용하고 있습니까?

MarySan/Shutterstock.com을 통한 주요 이미지