圖片替代文字是什麼？對 SEO 有加分嗎？為什麼圖片會顯示失效替代文字？
在瀏覽網站時，你是否曾遇過圖片無法顯示，但圖片原本的位置出現了一段文字？這段文字就是「替代文字（alt text）」，中文常稱作「圖片說明文字」或「圖片替代文字」。但你知道嗎？這不只是畫面上的補充說明，更在無形中對網站的搜尋引擎優化（SEO）加了不少分！
一、什麼是圖片替代文字？
替代文字（alt text）是一種 HTML 屬性，用來描述圖片的內容。當圖片因各種原因無法載入，或使用者使用的是螢幕閱讀器（如視障者），替代文字會被顯示或唸出，提供圖像內容的說明。
舉例
這樣即使圖片載入失敗，瀏覽器也會顯示「前網數位公司 Logo」的文字內容，使用者不會一頭霧水。
二、圖片替代文字的三大功用
1. 改善無障礙使用體驗（Accessibility）
對於使用輔助科技的使用者來說，替代文字是他們「看見」圖片內容的唯一方式。這是建構一個友善、無障礙網站的基本要素。
2. 優化 SEO 表現
Google、Bing 等搜尋引擎無法「看懂」圖片內容，而是透過替代文字來理解圖片的主題。因此，設定精準的替代文字能夠讓圖片出現在 Google 圖片搜尋中，增加曝光與網站流量。
3. 圖片失效時的備案
若圖片路徑錯誤、伺服器故障、使用者網路不穩等導致圖片無法載入，替代文字會自動出現在原本圖片的位置，維持網站內容的完整性。
三、該怎麼寫好的替代文字？
撰寫圖片的 alt 文字時，有幾個小技巧：
|
❌ 不建議的寫法 |
✅ 建議的寫法 |
|---|---|
|
alt="圖片1" |
alt="產品外觀圖：白色陶瓷馬克杯，印有前網 Logo" |
|
alt="banner" |
alt="2025 年企業形象網站限時優惠活動橫幅" |
小提醒：避免關鍵字堆砌，也不要只用「圖片」、「photo」等籠統詞彙，應具體描述內容。
四、哪些圖片可以不用加替代文字？
如果圖片純粹是裝飾性用途（例如：分隔線、背景圖），可以設定為 alt=""，表示這張圖片沒有實質資訊，讓輔助閱讀工具跳過這張圖。
五、總結：替代文字，為網站加分的小細節
圖片替代文字看似小細節，卻是影響網站 SEO 與使用者體驗的重要元素。別再忽略它了！從今天開始，每次上傳圖片，都別忘了填寫恰當的 alt 文字，讓你的網站在搜尋引擎與使用者眼中更友善、更專業。
相關文章
【圖片壓縮懶人包】網站圖片為什麼要壓縮？壓縮到多少才剛好？有推薦工具嗎？
圖片在網站中扮演重要角色，但未經壓縮的圖片會拖慢網站速度，影響SEO排名與用戶體驗。建議根據不同用途設定適當尺寸與大小，平衡畫質與容量。推薦壓縮工具包括TinyPNG、Squoosh、ILoveIMG等，也可利用Photoshop或Figma內建功能。為避免問題，圖片命名應清楚且支援Retina顯示器。掌握正確壓縮方法，打造輕盈快速的網站，提升專業度與效能。如欲瞭解更多網站運營相關問題，歡迎聯繫前網數位，持續關注我們的文章！
網站圖片尺寸與比例的差異是什麼？為什麼編輯器裡圖片尺寸沒有限制？
圖片在網站中扮演關鍵視覺角色，但「尺寸」與「比例」不清楚就容易出現破圖、跑版或載入速度慢的問題。本篇文章說明了尺寸與比例的差異、為什麼 CMS 編輯器會開放自由上傳、常見建議尺寸範例，以及圖片比例不一致會導致的排版問題，讓你在網站建置與維護中更順利。
響應式網站設計之圖片很有事｜為什麼我的網站圖片在手機版被裁切了？
當你開心地打開新建好的網站時，卻發現圖片在手機上被裁切、重要內容消失，甚至整張圖片變得模糊不清，是不是覺得有點困惑又無奈？很多人不知道，網頁上的圖片不僅僅是「看起來漂亮」那麼簡單。這篇文章將帶你了解響應式網站中圖片的常見問題，並提供一些簡單實用的解決方法，讓你的圖片在任何裝置上都能完美呈現！