無障礙網頁基本說明,請大家上架時注意操作細節。

大家好

本校首頁即將申請無障礙網頁認證,請各單位於訊息公告時(特別是公告至校首頁)注意以下事項。
無障礙認證首先會是以機器人掃描一遍,必要時會請視障或聽障朋友實際操作,若不符合會退件限期改善。

1.圖片、超連結需加上額外說明
1.1圖片為讓視障朋友了解內容,需使用「alt屬性」說明圖片的內容。
以本校單位網站編輯器為例,請於【替代文字】中做描述。
 無障礙網頁圖片替代文字錯誤示意圖
改良後:這是佛光大學校門口圖片,左邊是禪杖造型校碑,右邊是警衛室。
 無障礙網頁圖片替代文字正確示意圖

1.2超連結為讓視障朋友了解內容,在超連結中使用「title屬性」替超連結提供文字說明。
以本校單位網站編輯器為例,請於【進階】分頁中,【標題】中做描述。
如無設定系統會逕自寫入【在本視窗開啟 佛光大學首頁】
 無障礙網頁超連結標題錯誤示意圖
改良後:佛光大學校園美景及各系所介紹 佛光大學首頁
 無障礙網頁超連結標題正確示意圖
1.3如使用系統內建,請於各欄位詳加說明。
 無障礙網頁使用網站內建連結建議操作示意圖

2.表格使用說明
2.1為了符合無障礙規範,表格的行列標題,請使用th標籤。
請於【表格屬性】分頁中,選擇【頁首】選項,以第一行為例。
 無障礙網頁表格使用TH標籤用法示意圖
我們點擊原始碼,會看到th標籤
 無障礙網頁TH標籤原始碼示意圖
2.2為了進一步符合無障礙規範,另對表格設定「標題」(Caption)與「摘要」(Summary)。
「標題」用來描述表格內容,簡明扼要:「佛光大學校車時刻表」
「摘要」用來描述表格結構說明,通常在複雜的表格中需要使用,注意儘量不與「標題」重複:「此佛光大學校車時刻表,第一欄是班次名稱,第二欄是雲起樓發車時間,第三欄是礁溪火車站發車時間…」
 無障礙網頁表格標題及摘要正確使用示意圖
3.其他說明
3.1插入元件對話框(影音、檔案、框架)有出現標題、描述或替代文字字眼,請補充不要留空。
3.2如插入影片至少要有字幕。
3.3內文無需過多顏色變化。

感謝配合,圖資處敬啟