一.若是有意義之照片（如課程照片、活動花絮），建議圖形替代文字應該為「．．．活動（課程）照片」等易於理解之文字，而不該為「XXX.JPG 」或「照片」等不易理解之文字。

二.若是無意義之照片（如花、草）等，建議圖形替代文字設定為「 」即可。

範例：
<img src="tku-play.gif" alt="淡江一日遊活動花絮">

<img src="yellow-flower.gif" alt=" ">

◎效果預覽:

其實並沒有一定的標準，一般建議以alt+U（上方區塊）、alt+L（左方區塊）、alt+R（右方區塊）、alt+C（中央區塊）、alt+Ｂ（下方區塊）為原則，亦可視需求自行調整，但同網站網頁（包括不同語言版本網頁）建議網頁導盲磚快速鍵以設置一致為佳。

一、網站如採用共用框架設計，建議設置網頁導盲磚，以方便視障者以tab鍵快速跳躍瀏覽，由於網頁導盲磚的快速鍵組合，有助於視障者瞭解網站版面配置，因此：組合鍵在設計時，建議盡量配合網站版面，例如：左側選單區「alt鍵+L鍵（Left）」、右側選單區「alt鍵+R鍵（Right）」、上方選單區「alt鍵+U鍵（Up）」、下方選單區「alt鍵+R鍵B鍵（Below）」、主要內容區「alt鍵+C鍵Center」。

二、若網站並無採用共用框架設計，但在版面上仍有選單與內容區塊之區分，同樣也建議設置網頁導盲專。

三、組合鍵設置的位置，以該區塊的第一個選單之前為佳。

四、組合鍵的定義，建議與區塊版面的位置互相搭配。

五、如同一區塊有多行列選單，且選單數量較多時，建議可在每行列第一個選單之前，設置相同組合鍵，但須分別標明選單抬頭，如「上方主要選單區」、「上方次要選單區」等，以方便視障者辨別。

六、建議於網站導覽頁面上加上組合鍵的文字說明。

範例：
<br><a accesskey= "U" href="網站導覽連結">:::上方區塊</a></br>

或

<br><a accesskey= "U" href="網站導覽連結" title="上方區塊">:::</a></br>

◎效果預覽:

:::左側區塊

:::右側區塊

:::上方區塊

:::下方區塊

:::中央區塊

:::

:::

:::

:::

:::

由於視障者大多只使用鍵盤來代替滑鼠操作，因此把握住兩大原則：「網頁上的所有選項都能使用鍵盤操作方式來移動與選取」和「網頁上的所有連結文字（或title文字）與圖片alt替代文字都能清楚表達」，並且可以下列方式來做初步測試－

一、使用[TAB]按鍵可以按照上下或左右連續順序來瀏覽且可以停留在所有連結或選項上（滑鼠可點選處）。

二、使用滑鼠鼠標移動至圖片上可以出現易於理解之替代文字。

三、在網頁版面上若有分區塊並且已設置網頁導盲專快速鍵，使用這些快速鍵來確定焦點（小邊框）是否有停留在正確位置上（快速鍵對應區塊的第一個連結位置之前）。

一、「機器檢測階段」－由機器碼檢測程式（如ＦＲＥＥＧＯ）自動檢查並偵測受測網站（包括全網站所有網頁或單獨頁面）網頁原始碼是否有加入「必要的無障礙網頁設計元素」，例如在「圖形連結」相關原始碼中，是否已經加入了「ａｌｔ」（替代文字）宣告。

二、「人工檢測階段」－由視障者與明眼人搭配，實際操作與瞭解受測網站（全網站非跨站連結部份）網頁呈現方式是否符合「網頁溝通無障礙表達程度」，讓視障者易於理解，例如在「文字圖形按鈕」相關原始碼中，是否將圖形上的文字以純文字敘述（替代文字）正確而一致的予以表達，而並非只是描述「選項按鈕」而已。

三、受測網站必須先經由機器檢測程式測試網頁原始碼是否完全符合「必要的無障礙網頁設計元素」，如未符合，就必須退回原網站設計者予以修正，並再次檢測，直到符合，並由明眼檢視人員複檢是否正確一致始能完成；機器檢測通過後，再經由視障檢測人員與明眼檢視人員共同搭配，進行人工檢測階段，以徒手操作方式，來瞭解受測網站對於「網頁溝通無障礙表達程度」的呈現是否完善，並針對未盡完善部份提出紀錄與改善建議，再由原網站設計者進行改善與修正回覆，最後經人工複檢直到確定改善完成無誤後，才算完全符合與通過所有檢測流程。

由於一般非視障者擁有「正常視覺功能」，可以「視力直覺方式」瀏覽以獲取網路資源，並搭配「滑鼠」或「觸控裝置」來操控瀏覽位置與選擇對應動作；而一般視障者，則由於「正常視覺功能」喪失或不足，因此必須轉由「增強視覺功能」、「正常觸覺功能」或「正常聽覺功能」來取代「視力直覺方式」，而改以「放大閱讀方式」、「觸摸閱讀方式」或「聆聽吸收方式」來瀏覽網路資源，並搭配「擴視輸出裝置」、「點字或語音輸出裝置」與「鍵盤」來操控瀏覽位置與選擇對應動作；不過這些手段仍然不足以呈現網頁上的真實面貌，例如圖形、照片、美工文字、網頁背景、顏色搭配等，在一般瀏覽狀態下均無法適度而完整的呈現，所以就必須在網頁設計階段加入「彌補性替代方案」來改善「先天條件不足」的失調現象，以另外一種「增強式或非視覺呈現方式」來表達所要傳達的意義；因此，「無障礙網頁設計」對於視障者獲取與理解網路資源的意義非常重要，若缺乏無障礙網頁設計工程，視障者瀏覽網頁或搜尋網路資源將會變得極為艱困而無所適從。

頁面上的圖形替代文字，如圖形為項目符號，則建議以＊號為替代文字，如圖形為有意義圖形，例如：LOGO圖或照片，則建議以圖形名稱或說明為替代文字，如圖形為無意義圖形，例如：裝飾圖，則建議以一個空格為替代文字，不建議以例如「綠色小花」、「黃色星星」等圖片說明為替代文字。

範例：
<img src="spacer.gif" alt="LOGO圖">

◎效果預覽:

一、連結設於網址上，例如： 淡江大學網址：（文字）http://www.tku.edu.tw（連結）此種連結設置方式，視障者以tab鍵跳躍時，不易瞭解連結內容及功用，建議將連結設於容易瞭解內容及功用的文字上，例如：淡江大學（連結）或淡江大學網址： http://www.tku.edu.tw（連結），亦可設置於title內，例如： http://www.tku.edu.tw（連結+替代文字）。

範例：
<a href="http://www.tku.edu.tw/ " title=淡江大學>http://www.tku.edu.tw </a>

二、連結為檔案下載連結，例如：申請書（連結），建議將下載檔案的格式設置於連結內，例如：申請書.doc（連結）或申請書（word格式）（連結），亦可設置於title內，例如：申請書（連結+替代文字）。

三、連結為另開新視窗連結，建議標明另開新視窗，同時建議如為站外連結，採另開新視窗設計，並標明另開新視窗及站外連結，亦可將另開新視窗標於title內，例如：yahoo奇摩（連結+替代文字）

四、選單連結區，建議以tab鍵進行跳躍測試，測試是否依順序正常跳躍。

五、建議檢測網站內的連結，如為無效連結，建議進行修改或刪除。

◎效果預覽:

淡江大學網址：http://www.tku.edu.tw

淡江大學

淡江大學網址：http://www.tku.edu.tw

http://www.tku.edu.tw

申請書

申請書.doc

申請書（word格式）

申請書

yahoo奇摩