適用於 Google 的連結最佳做法

Google 在判斷網頁的關聯性並尋找要檢索的新網頁時,會將連結視為信號。瞭解如何讓 Google 能夠檢索您的連結,以便系統透過網頁上的連結找到您網站上的其他網頁,以及如何改善錨定文字,讓使用者和 Google 更容易理解內容。

一般來說,Google 只能檢索含有 href 屬性的 <a> HTML 元素 (也稱為「錨點元素」) 連結。Google 檢索器不會剖析和擷取其他格式的大部分連結。如果 <a> 元素中沒有 href 屬性,或是其他會因指令碼事件而產生連結效用的標記,Google 就無法準確擷取其中的網址。以下列舉一些 Google 可以和無法剖析的連結:

建議採用 (Google 可以剖析)

<a href="https://example.com">
<a href="/products/category/shoes">
<a href="./products/category/shoes">
<a href="/products/category/shoes" onclick="javascript:goTo('shoes')">
<a href="/products/category/shoes" class="pretty">

不建議採用 (但 Google 可能仍會嘗試剖析):

<a routerLink="products/category">
<span href="https://example.com">
<a onclick="goto('https://example.com')">

請確保 <a> 元素中的網址會解析為實際的網址 (也就是類似 URI),而 Google 檢索器能夠傳送要求給這些網址,例如:

建議採用 (Google 可以解析):

<a href="https://example.com/stuff">
<a href="/products">
<a href="/products.php?id=123">

不建議採用 (但 Google 可能仍會嘗試解析):

<a href="javascript:goTo('products')">
<a href="javascript:window.location.href='/products'">

錨定文字刊登位置

「錨定文字」(也稱為「連結文字」) 是連結的顯示文字。使用者和 Google 可以從這類文字稍微瞭解連結所導向的網頁。錨定文字的安插位置在 Google 可檢索的 <a> 元素之間

良好:

<a href="https://example.com/ghost-peppers">鬼椒</a>

不佳 (空白連結文字):

<a href="https://example.com"></a>

如果 <a> 元素因某些原因空白,Google 可以使用 title 屬性做為錨定文字的替代方案。

<a href="https://example.com/ghost-pepper-recipe" title="如何醃鬼椒"></a>

針對圖片連結,Google 會使用 img 元素的 alt 屬性做為錨定文字,因此請務必在圖片中加入描述性替代文字

良好:

<a href="/add-to-cart.html"><img src="enchiladas-in-shopping-cart.jpg" alt="將辣肉餡捲餅新增至購物車"/></a>

不佳 (空白替代文字和空白連結文字):

<a href="/add-to-cart.html"><img src="enchiladas-in-shopping-cart.jpg" alt=""/></a>

如果您是使用 JavaScript 插入錨定文字,請使用網址檢查工具確保該文字確實出現在轉譯後的 HTML 中。

撰寫合適的錨定文字

合適的錨定文字應具備說明性、簡明扼要,且與所在網頁以及連結至的網頁有關聯性,可為連結提供脈絡資訊,並讓讀者對連結內容稍有概念。 錨定文字寫得越好,使用者就越容易瀏覽,Google 也越容易瞭解您連結的網頁內容。

不佳 (太不具體):

<a href="https://example.com">按這裡</a>瞭解詳情。
<a href="https://example.com">瞭解詳情</a>
前往<a href="https://example.com">網站</a>進一步瞭解我們的起司。
歡迎參閱<a href="https://example.com">這篇文章</a>,進一步瞭解起司的製作過程。

較佳 (較具說明性):

如需可供購買的起司完整清單,請參閱<a href="https://example.com">起司類型清單</a>

不佳 (異常冗長):

從下週二開始,<a href="https://example.com">Knitted Cow 邀請威斯康辛當地居民參與重新開幕的盛大活動,前 20 名顧客將獲贈乳牛造型冰雕</a>

較佳 (較簡潔):

從下週二開始,<a href="https://example.com">Knitted Cow 邀請威斯康辛當地居民</a>參與重新開幕的盛大活動,前 20 名顧客將獲贈乳牛造型冰雕

請盡可能以自然的方式撰寫文字,避免勉強塞入所有與連結網頁相關的關鍵字 (提醒您,濫填關鍵字違反垃圾內容政策)。不妨問問自己,讀者是否需要這些關鍵字來理解接下來要前往的網頁?如果您感覺像刻意在錨定文字中塞入關鍵字,那可能就過頭了。

別忘了為連結提供上下文:連結前後的文字很重要,請留心句子的整體性。請勿接連擺放多個不同的連結,讀者會難以區分各連結,您也無法提供每個連結的上下文。

不佳 (過多連結彼此相鄰):

<a href="https://example.com/page1"></a> <a href="https://example.com/page2"></a>寫了 <a href="https://example.com/page3"></a> <a href="https://example.com/page4"></a> <a href="https://example.com/page5"></a>跟起司有關的事。

較佳 (連結之間以上下文隔開):

我今年寫了很多次跟起司有關的事:誰忘得了<a href="https://example.com/blue-cheese-vs-gorgonzola">藍紋起司和拱佐洛拉起司的爭議</a>、贏得 Cheesiest Research 獎章的<a href="https://example.com/worlds-oldest-brie">世上最古老的布里起司</a><a href="https://example.com/the-lost-cheese">〈失落的起司〉</a>史詩級的改寫,以及我個人的最愛,<a href="https://example.com/boy-and-his-cheese">〈男孩和他的起司〉:一對不可思議的好友</a>

通常情況下,您可能只會想到指向外部網站的連結,不過,如果能夠多花心思處理內部連結的錨定文字,有助於使用者和 Google 理解您的網站,並找到您網站上其他網頁。您網站上的每個重要網頁,都該至少有一個其他網頁提供該網頁的連結。思考一下網站上的其他資源可如何協助讀者瞭解網站上的特定網頁,並在適當的脈絡中提供這些網頁的連結。

連結至其他網站不是什麼可怕的事;事實上,使用外部連結有助於建立可信度 (例如引用資料來源)。必要時,不妨附上外部網站的連結,並向讀者說明連結的內容。

正確 (註明來源)

根據瑞士研究者最近的研究顯示,讓艾曼塔輪狀起司聽音樂,可增添輕微的風味 (與未聽音樂的控制組起司相比),完整的研究結果可參閱《<a href="https://example.com">環場音效中的起司 — 廚藝實驗</a>》。

只有在不信任來源時,才使用 nofollow,請勿套用到網站上所有的外部連結。舉例來說,假設您是起司愛好者,有人發布文章惡意攻擊您最愛的起司,您想要撰文回應,又不希望因為放上連結而提高對方網站的信譽。這時 nofollow 就能派上用場。

如果是您收費刊登的連結,請使用 sponsorednofollow 說明自家網站與連結的關係。如果使用者能在您的網站中插入連結 (例如有論壇區段或問與答網站),也請在這些連結中加入 ugcnofollow