CLOSE

無障礙網頁

縮小進入網站的門檻,使企業接觸到更多的受眾

INTRODUCTION

無障礙網頁簡介

在網路如此發達的現代,對於身心障礙人士而言,上網這個動作似乎很難成為生活中的一部分,而基於人權平等以及關懷社會弱勢族群的理念上,建立無障礙網站對於特定族群而言是意義非凡的。

讓網站符合無障礙建制規範會有一些優勢,比如說 HTML 語意標記能讓搜尋引擎更好理解網站內容,提升 SEO 成效 ; 關心社會弱勢族群,提升企業形象 ; 涵蓋不同身份的使用者,讓網站受眾範圍變得更寬廣。

無障礙網站設計要點參考

社會層面

SOCIAL

經濟層面

ECONOMIC

無障礙網頁
為什麼如此重要

無障礙空間、無障礙通道對我們來說不陌生,這些設施對於行動不便的人來說,是可以有效降低他們面對障礙的門檻。基於社會層面,身心障礙者有享受上網、獲得資訊的權利;在經濟層面上,企業也能藉此觸及更多的客戶。

遵循四項開發原則

在政府的無障礙網站空間服務網中,共列舉了四項原則

  • 無障礙網頁 製作  無障礙網站架設 無障礙網頁設計| 鵠崙設計01

    可感知

    網頁資訊內容對任何形式的操作都必須為易於感知,比如影片必須要具有字幕以利於聽障者了解資訊。

  • 無障礙網頁 製作  無障礙網站架設 無障礙網頁設計| 鵠崙設計02

    可操作

    在閱讀網站所需動作上必須多元化,不能有只能以單一方式來操作的元素,比如要為視障者提供鍵盤閱讀網頁功能

  • 無障礙網頁 製作  無障礙網站架設 無障礙網頁設計| 鵠崙設計03

    可理解

    任何形式的資訊內容都需簡單明暸,如果有專有詞必須以其他易於理解都方式呈現,易於身心障礙者理解。

  • 無障礙網頁 製作  無障礙網站架設 無障礙網頁設計| 鵠崙設計04

    穩健性

    無論網站操作方式與內容都必須具有長遠性,不會隨者網頁技術發展造成不同狀況的使用困難。

確保五個設計要點

從設計網頁樣式上開始改善優化,假字假字假字假字

01

使用能支援可訪問性的內容管理系統(CMS)

在架設、建構網站時,為了要確保整體網站的頁面佈局、主題、工具各方面,能與最開始我們所說的無障礙網站相關架設規範兼容,比如在編輯工具欄應該包含標題等,因此選擇使用可以支持網頁可訪問性的內容管理系統(CMS),常見的像是WordPress 或是Drupal等。

使用標題來構建網頁內容

使用標題來構件網站內容,除了能讓網頁的內容更易被所有瀏覽者消化吸收以外,也能使視障者上網時使用輔具能更加的流暢,視障者要取得螢幕上的訊息,必須依靠螢幕閱讀器與相關的系統,經過轉換後透過點字和語音來瞭解螢幕上的資訊。當我們將標頭透過<h1>、<h2>等方式進行整齊排列,將更容易被螢幕閱讀器所讀取。

02
03

圖像增加替代文字

因為當視障者使用螢幕閱讀器讀取網站內容時,都是透過文字來獲取訊息,而如果沒有將網頁上的圖像加上一些描述內容的話,所有的圖像在視障者眼裡都只是語音的一句「圖像」。我們看到的風景圖、各種有趣的插圖,傳到他們耳朵裡都是一樣的,因此必須確保將每張圖片都編寫描述性的摘要,使每張圖片對所有瀏覽者都有意義。

確保網站對鍵盤友好

目前有許多輔助身心障礙者的技術都是只依賴純鍵盤操作下進行的,像是我們前面所提到的視障者所使用的螢幕閱讀器,就是以不使用鼠標的情況下瀏覽各個網站,因此在架設網站時我們也必須確保這個網站是能在不使用滑鼠的情況下運行,包含我們能透過鍵盤進入網站的所有頁面、連結與內容等。

04
05

謹慎地使用適當顏色

當視網膜中的感光細胞無法對不同波長的光做出適當反應時,就會發生色盲。全球,根據color-blindness.com的數據,大約0.5%的女性和8%的男性患有某種形式的色盲,當我們在設計網站時,如果開發人員沒有將網頁調整為適當的顏色對比度時,色盲和其他殘疾者將較難找到網頁資訊,所以也必須考量到他們所看到介面的樣子進行網頁優化。

將成功獲得無障礙標章

讓有身障的人能通行無阻!

  • 無障礙網頁 製作  無障礙網站架設 無障礙網頁設計| 鵠崙設計05
    A等級標章
  • 無障礙網頁 製作  無障礙網站架設 無障礙網頁設計| 鵠崙設計06
    AA等級標章
  • 無障礙網頁 製作  無障礙網站架設 無障礙網頁設計| 鵠崙設計07
    AAA等級標章

CLIENTS

客戶案例
CONTACT US

想了解更多資訊內容嗎?歡迎立即聯繫鵠崙設計!