使您的網站易於訪問的幾種方法
已發表: 2017-02-15構建頁面及其資產使其對機器友好,無論該機器是什麼。 添加允許用戶(包括殘障用戶)和機器直接獲得有意義的內容的常識技術,並確保您正在朝著使您的網站易於訪問和搜索引擎友好的方向發展。
我們都熟悉 WordPress 的強大功能,它允許新手或非技術人員設計和開發自己的網絡資產。 該平台易於設置,並為主題和插件提供了一個可靠的框架,這些框架將決定您的內容和功能將如何為任何訪問者提供。
如果您希望殘障人士可以訪問您的網站,您會發現基本的 WordPress 有很多東西可以促進無障礙網站的開發,並且不難通過添加插件和良好的技術。
在我們開始之前,有兩個重要的因素需要注意。 首先,單獨實施這四種技術不會使任何網站在符合所有必要要求的情況下完全可供所有人訪問,但它將解決最常見的 Web 訪問障礙並提供更大的可訪問性。
其次,重要的是要理解,只有通過設計、開發和最佳內容創作實踐的合作才能實現可訪問性。 設計師可能會設計一個可訪問的主題,開發人員可能會添加可訪問的功能,但如果內容作者插入了沒有 alt 標籤的有意義的圖像,則網頁的全部含義將無法訪問。
考慮到這一點,這裡有四個提示,可讓您輕鬆訪問您的網站。
圖像的替代文本
眾所周知,Web 可訪問性的最大障礙是正確使用 alt 文本來描述網頁上的圖像。 如果每個構建網站的人都解決了這一點,它將消除最多的可訪問性投訴。 這就是為什麼我們迫切需要開發一個驚人的插件 SEO Image Optimizer,它填補了圖像上缺少 alt 標籤的空白。
要理解的基本點是,如果您要在您的網站上放置圖像,則必須使用替代文本正確標記它們。 換句話說,您在網上發布的每張圖片都必須對機器人在搜索引擎上列出您的圖片有意義。
alt 標籤中的信息允許屏幕閱讀器(向有視覺障礙的用戶朗讀網頁)、純文本瀏覽器和不會加載圖像的慢速連接的用戶理解圖像傳達的信息。
如果圖像沒有意義,例如純粹用於裝飾,則有兩種處理方法。 如果您使用 CSS 將其加載為背景圖像,屏幕閱讀器將忽略它,並且該圖像不需要 alt 標籤(請注意,因為這也適用於有意義的圖像:如果您在背景中加載它,屏幕閱讀器將忽略它)。 如果圖像使用 HTML 顯示但純粹是裝飾性的,則使用 alt 標籤但將其留空。 這告訴屏幕閱讀器圖像存在但對用戶沒有意義並且可以被忽略,這使得您的網站更容易被讀者訪問
當您在圖像上貼上標籤時,請使用一些描述性文字,讓看不見的人理解圖像的含義。 這需要判斷:為什麼圖像會出現在這裡,它傳達了什麼信息,以及哪些詞最能傳達相同的含義。 不要陷入對每個視覺細節的字面描述中,傳達意義。
一個典型的例子是放大鏡圖像用作開始搜索的按鈕。 圖像是有意義的,所以它應該被描述。 將其描述為“放大鏡”對用戶沒有幫助。 他們需要知道的是,單擊此按鈕將開始搜索,因此“單擊此處搜索”甚至只是“搜索”的替代文本可能是最合適的。
只有服務於目的的圖像必須被標記。 這些示例如下:
用作按鈕的圖像
用作鏈接的圖像
用於任何其他控件的圖像
與內容直接相關的圖像
這種技術適用於所有網站,當然,不僅僅是 WordPress 網站。 然而,WordPress 比大多數都更容易,首先是允許內容作者在 Visual 和 HTML 視圖之間切換,其次是在使用添加媒體功能插入圖像時為 alt 文本提供一個字段。
插件以獲得更好的可訪問性
可以通過使用各種插件來增強 WordPress 的可訪問性。 這些插件易於設置,它們將使有各種殘疾的用戶能夠訪問該站點。 以下是我發現的一些插件,它們可以使您的網站易於訪問。
訪問密鑰
訪問密鑰插件允許將訪問密鑰分配給您網站上的鏈接和控件。 例如,可以為主頁鏈接分配訪問鍵組合alt+h,並且可以為搜索按鈕分配alt+s組合鍵。 訪問密鑰(例如所提供的示例)使視障用戶和行動不便的用戶能夠輕鬆訪問他們想要的內容。
輕鬆轉推
Easy Retweet 是一個插件,可讓您向頁面添加可訪問的按鈕,以便在 Twitter 上分享您的內容。 這樣,如果殘障人士希望與他們的朋友分享您的頁面,他們可以毫無困難地做到這一點。

AStickyPostOrderER
AstickyPostOrderER 允許您選擇顯示內容的順序。 您可以選擇從最舊到最新或以相反的順序顯示內容。
Hackadelic SEO 目錄
Hackadelic SEO 目錄插件使您能夠為您的帖子或頁面提供目錄。 這將使您的內容易於查找。
WP-民意調查
WP-Polls 允許殘障人士參與您網站上的任何民意調查
新插件一直在開發。 使用 WordPress 儀表板功能搜索更多信息。 嘗試不同的插件並要求您的殘障用戶給您反饋
使用任何插件時,請確保使用的插件與您選擇的主題以及彼此兼容。 如果您的插件與您的主題不兼容,它們要么無法工作,要么會給嘗試瀏覽您網站的禁用用戶帶來更多問題。 如果您的插件彼此不兼容,您的網站可能會變得不可用或內容顯示不正確。
標題的方法
當您設計頁面時,以正確的順序使用標題來構建內容至關重要: <h1>
、 <h2>
、 <h3>
等等。 當您使用標題構建內容時,使用屏幕閱讀器的人可以獲得頁面內容的摘要並更輕鬆地瀏覽它們。 屏幕閱讀器用戶可以通過按字母“H”前進和“shift+H”後退來訪問他們想要的內容部分。
您可以使用標題 1 到 6 標記您的內容,以使您的網站易於訪問。 檢查您的主題如何使用標題(例如,您的主題可能會或可能不會將<h1>
應用於網站標題,並且該網站標題可能會或可能不會出現在每個網頁上。無論哪種方式,請確保使用的第一個標題是<h1>
並且在適當的情況下,以下標題(頁面標題、頁面子部分、段落標題)按順序下降到<h6>
。
排序有一定的靈活性,但最明智的選擇是保持標題按數字順序排列,並且不要混淆它們,因為這會給用戶和搜索引擎帶來危險(不要像這樣混合它們 - > <h1>
、 <h4>
、 <h2>
等)。
導航鏈接很有用
最後,您需要在網站設計中包含導航鏈接。 這些導航鏈接將允許殘障用戶跳過導航欄或其他菜單和搜索框,並通過單擊這些鏈接跳轉到頁面上的某些位置。 或者,用戶可以快速跳轉到網站上所需的部分。 這些鏈接需要出現在用戶需要跳轉到有意義的內容的任何地方。 這些鏈接可能會說的例子是:
跳到主要內容
跳轉到導航欄
跳轉到搜索
一些 WordPress 主題可能已經提供了此類鏈接。 如果是這種情況,您將需要檢查這些鏈接以查看是否必須添加您自己的任何鏈接。 但是,其他主題不會提供導航鏈接。 因此,您需要自己添加這些鏈接。
包起來
我將重複我之前所說的,這些步驟都不能保證您 100% 可訪問網站,但是是的,它會提高您網站對訪問您網站的每個訪問者的可訪問性,並且您的網站比 90% 的 WordPress 網站更容易訪問.
殘障訪問者將能夠像其他訪問者一樣瀏覽您的網站。 由於這些訪問者還包括搜索機器人,因此您應該確信一件事,使您的網站可訪問也將使您的業務受益,並幫助您在搜索引擎中排名靠前,最終為您的業務帶來更多利潤。
我希望這篇博文對您有用,您將從這裡獲取一些關鍵元素,您將