創(chuàng)建可訪問的幻燈片：綜合指南

幻燈片在組織網(wǎng)站上很普遍，但由於可訪問性的要求而言，通常無法訪問。 流行的Web開發(fā)框架（例如Bootstrap和Foundation）並不固有地支持可訪問的幻燈片，需要進行大量修改。本文概述了創(chuàng)建包容性幻燈片的關鍵可訪問性原則。 隨後的文章將提供實用的代碼示例。

常見的幻燈片類型（圖1和2）經(jīng)常缺乏關鍵特徵：暫停功能和鍵盤可訪問性。 導航幻燈片時，許多設計無法保持鍵盤的焦點。

五個核心原理可確保可訪問的幻燈片：

1. >用戶對運動的控制： wcag 2.2.2要求一種機制暫停，停止或隱藏自動移動持續(xù)五秒鐘的內(nèi)容。 簡單的暫停/停止鏈接有效。避免在可能的情況下分散動畫過渡的注意力。

在

2. >清晰可見：足夠大，具有足夠的顏色對比度。

   通過鍵盤，鼠標和觸摸可訪問
   >
   • ：>按鈕或鏈接是理想的；避免僅依靠。
   >
   • 明確的焦點/懸停指示：焦點上的視覺變化不同，滿足對比度要求。 形狀變化比僅顏色變化更可取。 > tabindex
   >精心設計的控件的示例可以在Accessibilityoz（圖3和4）和Griffith University（圖6）等網(wǎng)站上找到，展示了臺式機和移動設備的清晰暫停按鈕和導航控件。 莫納什大學（Monash University）提供了一個沒有自動運動的移動友好幻燈片的示例（圖5）。

3. > 邏輯焦點順序：選項卡訂單應鏡像視覺佈局和HTML結構?？丶ㄓ绕涫菚和＃趦?nèi)容之前。 內(nèi)容更改不應發(fā)生在當前的焦點元素之前。

   >

4. >有效的代碼和樣式：幻燈片應在禁用樣式表中起作用，儘管演示可能會有所不同。 禁用樣式表時，請避免意外的內(nèi)容變化或重疊。 文本應通過瀏覽器文本大小調(diào)整來擴展；移動版本必須支持捏到Zoom。

   >

5. 有意義的替代方案：為無法訪問幻燈片的用戶提供基於文本的替代方案。 這可能包括一個“僅屏幕閱讀器”部分重複幻燈片內(nèi)容和鏈接，理想地放置在幻燈片出現(xiàn)的位置。 在提供的信息方面，請確保此替代方案等效於幻燈片。 圖像需要適當?shù)?code>alt屬性。

   >

>結論：創(chuàng)建真正可訪問的幻燈片需要仔細考慮這些原理。 下一篇文章將提供實現(xiàn)這些目標的實用代碼實施。 >

經(jīng)常詢問有關可訪問幻燈片的問題（常見問題解答）（本節(jié)在很大程度上與原始輸入保持不變，因為它提供了有價值的補充信息。） 什麼是可訪問的幻燈片？

>

如何使我的幻燈片可訪問？ > 什麼是alt文本，為什麼很重要？ > 如何將字幕添加到幻燈片上？ > 為什麼鍵盤導航很重要？ 如何使幻燈片的語言清晰而簡單？ 什麼是成績單，為什麼很重要？ > 如何為幻燈片創(chuàng)建成績單？ >我可以使用自動化工具使我的幻燈片可訪問嗎？ > 使我的幻燈片可訪問有什麼好處？

以上是幻燈片的難以忍受的難以捉摸的詳細內(nèi)容。更多資訊請關注PHP中文網(wǎng)其他相關文章！