WordPress中的圖片替代文字與圖片標題


網絡上的許多內容都包含圖像。 但是,沒有多少網站所有者為提高速度或更好的搜索排名而優化圖像。

即使WordPress帶有添加alt文本和圖像標題的選項,但初學者常常不了解它們的區別以及如何使用它們。

在本文中,我們將分享WordPress中圖片替代文本與圖片標題之間的區別,以便您可以改善圖片SEO。

在WordPress中使用圖片替代文字和標題

什麼是替代文字和圖片標題?

替代文字是替代文字的縮寫。 這是添加到HTML中的圖片標籤的屬性。 這可以幫助看不到圖片的訪問者和搜索引擎機器人了解圖片的含義。

如果找不到或由於任何原因無法顯示頁面上的圖像,也會顯示替代文本。

替代文字與圖片標題不同。 標題是將鼠標指針移到圖像上方時在一個小的彈出框中顯示的文本。

帶有標題文字的圖片 "我花園裡的花"

Alt標籤和圖像標題也可用於為視力不佳或屏幕閱讀器設備較弱的人提高網站的可訪問性。

屏幕閱讀器將閱讀您的文章文字,當涉及圖片時,它將閱讀替代文字。 根據用戶的設置,它可能還會讀取標題文本。

對於可訪問性和搜索引擎優化(SEO)而言,替代文本比標題文本更重要。 這就是為什麼我們強烈建議您為所有圖像添加替代文本的原因。

專家提示: 我們建議使用適用於WordPress的All in One SEO插件添加適當的圖片站點地圖和其他SEO功能,以提高您的SEO排名。

如何在WordPress中向圖像添加替代文本

WordPress允許您輕鬆為圖像添加替代文本。 只需創建一個新的帖子或頁面,或編輯一個現有的帖子或頁面,然後添加一個圖像塊。

如果您不確定如何添加塊,或者需要有關塊編輯器的其他幫助,只需查看我們有關如何使用WordPress塊編輯器的教程。

首先,上傳您的圖像或將其拖放到“圖像”塊中。 然後,您可以在頁面右側設置替代文本。

在WordPress區塊編輯器中向圖片添加替換文字

您還可以通過以下步驟向圖片添加替換文字: 媒體»圖書館 然後點擊圖片進行編輯。

請記住,這不會更改您已插入帖子或頁面中的該圖像的任何實例的替代文本。 但是,如果您在此處添加替代文本後將圖像添加到帖子或頁面,則替代文本將包含在其中。

在WordPress媒體庫中查看或編輯圖像的替代文本

如果您仍在使用經典的WordPress編輯器,則可以在添加圖像時添加圖像alt文本。

首先,點擊發布框上方的“添加媒體”。

在經典編輯器中單擊“添加媒體”以將圖像添加到您的帖子中

從計算機上載圖像,或單擊“媒體庫”選項卡以查看您已經上載的圖像。

接下來,單擊所需圖像以選擇它,然後在圖像的“附件詳細信息”中鍵入所需的替代文本:

在經典編輯器中向圖像添加替代文本

如何在WordPress中添加圖片標題

您可以將兩種標題屬性添加到圖像中。

默認的WordPress標題屬性未添加到圖像的HTML代碼中。 WordPress內部使用它來識別媒體文件。

如果要向圖像添加標題,則需要使用媒體庫來完成。 在視覺編輯器中編輯圖像時,當前無法為圖像添加標題。

對於圖像SEO或具有屏幕閱讀器的用戶,標題不是必需的。 但是,它在某些情況下很有用,因為當用戶將鼠標移到圖像上時,它可以讓您提供信息。

WordPress用戶(包括一些經驗豐富的用戶)通常會感到困惑的一件事是,WordPress使您可以給圖像命名。 這與圖像標題屬性完全分開。

例如,在媒體庫中編輯圖像時,您會看到“標題”字段:

在媒體庫中查看或編輯圖像的標題

WordPress使用此處的“標題”來識別圖像。 當您點擊屏幕底部的“查看附件頁面”鏈接時,您會看到標題用作該頁面上的標題:

查看圖像的附件頁面,並顯示圖像標題

儘管這在某些情況下可能會有所幫助,但它與圖像的title屬性不同。 那麼如何創建它呢?

在舊的經典編輯器中,您可以通過單擊圖像然後單擊鉛筆圖標來添加title屬性:

在WordPress經典編輯器中編輯圖像

然後,您將看到“圖像詳細信息”屏幕。 要設置圖片標題屬性,請點擊底部“高級選項”旁邊的向下的小箭頭:

單擊向下箭頭以查看圖像的高級詳細信息

然後,您可以設置圖像的標題屬性。

在經典編輯器中設置​​圖像標題屬性

不幸的是,在塊編輯器中,編輯圖像的title屬性並不是那麼容易。 仍然有可能。 您可以正常添加圖像,然後將其編輯為HTML代碼。

要切換到塊的HTML視圖,請單擊“更多選項”(3個垂直點),然後單擊“編輯為HTML”。

將圖片編輯為HTML

它可能看起來有些混亂,但是您需要知道的是 標籤就是創建您的圖片的原因。 您將在此處看到圖像的文件名。

圖片的HTML代碼

要將title屬性添加到圖像,您只需要添加 title="Your image title here" 像這樣的圖像標籤:

一束可愛的水仙花

將image屬性放在image標籤的哪個位置都沒關係。

輸入標題後,您會看到一條警告消息,提示“此阻止包含意外或無效的內容。”

警告消息說該塊包含意外內容

只需單擊“轉換為HTML”按鈕,您的圖像塊將轉換為HTML代碼。 它仍會像以前一樣完全顯示在您的站點上,但是您將無法使用塊編輯器來編輯圖像。

為什麼以及如何使用替代文字和圖像標題

我們強烈建議對所有圖像使用替代文字。 在WPBeginner上,我們還為所有圖像添加了標題。 但是,這比替代文本重要。

替代文字很重要,因為Google專注於將其作為圖片的排名因素。 屏幕閱讀器還使用它來幫助視力受損的訪問者充分參與您的內容。

重要的是不要將關鍵字填充到alt和title標籤中。 使它們具有描述性和幫助性,以便對需要它們的訪問者有用。 您可以在相關位置使用關鍵字,但不要過度使用。

例如,如果您要撰寫有關最佳WordPress託管的文章,那麼您的目標關鍵字可能是“最佳WordPress託管”。

您的文章中可能有一個屏幕截圖,向用戶顯示瞭如何使用流行的Web主機(例如Bluehost)設置帳戶。

以下是該圖片的替代文本的一些可能選項:

  • “帳戶設置” –描述性不強,也不包含與您的關鍵字相關的任何內容
  • “最佳WordPress託管,WordPress託管,WordPress最佳Web託管” –這沒有描述圖片,而是塞滿了關鍵字
  • “設置WordPress託管帳戶” –這是更好的方法,因為它具有描述性,並且可以自然而適當地使用部分關鍵字

我們希望本文能幫助您了解WordPress中的圖片替換文字和圖片標題之間的區別。 您可能還想看看我們的初學者友好指南,其中介紹瞭如何優化網絡圖像以加快網站速度,以及我們對最佳WordPress SEO插件和工具的比較,以提高您的排名。

如果您喜歡這篇文章,請訂閱我們的YouTube頻道WordPress視頻教程。 您也可以在找到我們 推特 和Facebook。