iT邦幫忙

3

為什麼超連結是藍色和有底線?了解無障礙網站設計!

https://ithelp.ithome.com.tw/upload/images/20200705/20116357uCE7tkYnZa.png

由於藍色盲是所有色盲患者中佔最少數或極為罕有,色盲是指看見顏色及辨別顏色的能力減退的狀況,所以 超連結 使用藍色可以讓最多人了解其功用和受惠。

加入一起討論?

什麼是網頁親和力?

在網際網路的普及下,網頁親和力確保任何人可以平等地從網頁裡的理解內容。在實現網頁親和力的規範上,國際組織 W3C 發表了「網頁內容無障礙設計指引」 (WCAG 2.0)。其中包括了有關色彩通用設計的指南。

  • 不要以顏色為唯一識別資訊的方法。
  • 不要單以顏色指示圖片裡的事物,應以其他特徵指示。
  • 紅色的盒子、藍色的盒子。→紅色長方體的盒子、藍色正方體的盒子。
  • 不要單以顏色來表示超連結,應強調標示。
  • 不要單以顏色來提示已更新/未完成,應改變顯示文字。
  • 不要單以顏色來反白未填寫表單提示用戶未填寫,應加入提示文字。

如果我不幸是【藍色盲】,看不到藍色怎麼辦?

底線 (Underline) 這個設計,就是作為補漏的作用,藍色盲患者可以透過底線去識別是否超連結,這系列的動作作為無障礙網站設計的組成份子。但部分 WordPress 佈景主題 為了美觀,移除了底線的設計,這要看站長如何取捨平衡得失。

參考來源:

色盲:維基百科,自由的百科全書
什麼是網頁親和力


您可能會有興趣的 WordPress 相關文章:

免費建立網站教學,看這篇就足夠

WordPress 教學:小樹苗成長課程

HTML 標題語法 h1 至 h6 的使用原則和 SEO 的影響因素

免費 WordPress 新手必備素材包

什麼是 DA (Domain Authority 網域權威值) 和 PA (Page Authority 頁面權威值) ?

免費高品質和可商業使用圖庫推薦

Loom 是免費螢幕錄影工具,提供免費版和付費版 – 雲端錄制影片測試

100 個安裝 WordPress 後的小技巧

【Google Fonts 應用】如何在 WordPress 網站上使用 Google 中文字體?

WPWebHost 建立部落格完整流程 – 從 Logo 設計到 SEO 最佳化

為什麼 WordPress 是免費?


什麼是 WordPress 社群生態普查與研習 - 網站迷谷

https://ithelp.ithome.com.tw/upload/images/20190427/20116357LGQmfn1DSo.png

一群喜歡網站架設的愛好者
推動 WordPress 社群持續的健康發展
建立關愛和共融的互動社群
適合完全沒有任何基礎和
不懂程式的入門者和新手
只要您勇敢踏出第一步
要建立自己的部落格或網站
其實沒有非常困難

第一次網站製作嗎?
歡迎來到我們的社團
學習網頁設計

免費 WordPress 線上影片教學課程

WordPress Valley - 網站迷谷【免費教學網站】

WordPress Valley - 網站迷谷【Facebook 討論社團】

WordPress Valley - 網站迷谷【追蹤 Instagram】


圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言