UniWeb

WCAG 是基於四項原則的無障礙國際標準

2024/10/29

WCAG

WCAGWeb C本端 A無障礙 G(uidelines) 旨在確保以公平的方式向盡可能多的人提供網站和網頁內容。國際準則特別是使殘障使用者和老年人更容易使用網站的標準。許多國家和公司將此作為無障礙網頁的基礎,因為

WCAG 是、它規定了「網站和網頁內容的無障礙程度」,包括四項原則。基於.

(i) 可感知。
②操作可能
③理解可能
(4) 穩定性

也在 WCAG 中、三種符合性等級:「A」、「AA」和「AAA」,表示無障礙支援的程度。瞭解這四項原則和三個符合性等級,將可確保您的網站正確符合 WCAG 標準

符合 WCAG 規範是一項重要的措施,可提升許多使用者的便利性與公司的品牌價值,同時也能降低法律風險。

本文將解釋 WCAG,詳述上述四項原則和三個符合等級,以及符合 WCAG 的好處和不符合的風險。

這篇文章描述了 WCAG,但以下內容無障礙網頁實施指南」,由 Digital Agency 出版。並提供符合 WCAG 的具體方法的詳細摘要。參與網頁製作的設計師、工程師及其他人士必須連同本文一併閱讀。

無障礙網頁實施指南(最後修訂日期:2024 年 3 月 29 日)。

WCAG 的「四項原則」和「三個符合等級

首先,您需要瞭解 WCAG,並知道符合 WCAG 的四個原則和三個等級,才能建立符合 WCAG 的網頁內容。

WCAG 有四項原則、與每項原則相連的多項準則。有。它為網頁內容的製作提供了具體的指導方針、每項準則都有三個符合成就標準的等級。建立,這是 WCAG 的基本結構。

◆WCAG 結構

WCAG 結構的圖像

現在將解釋這四項原則。

四項原則:可感知、可操作、可理解和穩健。

形成 WCAG 的四個原則是:為了讓大量使用者可以使用網站而建立的基礎設施。每項原則都有詳細說明。

(i) 可感知。

確保使用者能感知網頁內容的原則;讓視障者和聽障者能辨識內容、提供其他資訊方式,例如文字、影像和聲音。有必要:

可感知」的特定範例。

圖片的替代文字。
呈現不只依賴顏色的資訊
... 字幕和視訊的語音說明。

因此,所有無論視覺或聽覺是否受限,都能感知內容文本化和替代性溝通方式對於確保

②操作可能(Operable)

這些原則是為了讓使用者能夠瀏覽網站而設計的。允許殘障使用者僅使用鍵盤進行操作,如果他們無法及時操作,則給予他們額外的時間。必須能夠很好地完成操作內容,例如

可操作」的特定範例。

支援鍵盤操作。
∙ 允許足夠的時間
限制閃光和閃燈。

在此原則下、使用任何裝置或輔助工具的使用者都能操作內容重要的是在設計系統時要做到以下幾點

③理解可能(Understandable)

這是確保所有使用者都能理解內容和介面的原則。避免過於複雜的操作和使用困難的語言。為使用者提供直覺易懂的設計進行。

◆Specific examples of 'understandable'.

...簡單易懂的導覽...
... 容易理解的錯誤訊息。
... 使用簡明易懂的語言。

讓使用者容易了解和操作系統、避免使用行話和複雜的字眼,並以清楚易懂的方式設計內容流程和功能。

(iv) 穩健。

內容可在多種技術和裝置上穩健運作,例如專為相容性而設計。正要原則:使用者目前正在使用或未來可能出現的輔助工具和瀏覽器,在使用內容時都不會有問題。符合標準的規範使用。

◆Specific examples of 'robustness'.

使用精確的 HTML。
... 不同瀏覽器和裝置之間的相容性。

設計必須具備技術穩健性和靈活性,以確保該網站在未來多年內仍能繼續滿足大量使用者的需求。

應使用這四項原則來驗證和建立網站。

WCAG 2.0 現在已經成為國際標準,而技術和設備卻在快速變化和發展、它的特點是內容抽象,與技術規格無關,以確保許多網站可以輕鬆有效地驗證(可測性)。

三種符合性等級:「A」、「AA」和「AAA」。

在上一節提到的四項原則之下,還有幾項與每項原則相關的準則,這些準則提供了詳細的標準,以確保網頁內容能被盡可能多的使用者存取。

而每項準則都有數項達成標準,並分為三個符合性等級,從 A 到 AAA、網站考慮無障礙程度的指標。且其描述方式可讓網站在依據達成標準進行驗證時,判定是否符合規定。

(i) 符合性等級 A (最低無障礙標準)

一致性等級 A 表示符合基本的無障礙要求;在此等級、使用者存取內容的最低支援。已完成,例如:為圖片提供替代文字、停止自動播放視訊等。包括:不符合符合性等級 A 的網站,因為這可能會導致許多使用者無法進行基本操作、應優先考慮的標準。是。

(ii) 符合性等級 AA (標準無障礙標準)

一致性等級 AA 是無障礙的標準,符合照顧廣泛使用者的要求。在許多國家和公司,建議網頁內容符合此等級。例如:保持適當的顏色對比、輸入表單上清晰的項目名稱等。包括:符合 AA 級標準可讓大多數使用者更容易存取網站。

(iii) 合規等級 AAA (最高無障礙標準)

符合性等級 AAA 符合最高等級的無障礙要求;符合此等級可確保幾乎所有殘障使用者都能舒適地使用內容;在此符合性等級下、提供手語視訊,並維持簡明易懂的文字等。然而,下列項目也包括在清單中、達到這個水準並不總是實際可行,因此不建議作為一項要求。

這些分為三個等級,從 A 到 AAA、要符合 AA,您需要符合 A,而要符合 AAA,您需要符合 AA 和 AAAA 很難達到,目前、對於無障礙網頁的合規性而言,可取的做法是「符合一致性等級 AA」。它被視為

此外,特別是為達到符合性等級 AA 和 A 的標準而採取的措施內容、無障礙網頁基礎建設委員會 (WAIC) 發布了一份快速參考表。另請參閱。

JIS X 8341-3:2016 達標標準快速參考 (A 級和 AA 級)

現在讓我們來談談符合 WCAG 的好處。

符合 WCAG 的五大優點

網站符合 WCAG 標準有許多好處,在此我們將討論五項具體好處。

優點 1) 改善可訪問性和 UX。

符合 WCAG 可改善網站的整體可讀性,讓網站更適合所有使用者使用,而不只是殘障人士;以及它還能讓更多使用者舒適地使用系統,從而改善使用者體驗 (UX)。

例如,提供替代文字、針對色盲設計以及支援鍵盤操作、無障礙的改進改善了所有使用者的網路體驗,不論其是否有殘障這讓使用者更容易瀏覽網站而不會迷路、這會降低放棄率,進而增加停留時間和轉換率。

改善可存取性與改善使用者經驗直接相關,可為所有使用者提供舒適順暢的體驗、提高客戶滿意度的重要手段。就是這樣。

效益 2:提升品牌形象。

考慮到無障礙的因素,可顯示對社會責任的承諾,並可改善公司或組織的品牌形象等、在今天這個強調企業包容性和多樣性措施的時代,這是增加公眾信任的主要因素。

這可提高公司的聲譽,並獲得客戶的信心。這將使人們更容易選擇您的服務,並有助於擴大您的客戶群。

效益 3) 降低法律風險。

例如,在許多國家和地區,無障礙網頁的法律和法規正在收緊、美國的《美國殘障人士法案》(Americans with Disabilities Act, ADA) 和歐盟的《歐盟無障礙網頁指令》(EU Web Accessibility Directive)。在日本,《消除對殘疾人歧視法》規定必須提供合理的便利。

遵守 WCAG 有助於滿足這些法律要求,避免訴訟風險和法律麻煩。

優勢 4:可適應新的支援工具和裝置。

WCAG 以通用設計原則和傳統網路技術為基礎。因此,它不僅與目前的無障礙工具和裝置相容,也與未來發展的工具和裝置相容。

例如,螢幕閱讀器等支援工具、根據 HTML 標籤和 ARIA 屬性分析內容因此,如果能依照 WCAG 以適當的標籤和 ARIA 屬性*正確標示文字,即使螢幕閱讀器技術不斷演進,網站也能為使用者正確詮釋並正常運作。

可穿戴和 IoT 裝置也會透過網頁瀏覽器和某些應用程式存取網站,在這種情況下,內容會先由瀏覽器或應用程式進行分析,並將結果以適合裝置的格式顯示、如果 HTML 結構以 WCAG 為基礎,則無論在何種裝置上顯示,內容都能正確顯示。

因此,只要符合 WCAG 標準,網站就不會被迫對出現的每項新技術做出快速回應、長期的穩定性和靈活性。

*ARIA 屬性... 螢幕閱讀器和其他輔助工具使用的 HTML 屬性,以正確理解網頁的元素。

效益 5:對 SEO 有正面影響。

讓網站符合 WCAG 標準、搜尋引擎更佳的索引(資料庫登錄)。舉例來說,為圖片設定替代文字以及適當地編排 HTML 結構,可以幫助搜尋引擎準確地理解內容,進而改善網頁的可及性、這也有助於在自然搜尋結果中獲得更好的排名,從而增加流量。

因此,遵守 WCAG 可帶來許多好處,而不遵守 WCAG,即無法支援無障礙環境的風險。以下章節說明如何

在日本,不遵守 WCAG 可能會導致行政指導或罰款。

在日本,《消除對殘疾人歧視法》已經修訂,自 2024 年 4 月起生效。在私營部門提供合理的遷尌現在已成為法律上的義務。這可讓所有網站都必須符合 WCAG 標準,並可存取網頁。

目前、對於不遵守無障礙網頁的行為,沒有提供直接的罰則。但是,如果不採取行動,讓網站無人看管,可能會導致行政指導;此外、如果不遵守指導方針也沒有改善,或是做出虛假報告,最高可能會被罰款 200,000 歐元。如需詳細資訊,請參閱以下內閣辦公室常見問題。

参考:有關《促進消除殘疾歧視法》的常見問題和解答<面向公眾>(內閣辦公室)

即使沒有法律懲罰、在這個多樣化的時代,社會對於缺乏合理便利的公司和服務的審查變得越來越嚴厲。這種社會趨勢在其他國家尤為明顯,因為這些國家的訴訟問題正大幅增加。

美國的訴訟案例

在上一節中,我們提到美國的 ADA,這是一項人權法律,保護美國殘障人士的權利,並包含近年來美國無障礙環境的內容、公司因網站不符合無障礙要求而被起訴的案例。正在增加。

舉例來說,連鎖超級市場 Winn-Dixie 因視障使用者無法使用螢幕閱讀器在其電子商務網站上訂購產品而被起訴。

法院認為 Winn-Dixie 的網站是「公共場所」,因此需要符合 ADA 的無障礙便利措施,並命令 Winn-Dixie 修改其網站,並確保視障人士可使用螢幕閱讀器正確存取網站。

另一個例子是,當紅藝人碧昂斯 (Beyonce) 的官方網站 (beyonce.com) 因不支援視障人士的螢幕閱讀器,以及「限制視障人士的存取」而被起訴;因此,該網站在訴訟後重新設計,以改善可存取性並符合 WCAG 標準。

因此、其他國家的立法非常先進,不遵守 WCAG 會涉及真正的訴訟風險(3) 即使在日本,現在法律規定必須提供合理的遷尌,但完全可以想像將來也會發生這種情況。而公司在處理這些問題時,需要考慮到這些風險。

接下來,我們將介紹符合 WCAG 標準的公司和組織。

三個採用 WCAG 的公司和組織案例研究

最近有越來越多的公司和組織採用 WCAG 來接觸更廣泛的使用者,並改善其 UX 以下是三個主要的範例。

事例①Apple

Apple 是早期的無障礙先驅,提供符合 WCAG 的網頁內容。該公司的網站和產品具有無障礙功能,可滿足視障、聽障和行動不便人士的需求。例如,它提供屏幕閱讀器支援和視覺支援功能(如對比調整)。

参考:無障礙 - Apple

事例②Microsoft

Microsoft 是另一家符合 WCAG 的無障礙網頁公司。透過「包容性設計」方法,公司致力於確保所有使用者(包括殘障人士)都能使用其產品和服務。特別是該公司的官方網站和雲端服務 (例如 Azure) 支援鍵盤操作,並為視障人士提供語音指引功能。

参考:微軟包容性設計Microsoft Azure

案例研究 (iii) 內閣辦公室。

內閣辦公室的網站是:符合 JIS X 8341-3:2016(日本無障礙網頁標準:見下文)「一致性等級 AA」,與 WCAG 2.0 的標準相同。(較舊的內容和外部提供的 PDF 檔案會有例外,因為這些檔案很難修改)。

內閣辦公室的網站是:特別是身為公共機構,該公司持續驗證並改善其對應的高標準要求,並正在努力中。本公司在新增或更新頁面時,力求符合 AA 級標準。

参考:內閣辦公室無障礙網頁政策

接下來,將解釋 WCAG 作為國際標準與 JIS 作為國家標準之間的關係。

WCAG 與 JIS 的關係

WCAG 於 1999 年以 WCAG 1.0 發表、WCAG 2.0 是目前的國際標準 (ISO)它被視為

雖然 WCAG 是國際性的無障礙網頁標準、在日本,JIS X 8341-3:2016 被確立為與 WCAG 2.0 相同的標準。JIS X 8341-3:2016 幾乎逐字納入 WCAG 2.0 的內容,其基本結構 (四項原則、三個符合等級) 也是以 WCAG 為基礎。

它是日本公共機構和公司確保網路無障礙的指南、它以國際標準納入當地法規的形式,在促進無障礙網頁的普及方面扮演著重要的角色。

如前所述,WCAG 2.0 現在是國際標準,雖然這和 JIS X 8341-3:2016 是同一標準、事實上,自 WCAG 2.0 以來,WCAG 本身已隨著內容更新而更新,目前已發佈至 WCAG 2.2,而 WCAG 3.0 則處於草案階段。

WCAG、ISO 和 JIS 之間的關係。

WCAG 與 ISO 和 JIS 的關係

如上所述,目前正在準備修訂 ISO 和 JIS 標準,以符合 WCAG 2.2。

WCAG 2.1 和 2.2 增強了行動裝置的無障礙程度

這裡介紹了 WCAG 2.0 的較高版本 WCAG 2.1,以及最新版本 WCAG 2.2。

首先,WCAG 2.1 是、由於智慧型手機和平板電腦的廣泛使用、行動裝置的存取需求增加。特別是,針對加強了觸控操作和小螢幕無障礙的標準。

除了 WCAG 2.0 中的 61 項成就標準之外,WCAG 2.1 還新增了 17 項成就標準,主要是針對行動反應能力、視覺障礙和認知障礙的成就標準;另請參閱 WCAG 2.2、WCAG 2.3、WCAG 2.4 和 WCAG 2.5)、在 2.1 中,78 項成就標準

而最新的 WCAG 2.2 則是在 2.1 的基礎上加以擴充,增加了九項成就標準,並將重點放在行動裝置的使用上,主要目的在於改善無障礙環境,尤其是針對有認知障礙的使用者和年長者 (除了 WCAG 2.1 中的 78 項成就標準之外;另請參閱 WCAG 2.3)、在 2.2 中,87 項成就標準

具體而言,新增了以下標準

◆ 代表性附加標準。

手勢複雜性的限制。(WCAG 2.1):允許使用簡單的手勢。
... 提供多種輸入方法。(WCAG 2.1):建議採用的設計,以防止因點擊和點擊造成的誤操作。
內容的 Zoom 支援。(WCAG 2.1):確保內容在畫面放大時不會塌陷。

焦點可見度。(WCAG 2.2):讓鍵盤焦點清楚可見。
目標尺寸(WCAG 2.2):確保點選和點按目標的最小尺寸,以減少誤操作。
不依賴記憶體的驗證。(WCAG 2.2):提供不需要記憶密碼認證的方法(例如生物識別技術)。

因此、在從 WCAG 2.0 到 WCAG 2.2 的更新過程中,行動裝置的無障礙一直是重點所在關鍵在於

UniWeb 可以立即為 WCAG 提供支援。

本文已詳細解釋 WCAG:修訂後的《殘疾歧視法》強制要求所有網站都必須具備無障礙網頁功能,從而確保所有網站對所有使用者(包括殘障人士)都是無障礙的,所有網站對所有使用者(包括殘障人士)都是無障礙的、設計師、工程師和維護人員必須正確瞭解 WCAG,並迅速回應其網站。

如果您正在考慮建立符合 WCAG 標準的網站,我們的UniWeb"。UniWeb 是一種外掛工具,可輕鬆實作以改善網站的可及性,並提供多種功能,讓您的網站對所有使用者都友善。它支援 WCAG 2.1 和 JIS X 8341-3:2016,有助於降低法律風險並改善可用性。

支援 WCAG,這也需要高昂的成本和數月的施工時間、使用 UniWeb,您只需在您的網站上添加一行代碼,這可以為您節省大量的金錢和時間。本文右下角的粉紅色圓形圖示。親身體驗 UniWeb 的功能。

以下文章還詳細介紹了在進行網頁無障礙符合性工作時可以使用的具體方法和工具,請與本文一併閱讀。

相關文章:網站管理員必須執行哪些無障礙網頁措施?

從簡單的資訊請求開始

本節將介紹 UniWeb 的功能和介紹流程。

請求資訊