內部連結與錨點文字：a 標籤的 SEO 寫法
超連結 在 SEO 裡做兩件事：讓爬蟲走得到頁面，以及 用錨點文字說明目標頁面在講什麼。前者決定頁面能不能被發現，後者影響它以什麼主題被理解。
錨點文字要說得出目標內容
這些寫法等於什麼都沒說
<p>詳細說明請看 <a href="/seo/meta-title">這裡</a> 。</p>
<p><a href="/seo/meta-title">更多</a></p>
<p><a href="/seo/meta-title">點我</a></p>
<p><a href="/seo/meta-title">https://example.com/seo/meta-title</a></p>搜尋引擎從「這裡」推不出目標頁面的主題。對 螢幕閱讀器使用者 更嚴重，他們常用連結清單瀏覽頁面，一串「這裡」、「更多」完全無法分辨要去哪。
改法很簡單，把連結套在有意義的字上：
<p>詳細說明請看 <a href="/seo/meta-title">網頁標題的寫法</a> 。</p>| 原則 | 說明 |
|---|---|
| 說得出目標主題 | 「網頁標題的寫法」而不是「這裡」 |
| 簡短 | 一句話裡的幾個字，不要整段都是連結 |
| 自然 | 寫進句子裡，不是硬塞關鍵字 |
| 一致 | 同一個目標在全站用相近的說法 |
不要堆疊關鍵字
錨點文字也算在關鍵字堆疊裡
<!-- 過度優化，反而是負面訊號 -->
<a href="/products">網頁設計 網站設計 網頁製作 推薦</a>錨點文字的堆疊和 keywords 的堆疊 一樣會被視為操縱行為。自然寫就好。
同一頁重複連結的處理
搜尋引擎通常只採用同一頁中指向 同一目標的第一個連結 的錨點文字。
<!-- 第一個連結的錨點文字才是主要依據 -->
<p><a href="/seo/meta">檔頭 meta 標籤</a> 有三大類。</p>
<p>前面提到的 <a href="/seo/meta">那一篇</a> 有完整清單。</p>第一次出現時就寫好
後續重複的連結主要是為了讀者的方便，不必刻意避免，但也不必期待它有額外的 SEO 效果。
用 a 而不是 button 或 div
div 加點擊事件有三個問題一次來
<!-- 不能用鍵盤操作、螢幕閱讀器不知道是連結、爬蟲走不到 -->
<div onclick="location.href='/products'">商品</div>判斷方式：
| 目的 | 該用 |
|---|---|
| 導到另一個網址 | <a href> |
| 在原地執行一個動作 | <button> |
前端框架的路由連結也要渲染成帶 href 的 <a>：
<!-- 爬蟲讀得到網址，同時保有用戶端切換 -->
<a href="/products" @click.prevent="router.push('/products')">商品</a>多數路由套件的連結元件已經這樣做了
Vue Router 的 RouterLink 預設就渲染成 <a href>。要小心的是自己用 <button> 加 router.push 手寫的版本。
內部連結的佈局
站內連結決定了 爬蟲能走到哪，以及 頁面之間的重要性關係。
| 原則 | 說明 |
|---|---|
| 重要頁面從首頁三步內可達 | 深度越淺，被收錄的機會越高 |
| 每個頁面至少被一處連到 | 避免 孤兒頁面 |
| 相關內容互相連結 | 幫讀者也幫搜尋引擎建立主題關聯 |
| 用 麵包屑 表達階層 | 一致的位置訊號 |
延伸閱讀區是最有效的內部連結
文章結尾放三到四個相關頁面的連結，同時做到三件事：降低跳出率、幫爬蟲發現新頁面、建立主題關聯。
這個站的每一篇文章結尾都有這樣一區。
孤兒頁面
沒有被任何連結指到的頁面
它可能因為存在於 sitemap 而被收錄，但搜尋引擎會判斷它在網站結構中 不重要，因為連網站自己都沒有連向它。
排查方式是把兩份清單相減：
# 1. sitemap 裡的所有網址
curl -s https://example.com/sitemap.xml | grep -oP '(?<=<loc>)[^<]+' | sort > sitemap.txt
# 2. 從首頁爬，實際走得到的網址（用爬蟲工具產出）
# 3. 兩者相減，差集就是孤兒頁面
comm -23 sitemap.txt crawled.txt找到之後，從相關的頁面補上連結。
nofollow 三兄弟
rel 屬性用來標示 連結的性質：
| 值 | 用在 |
|---|---|
nofollow | 不想背書的一般外部連結 |
sponsored | 付費連結、廣告、業配 |
ugc | 使用者產生的內容（留言、論壇貼文） |
<!-- 業配連結 -->
<a href="https://sponsor.example.com" rel="sponsored">合作夥伴</a>
<!-- 留言裡的連結 -->
<a href="https://user-site.example.com" rel="ugc nofollow">使用者的網站</a>
<!-- 不想背書的引用 -->
<a href="https://unverified.example.com" rel="nofollow">某個來源</a>這三個現在是提示而非命令
搜尋引擎會自行決定是否採納。它們的價值在 標示連結性質（尤其是揭露付費關係，那是政策要求），而不是精算權重流向。
站內連結不要加 nofollow
早期的權重雕塑做法已經無效
有一種舊做法是對登入頁、購物車等不重要的頁面加 nofollow，想把權重集中到重要頁面。那已經無效，而且沒有意義。
正確的工具對應：
| 目的 | 該用什麼 |
|---|---|
| 不想被收錄 | 頁面標 noindex |
| 不想浪費爬取預算 | robots.txt 的 Disallow |
| 標示付費關係 | rel="sponsored" |
| 控制站內權重 | 沒有這種工具，改用連結佈局 |
外部連結的其他屬性
<!-- 開新視窗時務必加上安全屬性 -->
<a href="https://example.com" target="_blank" rel="noopener noreferrer">
外部網站
</a>| 屬性 | 作用 |
|---|---|
noopener | 防止新視窗透過 window.opener 操作原頁面 |
noreferrer | 不傳送來源網址 |
現代瀏覽器對 target="_blank" 已隱含 noopener
但明寫出來仍是好習慣，尤其要考慮舊瀏覽器。noreferrer 則要斟酌，它會讓對方看不到流量來源，如果您希望對方知道流量來自您的網站就不要加。
圖片連結的錨點文字
圖片當連結時，alt 就是錨點文字：
<!-- alt 描述「點下去會到哪」，而不是圖片長什麼樣 -->
<a href="/products/wireless-mouse">
<img src="/mouse.webp" alt="無線滑鼠商品頁" width="400" height="300">
</a>這和一般的 替代文字原則 不同，一般圖片描述內容，連結圖片描述目的地。
檢查清單
| 項目 | 標準 |
|---|---|
| 沒有「這裡」、「更多」、「點我」這類錨點文字 | 必備 |
| 錨點文字說得出目標主題 | 建議 |
導頁用 <a href> 而非 <div onclick> | 必備 |
| 沒有孤兒頁面 | 必備 |
| 重要頁面從首頁三步內可達 | 建議 |
付費連結標了 rel="sponsored" | 必備 |
留言區連結標了 rel="ugc" | 建議 |
target="_blank" 有加 rel="noopener" | 建議 |
站內連結沒有濫用 nofollow | 建議 |
圖片連結的 alt 描述目的地 | 建議 |
常見問題
為什麼不能把連結文字寫成「這裡」？
錨點文字是搜尋引擎判斷目標頁面主題的依據之一，寫「這裡」等於什麼都沒說。對螢幕閱讀器使用者更嚴重，他們常用連結清單瀏覽頁面，一串「這裡」「更多」完全無法分辨要去哪。
同一頁可以重複連到同一個目標嗎？
可以，但意義不大。搜尋引擎通常只會採用同一頁中指向同一目標的第一個連結的錨點文字。所以第一次出現時就把錨點文字寫好，後續重複的連結主要是為了讀者的方便。
什麼是孤兒頁面？
沒有被站內任何頁面連到的頁面。它可能存在於 網站地圖 裡而被收錄，但因為沒有任何連結指向它，搜尋引擎會判斷它在網站結構中不重要。排查方式是把網站地圖的網址清單與爬蟲實際走到的清單相減。
nofollow、sponsored、ugc 該怎麼選？
付費連結、廣告與業配用 sponsored；留言、論壇貼文這類使用者產生的內容用 ugc；其餘不想背書的連結用 nofollow。這三個是標示連結性質，而不是精算權重流向。
站內連結需要加 nofollow 嗎？
不需要。早期有用它來控制權重分配的做法，那已經無效而且沒有意義。不想被收錄的頁面應該用 noindex ，不想浪費爬取預算的路徑用 robots.txt ，兩者都不是錨點屬性的工作。
