External link attributes - Githubissues

rootEnginear / my-common-patterns

Pattern CSS/JS ที่มักจะใช้บ่อยๆ ตอน Dev จะได้เปิดมา Copy ง่ายๆ

https://rootenginear.github.io/my-common-patterns/

MIT License

1 stars 0 forks source link

External link attributes #4

Open rootEnginear opened 2 years ago

rootEnginear commented 2 years ago

<a href="..." target="_blank" rel="nofollow noopener noreferrer">...</a>

`nofollow`

ใช้เพื่อไม่ให้ SEO Bot ตามลิงก์นั้นไปต่อ ซึ่งอาจส่งผลให้ได้คะแนน Backlink น้อยลง
เกิดขึ้นมาเพื่อแก้ปัญหา spam comment เอา backlink
สามารถเอาไว้ใช้กับลิงก์ไปหน้า technical แบบ signup form/dashboard ได้
ช่วยลดความเสี่ยงว่าเราไปสแปมเว็บอื่นเอา backlink ได้

`noopener`

ไม่ให้เบราเซอร์เอา object window ของหน้าก่อนหน้าใส่เข้าไปใน window.opener ของหน้าถัดไป
ไม่อย่างนั้นหน้าถัดไปจะสามารถแอบแก้หน้าก่อนหน้าด้วยการใช้ window.opener ได้
ในปี 2021 เบราเซอร์ต่างๆ จะแอบเซ็ตค่า rel=noopener ของ a[target=_blank] ไว้ให้แล้ว (ตามสเปกนี้)

`noreferrer`

บอกให้เบราเซอร์ไม่ต้องใส่ header Referer ลงไปใน request
มีผลข้างเคียงแค่ว่า analytic จะมองว่าเป็น direct traffic (พิมพ์ลิงก์เข้ามาเองโดยตรง) แทนที่จะมาจากเว็บอื่น แค่นั้น

Refs