ไม่กี่วิธีในการทำให้เว็บไซต์ของคุณเข้าถึงได้ง่าย

เผยแพร่แล้ว: 2017-02-15

การจัดโครงสร้างหน้าและเนื้อหาทำให้เป็นมิตรกับเครื่องจักร ไม่ว่าเครื่องนั้นจะเป็นอะไรก็ตาม เพิ่มชนิดของเทคนิคสามัญสำนึกที่อนุญาตให้ผู้ใช้ (รวมถึงผู้ใช้ที่มีความพิการ) และเครื่องจักรเข้าถึงเนื้อหาที่มีความหมายได้โดยตรง และแน่นอนว่าคุณกำลังก้าวไปสู่การทำให้ไซต์ของคุณเข้าถึงได้ง่ายและเครื่องมือค้นหาที่เป็นมิตร

เราทุกคนต่างคุ้นเคยกับพลังของ WordPress ซึ่งช่วยให้มือใหม่หรือผู้ที่ไม่ใช่ผู้เชี่ยวชาญสามารถออกแบบและพัฒนาพื้นที่เว็บของตนเองได้ แพลตฟอร์มนี้ติดตั้งง่าย และมีกรอบงานที่มั่นคงสำหรับธีมและปลั๊กอินที่จะกำหนดว่าเนื้อหาและฟังก์ชันของคุณจะเป็นอย่างไรสำหรับผู้เยี่ยมชม

หากคุณต้องการให้ไซต์ของคุณสามารถเข้าถึงได้โดยบุคคลที่มีความทุพพลภาพ คุณจะพบว่า WordPress พื้นฐานมีหลายอย่างที่จำเป็นต่อการอำนวยความสะดวกในการพัฒนาเว็บไซต์ที่สามารถเข้าถึงได้ และไม่ยากที่จะดำเนินการเพิ่มเติมด้วยการเพิ่มปลั๊กอินและสิ่งที่ดี เทคนิค.

ก่อนที่เราจะเริ่มต้น มีสองปัจจัยสำคัญที่ต้องระวัง ประการแรก การใช้เทคนิคทั้งสี่นี้เพียงอย่างเดียวจะไม่ทำให้เว็บไซต์ใด ๆ เข้าถึงได้สำหรับทุกคนในขอบเขตของการปฏิบัติตามข้อกำหนดที่จำเป็นทั้งหมด แต่จะจัดการกับอุปสรรคที่พบบ่อยที่สุดในการเข้าถึงเว็บและให้การเข้าถึงที่มากขึ้น

ประการที่สอง สิ่งสำคัญคือต้องเข้าใจว่าการช่วยสำหรับการเข้าถึงสามารถทำได้โดยอาศัยความร่วมมือด้านการออกแบบ การพัฒนา และแนวทางปฏิบัติที่ดีที่สุดในการสร้างเนื้อหา นักออกแบบอาจออกแบบธีมที่สามารถเข้าถึงได้ นักพัฒนาอาจเพิ่มฟังก์ชันที่สามารถเข้าถึงได้ แต่ถ้าผู้เขียนเนื้อหาแทรกรูปภาพที่มีความหมายโดยไม่มีแท็ก alt ความหมายทั้งหมดของหน้าเว็บจะไม่สามารถเข้าถึงได้

ด้วยเหตุนี้ จึงมีเคล็ดลับสี่ประการในการทำให้ไซต์ของคุณเข้าถึงได้ง่าย

ข้อความแสดงแทนสำหรับรูปภาพของคุณ

เป็นที่ทราบกันดีว่าอุปสรรคที่สำคัญที่สุดประการหนึ่งในการเข้าถึงเว็บคือการใช้ข้อความแสดงแทนอย่างเหมาะสมเพื่ออธิบายรูปภาพบนหน้าเว็บ หากทุกคนที่สร้างเว็บไซต์แก้ไขจุดเดียวนี้ จุดนี้จะขจัดข้อร้องเรียนเกี่ยวกับการเข้าถึงได้จำนวนมากที่สุด และนั่นเป็นเหตุผลที่เรารู้สึกอยากที่จะพัฒนาปลั๊กอิน SEO Image Optimizer ที่น่าทึ่ง ซึ่งจะเติมช่องว่างของแท็ก alt ที่หายไปบนรูปภาพ

ประเด็นพื้นฐานที่ต้องทำความเข้าใจคือ หากคุณกำลังจะใส่ภาพลงในไซต์ของคุณ คุณจำเป็นต้องติดป้ายกำกับให้ถูกต้องด้วยข้อความแสดงแทน กล่าวอีกนัยหนึ่ง ทุกภาพที่คุณวางออนไลน์ต้องมีความหมายสำหรับหุ่นยนต์ในการแสดงรายการภาพของคุณในเครื่องมือค้นหา

ข้อมูลในแท็ก alt อนุญาตให้ผู้ใช้โปรแกรมอ่านหน้าจอ (ซึ่งอ่านหน้าเว็บสำหรับผู้ใช้ที่มีความบกพร่องทางการมองเห็น) เบราว์เซอร์แบบข้อความเท่านั้น และการเชื่อมต่อที่ช้าซึ่งจะไม่โหลดภาพเพื่อให้เข้าใจข้อมูลที่ถ่ายทอดโดยรูปภาพ

หากรูปภาพไม่มีความหมาย เช่น ใช้สำหรับตกแต่งเท่านั้น มีวิธีจัดการสองวิธี หากคุณโหลดเป็นภาพพื้นหลังโดยใช้ CSS โปรแกรมอ่านหน้าจอจะไม่สนใจมันและรูปภาพนั้นไม่ต้องการแท็ก alt (โปรดระวัง เนื่องจากสิ่งนี้ใช้กับภาพที่มีความหมายด้วย: หากคุณโหลดในพื้นหลัง โปรแกรมอ่านหน้าจอจะไม่สนใจ ). หากรูปภาพแสดงโดยใช้ HTML แต่มีการตกแต่งเพียงอย่างเดียว ให้ใช้แท็ก alt แต่เว้นว่างไว้ ที่บอกโปรแกรมอ่านหน้าจอว่ามีภาพอยู่แต่ไม่มีความหมายสำหรับผู้ใช้ และสามารถละเลยได้ ซึ่งจะทำให้เว็บไซต์ของคุณเข้าถึงได้ง่ายขึ้นสำหรับผู้อ่าน

เมื่อคุณติดป้ายกำกับบนรูปภาพของคุณ ให้ใช้ข้อความอธิบายที่จะช่วยให้ผู้ที่มองไม่เห็นสามารถเข้าใจความหมายของรูปภาพได้ สิ่งนี้ต้องใช้วิจารณญาณ: เหตุใดรูปภาพจึงอยู่ที่นี่และสื่อถึงข้อความใด และคำใดที่จะสื่อความหมายเดียวกันได้ดีที่สุด อย่าจมอยู่กับคำอธิบายตามตัวอักษรของทุกรายละเอียดของภาพ ให้ถ่ายทอดความหมาย

ตัวอย่างคลาสสิกคือรูปภาพของแว่นขยายที่ใช้เป็นปุ่มเพื่อเริ่มการค้นหา รูปภาพมีความหมายจึงควรอธิบาย อธิบายว่าเป็น "แว่นขยาย" ไม่ได้ช่วยผู้ใช้ สิ่งที่พวกเขาจำเป็นต้องรู้คือการคลิกที่ปุ่มนี้จะเริ่มต้นการค้นหา ดังนั้นข้อความแสดงแทนของ "คลิกที่นี่เพื่อค้นหา" หรือแม้แต่เพียงแค่ "ค้นหา" อาจเหมาะสมที่สุด

ต้องมีป้ายกำกับรูปภาพที่มีจุดประสงค์เท่านั้น ตัวอย่างของสิ่งเหล่านี้มีดังนี้:

รูปภาพที่ใช้เป็นปุ่ม

รูปภาพที่ใช้เป็นลิงค์

รูปภาพที่ใช้สำหรับการควบคุมอื่น ๆ

รูปภาพที่เกี่ยวข้องโดยตรงกับเนื้อหา

เทคนิคนี้ใช้ได้กับทุกเว็บไซต์ ไม่ใช่แค่เว็บไซต์ WordPress อย่างไรก็ตาม WordPress ทำให้ง่ายกว่าส่วนใหญ่ ประการแรกโดยอนุญาตให้ผู้เขียนเนื้อหาสลับไปมาระหว่างมุมมอง Visual และ HTML และประการที่สองโดยการจัดเตรียมฟิลด์สำหรับข้อความแสดงแทนเมื่อใดก็ตามที่มีการแทรกรูปภาพโดยใช้ฟังก์ชัน Add Media

ปลั๊กอินเพื่อการเข้าถึงที่ดีขึ้น

สามารถปรับปรุงการเข้าถึง WordPress ได้โดยใช้ปลั๊กอินที่หลากหลาย ปลั๊กอินเหล่านี้ติดตั้งง่าย และจะช่วยให้ผู้ใช้ที่มีความพิการหลากหลายเข้าถึงไซต์ได้ ต่อไปนี้คือปลั๊กอินบางตัวที่ฉันพบซึ่งจะทำให้ไซต์ของคุณเข้าถึงได้ง่าย

คีย์การเข้าถึง

ปลั๊กอิน Access Keys ช่วยให้สามารถกำหนดคีย์การเข้าถึงให้กับลิงก์และการควบคุมบนเว็บไซต์ของคุณได้ ตัวอย่างเช่น ลิงก์หน้าแรกอาจถูกกำหนดให้ใช้คีย์ผสม alt+h และปุ่มค้นหาอาจกำหนดชุดคีย์ผสม alt+s คีย์การเข้าถึง เช่น ตัวอย่างที่มีให้ ช่วยให้ผู้ใช้ที่มีความบกพร่องทางสายตาและผู้ที่มีปัญหาด้านการเคลื่อนไหว สามารถเข้าถึงสิ่งที่พวกเขาต้องการได้อย่างง่ายดาย

รีทวีตง่ายๆ

รีทวีตอย่างง่ายเป็นปลั๊กอินที่จะให้คุณเพิ่มปุ่มที่เข้าถึงได้ในหน้าของคุณ ซึ่งอำนวยความสะดวกในการแบ่งปันเนื้อหาของคุณบน Twitter ด้วยวิธีนี้ หากผู้ทุพพลภาพต้องการแบ่งปันเพจของคุณกับเพื่อน ๆ พวกเขาสามารถทำได้โดยไม่มีปัญหาใดๆ

AStickyPostOrderER

AstickyPostOrderER ให้คุณเลือกลำดับการแสดงเนื้อหาของคุณ คุณสามารถเลือกที่จะแสดงเนื้อหาจากเก่าที่สุดไปใหม่สุดหรือในลำดับที่กลับกัน

สารบัญ SEO Hackadelic

ปลั๊กอิน Hackadelic SEO Table of Contents ช่วยให้คุณสามารถจัดเตรียมสารบัญสำหรับโพสต์หรือหน้าของคุณ ซึ่งจะทำให้เนื้อหาของคุณค้นหาได้ง่าย

WP-โพล

WP-Polls อนุญาตให้บุคคลที่มีความทุพพลภาพเข้าร่วมในการสำรวจใด ๆ ที่คุณอาจมีในเว็บไซต์ของคุณ

มีการพัฒนาปลั๊กอินใหม่อยู่ตลอดเวลา ใช้ฟังก์ชันแดชบอร์ดของ WordPress เพื่อค้นหาเพิ่มเติม ลองใช้ปลั๊กอินต่างๆ และขอให้ผู้ใช้ที่มีความทุพพลภาพแสดงความคิดเห็น

เมื่อใช้ปลั๊กอินใด ๆ ตรวจสอบให้แน่ใจว่าปลั๊กอินที่ใช้นั้นเข้ากันได้กับธีมที่คุณเลือกรวมถึงธีมอื่นด้วย หากปลั๊กอินของคุณเข้ากันไม่ได้กับธีมของคุณ ปลั๊กอินเหล่านั้นจะไม่ทำงานหรือจะทำให้เกิดปัญหามากขึ้นสำหรับผู้ใช้ที่ปิดใช้งานที่พยายามเรียกดูไซต์ของคุณ หากปลั๊กอินของคุณเข้ากันไม่ได้ ไซต์ของคุณอาจแสดงผลไม่ได้หรือเนื้อหาอาจแสดงอย่างไม่ถูกต้อง

วิธีที่จะไปกับหัวเรื่อง

เมื่อคุณออกแบบเพจ จำเป็นต้องจัดโครงสร้างเนื้อหาโดยใช้หัวเรื่องตามลำดับที่ถูกต้อง: <h1> , <h2> , <h3> และอื่นๆ เมื่อคุณจัดโครงสร้างเนื้อหาโดยใช้หัวเรื่อง ผู้ที่ใช้โปรแกรมอ่านหน้าจอจะได้รับข้อมูลสรุปเกี่ยวกับหน้าต่างๆ และนำทางได้ง่ายขึ้น ผู้ใช้โปรแกรมอ่านหน้าจอสามารถเข้าถึงส่วนต่างๆ ของเนื้อหาที่ต้องการได้โดยการกดตัวอักษร "H" เพื่อไปข้างหน้าและ "shift+H" เพื่อย้อนกลับ

คุณสามารถติดป้ายกำกับเนื้อหาของคุณโดยใช้หัวเรื่องตั้งแต่หนึ่งถึงหกเพื่อทำให้ไซต์ของคุณเข้าถึงได้ง่าย ตรวจสอบว่าธีมของคุณใช้ส่วนหัวอย่างไร (เช่น ธีมของคุณอาจใช้หรือไม่ใช้ <h1> กับชื่อไซต์และชื่อไซต์นั้นอาจปรากฏหรือไม่ปรากฏบนหน้าเว็บทุกหน้า ไม่ว่าจะด้วยวิธีใด ตรวจสอบให้แน่ใจว่าส่วนหัวแรกที่ใช้คือ <h1> และหัวเรื่องต่อไปนี้ (ชื่อหน้า ส่วนย่อยของหน้า หัวของย่อหน้า) เรียงตามลำดับจนถึง <h6> ตามความเหมาะสม

การสั่งซื้อมีความยืดหยุ่นบ้าง แต่ตัวเลือกที่สมเหตุสมผลที่สุดคือให้หัวเรื่องเรียงตามลำดับตัวเลขและอย่าผสมปนเปกัน เพราะจะสร้างสถานการณ์อันตรายทั้งสำหรับผู้ใช้และเครื่องมือค้นหา (อย่าผสมกันในลักษณะนี้ – > <h1> , <h4> , <h2> ฯลฯ)

ลิงค์การนำทางมีประโยชน์

สุดท้าย คุณต้องมีลิงก์การนำทางในการออกแบบไซต์ของคุณ ลิงก์การนำทางเหล่านี้จะทำให้ผู้ใช้ที่มีความพิการสามารถข้ามผ่านแถบนำทางหรือเมนูอื่นๆ และช่องค้นหา และข้ามไปยังบางตำแหน่งบนหน้าได้ด้วยการคลิกลิงก์เหล่านี้ หรือผู้ใช้สามารถข้ามไปยังส่วนที่ต้องการบนไซต์ได้อย่างรวดเร็ว ลิงก์เหล่านี้ต้องปรากฏทุกที่ที่ผู้ใช้จำเป็นต้องข้ามไปยังเนื้อหาที่มีความหมาย ตัวอย่างของสิ่งที่ลิงก์เหล่านี้อาจกล่าวคือ:

ข้ามไปที่เนื้อหาหลัก

ข้ามไปที่แถบนำทาง

ข้ามไปที่การค้นหา

ธีม WordPress บางธีมอาจมีลิงก์ดังกล่าวแล้ว หากเป็นกรณีนี้ คุณจะต้องตรวจสอบลิงก์เหล่านี้เพื่อดูว่าคุณต้องเพิ่มลิงก์ของคุณเองหรือไม่ อย่างไรก็ตาม ธีมอื่นๆ จะไม่มีลิงก์การนำทาง ดังนั้น คุณจะต้องเพิ่มลิงก์เหล่านี้ด้วยตนเอง

ห่อ

ฉันจะพูดซ้ำในสิ่งที่ฉันพูดไปก่อนหน้านี้ว่าไม่มีขั้นตอนใดรับประกันว่าคุณสามารถเข้าถึงเว็บไซต์ได้ 100% แต่ใช่ มันจะช่วยเพิ่มการเข้าถึงเว็บไซต์ของคุณสำหรับผู้เยี่ยมชมทุกคนที่เข้าชมเว็บไซต์ของคุณ และเว็บไซต์ของคุณสามารถเข้าถึงได้มากกว่า 90% ของเว็บไซต์ WordPress ที่มีอยู่ .

ผู้เข้าชมที่มีความทุพพลภาพจะสามารถไปยังส่วนต่างๆ ของไซต์ของคุณได้เช่นเดียวกับผู้เยี่ยมชมคนอื่นๆ เนื่องจากผู้เยี่ยมชมเหล่านี้รวมโรบ็อตการค้นหาด้วย คุณจึงควรมั่นใจได้ในสิ่งหนึ่งว่าการทำให้ไซต์ของคุณสามารถเข้าถึงได้จะเป็นประโยชน์ต่อธุรกิจของคุณ และช่วยให้คุณติดอันดับบนเครื่องมือค้นหาในท้ายที่สุด ส่งผลให้ธุรกิจของคุณมีกำไรมากขึ้น

ฉันหวังว่าโพสต์ในบล็อกนี้จะเป็นประโยชน์สำหรับคุณ และคุณกำลังนำองค์ประกอบสำคัญบางส่วนจากที่นี่ซึ่งคุณจะ