維基百科:格式手冊/無障礙/2025
本專案頁面目前為「2025」的草稿。 如有任何疑問,請至討論頁發起討論。 |
格式手冊 |
---|
灰字連結非正式指引,僅供參考 |
網站無障礙旨在讓網頁更易於瀏覽、閱讀。這最初只是用於幫助身心障礙人士,但確實利於所有讀者。我們致力於遵循WCAG標準2.1,基於是提出以下建議。遵守這些規範的條目方便所有人閱讀、編輯。
條目結構
條目結構規整能讓讀者對頁面的內容鋪排一目了然,因此有助達成無障礙。例如,某位失明讀者在尋找消歧義連結時,如果沒有在頁頂找到這種連結,則能明白頁面本來沒有消歧義連結,因此無需閱讀整頁。
標準化是維基百科的一大習慣,因此只需遵循Wikipedia:格式手冊/版面佈局和Wikipedia:格式手冊/序言章節 § 應該有的東西。
章節標題
章節標題應該能簡潔描述主題,且按照格式手冊排列。
章節標題應該巢狀遞進,由二級標題(==
)開始,再到三級標題(===
),如此類推(一級標題是頁面標題)。不要為了凸顯某些內容而故意用錯或跳過章節標題層級,這樣做有悖於它們的作用。
為求視障編輯者的便利,使用原始碼編輯時可以在每個章節標題下面添加一個空行。如果添加多於一個空行,則會導致章節標題預覽時在下面出現空行。在部分條目中,您也應留意小型螢幕如何渲染章節標題下面的空行,因為許多編輯者都用流動裝置進行編輯,如果章節標題下面有空行,則反而可能會削弱他們對條目的可讀性。
正確 | 隨機/無規律 | 跳級 |
---|---|---|
[條目序言] |
[條目序言] |
[條目序言] |
不要濫用半形分號製作偽標題(分號只可用於製作定義列表),亦避免使用粗體。螢幕閱讀器和其他輔助工具只能依賴章節標題語法確定標題的排列。如欲縮小目錄,則可以改用{{TOC limit}}。如果{{TOC limit}}因條目存在低層章節標題而無法使用,則五級標題可以改用粗體,這樣就能減少對螢幕閱讀器的干擾。偽標題只能在方法窮盡時使用,不應頻繁出現。
可接受 | 錯誤 |
---|---|
[條目序言] |
[條目序言] |
浮動元素
在維基代碼中,浮動元素(包括圖像)應該放在所述章節之內,而非前一章節的結尾。(在某些平台中,在一小段文字旁邊「堆疊」幾張圖像會導致某些圖像擠到下一章節,但這並非無障礙問題,因為螢幕閱讀器必定會在每張圖像代碼所指定的位置閱讀它們的alt=
。)
螢幕解像度
維基百科條目應該便利使用小型螢幕(比如流動裝置)或低解像度顯示器的讀者。在桌上顯示器中,螢幕兩側有多張圖像的條目可能會導致問題。雖然低解像度顯示器一般會垂直伸長段落,因而垂直移動圖像,但您也需要避免在螢幕兩側同時添加圖像或其他浮動元素。大型表格和圖像也能產生問題:水平捲軸或不可避免,但您亦可考慮重新鋪排大型表格,縮短水平篇幅。
文字
大部分螢幕閱讀器預設不會表明視覺文字屬性(粗體、斜體、底線、等寬字型、刪除線)乃至語意文字屬性(着重、刪除文字),所以刪除線文字會與其他文字一樣朗讀。如果您使用螢幕閱讀器且時常參與維基百科討論,則建議開啟文字屬性的通知,因為維基百科討論經常出現刪除線文字。
因為螢幕閱讀器一般忽略刪除線,所以如果它在條目中沒有任何其他標示,則會引起無障礙問題或者混淆。這個問題適用於<s>
、<del>
元素(以及一般呈現為底線的<ins>
)和使用它們的模板。如果您認為內容不適當或錯誤,則不要使用刪除線划去它,而是用<!--
和-->
將其轉為註釋、刪除內容,或掛上內文爭議模板,再於討論頁發起話題。
- 【中文的螢幕閱讀器如何?
- 測試了一下我的裝置Windows 11上的講述人,沒下載其它語音的時候遇到阿拉伯字母和希臘字母幾乎完全跳過,因此我暫且這樣改。】
有些螢幕閱讀器不支援常用漢字和拉丁字母以外的字元(?),因此您不能假定閱讀器必然以某特定方式閱讀這些字元。遇到不支援的字元時,螢幕閱讀器和語音合成器可能會讀作問號或完全省去它。
- 在重要情況(如人名、地名、事物等)下,您需要為所有非拉丁、非漢字的文字(?)提供拉丁轉寫。您可以使用語言專用模板或{{Transliteration}}標註。這些模板在無障礙方面也有其他益處(參見「外語」一節)
- 不要加入螢幕閱讀器可能無法閱讀的符號(比如心形符號♥),反而使用附帶替代文字的圖像。[1]
您必須使用上下文清楚表達文字的語意特性(以及其他形態類似的內容)。不要依賴只能用CSS屬性或Wikitext分辨的自訂「特殊符號」。
不要使用需要互動才能提供資料的技術,包括提示框和其他「懸浮」文字。縮寫不受此限,所以您可以用{{abbr}}
(<abbr>
的包裝模板)標示縮寫(包括首字母縮略字)的全寫。
不要在句中插入換行符,因為會對螢幕閱讀器造成干擾;但您可以在句末加入換行符,對某些編輯者有所幫助。(譯註:如果指通過句末換行來產生空格的話,那中文不能有此體例。)?)
字型大小
大小字形一般由自動化頁面元素(比如章節標題、表格標題和標準模板格式)負責實現,除此之外應避免使用。更改字型大小時,應當用原大小的百分比表示,而非以像素或點表示的絕對大小。如果使用相對大小,則視障用戶仍能按情況調大瀏覽器的預設字型大小,但他們無法直接調整絕對大小。
避免在使用小字型的頁面元素(比如資訊框、導航模板和參考章節中的文字)內再使用小字型。[a]換言之,您不應在這些元素中的純文字使用<small>...</small>
標籤,以及諸如{{small}}
和{{smalldiv}}
的模板。所得文字的大小不得低於頁面預設的85%,注意,HTML的<small>...</small>
標籤還具有「小字條款」(fine print)或「註疏」的語意含義,[2]不可用於風格化。
分數
不要使用Unicode已有的分數字元,如½(已棄用標記的有½
和½
),因為部分螢幕閱讀器無法解析一些分數字元,而且視障讀者難以閱讀。請改用{{frac}}
,格式如3⁄4。(在科學和數學條目中,則用{{sfrac}}
,格式如3/4。)
外語
標註外文
中文維基百科預設會向瀏覽器指明條目以中文(zh
)書寫。非中文(外文)文字必須用{{lang}}
(或其衍生模板)標明。這類別模板使用IETF語言標籤包裝文字,指定其語言和書寫系統,例如:
-
Assemblée nationale
並未指出自己的語言(法語)。大多數螢幕閱讀器處理時會讀錯。 -
{{lang|fr|Assemblée nationale}}
呈現為Assemblée nationale,螢幕閱讀器處理時改用法語發音。 -
{{lang-fr|Assemblée nationale}}
→ 法語:Assemblée nationale:同上。
理由:如果使用{{lang}}
指定文字的語言,則螢幕閱讀器可以改用該語言的聲音。[3]
另外,在中文維基百科中,如果不將日語文字用模板包裹,日文漢字可能會被視作中文而錯誤簡繁轉換。
關於使用{{lang}}
系列模板的完整理由,見Template:Lang/doc#使用理由。
書寫系統
IETF語言標籤按照ISO 639標準指定文字的語言之餘,還能標明文字的書寫系統:
-
{{lang|sr-Cyrl|Народна скупштина}}
→ Народна скупштина -
{{lang|sr-Latn|Narodna skupština}}
→ Narodna skupština ——塞爾維亞語一般用拉丁文字或西里爾文字書寫。 -
{{lang|ja|Kokumin gikai}}
——日語文字一般用日語書寫系統(而非拉丁字母)書寫。 -
{{lang|ja-Latn|Kokumin gikai}}
指明這段日語文字用拉丁文字書寫(日語羅馬字)。 -
{{transliteration|ja|Kokumin gikai}}
同上。
如果未指定書寫系統,則IETF標籤會預設使用該語言最常用的書寫系統。鑑於此,處理字母轉寫時,您應該在語言代碼加入-Latn
,抑或使用相應的{{transliteration}}
模板。維基百科的語言專用模板(比如{{lang-en}}
和{{nihongo}}
)能為編輯者提供各種功能,包括用一個模板展示幾種轉寫。有些語言沒有自己的專用模板,但這些模板防止編輯者頻繁使用{{lang}}
和{{transliteration}}
,從而簡化維基文字。
音標轉寫用{{IPA}}
或其他合適模板。原始印歐語請用{{PIE}}
。
連結
- 連結(尤其是外部連結)描述應該清楚易懂(不要使用「點擊我!」「此連結」)。[4][5]
- 不要使用Unicode符號替換圖示,反而應該使用附帶替代文字的圖示。例如,部分螢幕閱讀器無法將「→」等字元轉為有用文字。
- 為幫助視障讀者找到目標頁面的連結錨點,您可以利用
{{Visible anchor}}
標示錨點。
顏色
在條目和其他頁面使用顏色時,您應時常留意無障礙,準則如下:
- 請確保顏色不是唯一傳達重要資料的途徑。特別而言,不要使用彩色文字或背景,除非其狀態也以其他方式指明,比如圖例上的無障礙符號或註腳標籤。如不遵循這個準則,則失明用戶或讀者無法通過印本或非彩色裝置取得資料。
- 讀者必須能清楚明白哪些互動元素是連結。
- 部分讀者有色盲、色弱或視覺障礙。請確保文字與背景的對比度最少能達到Web內容無障礙指南(WCAG)2.0的AA等級,且儘量達到AAA等級(參見WCAG「了解SC 1.4.3:對比度(最低限度)」)。如欲在白色背景下使用CSS顏色名稱渲染文字,請見Wikipedia:格式手冊/無障礙/CSS顏色與白色背景的對比度。此外,您也可以利用以下工具評估對比度:
- 網絡上有一些能檢查對比度的工具,包括WebAIM網上對比度檢查器、WhoCanUse網站和斯努克顏色對比度檢查器。
- 儘管如此,有些網上工具以WCAG 1.0的演算法為根據,因此需要事先甄別。如果工具未指定自己採用WCAG 2.0,則您可以假設它已過時。
- 維基媒體基金會設計團隊提供一套達到AA等級的配色表。維基媒體產品(不論電腦端還是流動端)的所有用戶介面元素都使用此配色,但連結文字除外。
- Wikipedia:格式手冊/無障礙/顏色表就14種色相對黑字、白字、連結文字和訪問連結文字展示達到AAA等級的最暗或最亮背景色。
- Google Chrome有附帶顏色挑選器的對比度檢查器。
- 您可以通過顏色對比度分析器選擇頁面上的顏色,然後詳細評估它們的對比度,但只有「luminosity」(光度)演算法是最新的,而「color brightness/difference」(顏色亮度/差)已過時。
- 網絡上有一些能檢查對比度的工具,包括WebAIM網上對比度檢查器、WhoCanUse網站和斯努克顏色對比度檢查器。
- 以下工具能幫助您製作圖表和地圖配色。它們未必能準確評價顏色的對比度,但在特定情況下也值得使用。
- 您可以在Paletton挑選圖表配色。
- Color Brewer 2.0可以提供地圖配色和詳解。
- 「明亮」定性數據配色方案是一套九種對色盲用戶便利的顏色。
- 網絡上有一些模擬色盲的工具:Toptal ColorFilter(網頁)和Coblis色盲模擬(本地檔案)。瀏覽器也有一些擴充程式:NoCoffee(Firefox)
- 您可以通過開源軟件Color Oracle模擬色盲視覺和全色盲,從而選擇更適當的對比色。
- 如果條目濫用顏色,但您無法改正問題,您可以掛上{{Overcolored}},尋求編輯者協助。
塊元素
列表
分隔列表項目時,不要在中間插入空行或制表符。這裏的列表包括描述列表(由行首半形分號或冒號製成的列表,也是維基百科大多數討論的格式)、有序列表和無序列表。列表的作用是組合同類元素,但MediaWiki會將空行解析為列表的結尾。此外,如果列表的雙空行過多,則螢幕閱讀器會讀出多個列表,因而誤導或迷惑用戶。此類不當格式也能大幅延長讀完列表所需的時間。
同樣,不要在同一列表內無規律使用項目符號標記(冒號、星號或井號)。回覆留言時,您需要在原本留言的項目符號之上多加一個同類字元,才算適當縮排回覆。您也可以「反縮排」,發起新的討論(即是另一個HTML列表)。
例子:
這是適當做法:
* 支持。我喜欢这个想法。—User:Example
** 疑问:你为什么喜欢?—User:Example2
*** 我觉得它符合维基百科的精神。—User:Example
如果留言沒有項目符號,則這也是適當的:
: 支持。我喜欢这个想法。—User:Example
:: 疑问:你为什么喜欢?—User:Example2
::: 我觉得它符合维基百科的精神。—User:Example
回覆時,您也可以讓項目符號保持在左邊:
* 支持。我喜欢这个想法。—User:Example
*: 疑问:你为什么喜欢?—User:Example2
*:: 我觉得它符合维基百科的精神。—User:Example
但是不要從無序列表轉為描述列表:
* 支持。我喜欢这个想法。—User:Example
:: 疑问:你为什么喜欢?—User:Example2
或者從無序列表轉為混合列表:
* 支持。我喜欢这个想法。—User:Example
:* 疑问:你为什么喜欢?—User:Example2
不應該在列表項目之間留空行:
* 支持。我喜欢这个想法。—User:Example
** 疑问:你为什么喜欢?—User:Example2
也不應該跳級:
* 支持。我喜欢这个想法。—User:Example
*** 疑问:你为什么喜欢?—User:Example2
不鼓勵以下做法:
: 支持。我喜欢这个想法。—User:Example
:* 疑问:你为什么喜欢?—User:Example2
這裏的項目符號令列表更為複雜,讓回覆的用戶更容易用錯縮排層次。
在列表項目內分段
一般MediaWiki列表語法與一般MediaWiki段落語法不相容。
如欲在列表項目內寫下多個段落,您可以使用{{pb}}
分段:
* 这是第一项。{{pb}}这是同一项内的另一段。
* 这是第二项。
您也可以使用HTML的段落標籤(留意結尾的</p>
標籤):
* 这是第一项。<p>这是同一项内的另一段。
* 这是第二项。
在以上例子中,您必須在同一代碼行中使用模板,但您也可以用HTML註釋包圍換行,防止換行渲染的同時,讓留言的分段更為清晰:
* 这是第一项。<!--
--><p>这是同一项内的另一段。</p>
* 这是第二项。
這個技巧可以用來在列表項目內加入各種塊元素(因為列表項目也是塊元素,能包含其他塊元素):
* 这是第一项。<!--
--><p>这是同一项内的另一段,这里放引用:</p><!--
-->{{talk quote block|红烧肉好吃。|User:Example}}<!--
--><p>这是同一项内的结尾段。</p>
* 这是第二项。
請注意,不是所有裝飾模板都能這麼用(比如一些裝飾引用模板使用表格,但MediaWiki解析器無法處理列表項目中的表格語法)、
不要用換行模擬分段,因為它們的語意不同:
* 这是第一项。<br />这还是同一段,只是之前有换行标签。
* 这是第二项。
換行標籤之後的文字依然屬於同一段,而且它的作用本來是給詩歌或代碼塊分行。參見<poem>
和<syntaxhighlight>
標籤。
切勿用冒號與縮排層級對齊,因為它會產生三個列表:
* 这是第一个列表。
: 这是第二个列表。
* 这是第三个列表。
除此之外,HTML列表模板是在列表內加入塊元素(比如代碼)的最好方法:
{{bulleted list
|1=这是第一项:
<pre>
这是代码。
</pre>
这还是同一项。
|2=这是第二项。
}}
但討論頁面不使用這個技巧。
註釋
- ^ 資訊框和導航模板的字型大小一般為本頁預設的88%。參考章節的字型大小一般為本頁預設的90%。其他數值請見MediaWiki:Common.css。
參考文獻
- ^ F26: Failure of Success Criterion 1.3.3 due to using a graphical symbol alone to convey information. Techniques for WCAG 2.0. World Wide Web Consortium. 7 October 2016 [29 December 2011].
- ^ 4.5.4 The small element. HTML Living Standard. Web Hypertext Application Technology Working Group. 24 December 2023 [29 December 2023].
- ^ H58: Using language attributes to identify changes in the human language. Techniques for WCAG 2.0. World Wide Web Consortium. 7 October 2016 [29 December 2023]. Accessibility level: AA.
- ^ G91: Providing link text that describes the purpose of a link. Techniques for WCAG 2.0. World Wide Web Consortium. 7 October 2016 [29 December 2023].
- ^ F84: Failure of Success Criterion 2.4.9 due to using a non-specific link such as 'click here' or 'more' without a mechanism to change the link text to specific text. Techniques for WCAG 2.0. World Wide Web Consortium. 7 October 2016 [29 December 2023].
延伸閱讀
- Clark, Joe. Building Accessible Websites. New Riders Press. 2003 [1 January 2011]. ISBN 0-7357-1150-X.
- Pilgrim, Mark. Dive into Accessibility: 30 Days to a More Accessible Web Site. 2002. (原始內容存檔於5 October 2017).
- Lynch, Patrick J.; Horton, Sarah. Web Style Guide. Yale University Press. 2016. ISBN 978-0-300-21165-8. OCLC 1004033147 –透過Google Books.
外部連結
- The Wikimedia Design Style Guide
- Recommendations for mobile friendly articles on Wikimedia wikis
- 10 Quick Tips to Make Accessible Web Sites, from WAI
- Colorblind web page filter
- Legibility, from Web Style Guide, 3rd Edition
- Essential Components of Web Accessibility, from WAI
- Introduction to Web Accessibility, from WAI
- Known and tracked MediaWiki accessibility issues
{{Wikipedia policies and guidelines}} [[Category:Wikipedia Manual of Style (accessibility)| ]] [[Category:Wikipedia accessibility| ]]