การออกแบบเว็บไซต์ที่สะดวกในการเข้าถึง (Web Accessibility)

วันที่ 14 พ.ค. 51 เป็นวันแรกของ “โครงการอบรมบุคลากร เพื่อการพัฒนาเว็บไซต์มหาวิทยาลัยมหิดล ประจำปี 2551” ที่จัดขึ้นเพื่อให้ความรู้แก่บรรดา webmaster, web content manager และผู้เกี่ยวข้องกับการจัดทำเว็บไซต์ของหน่วยงาน คณะ สำนัก สถาบัน ต่างๆ ภายในมหาวิทยาลัยมหิดล จำนวนกว่า 100 คน โดยเฉพาะ “คณะกรรมการเครือข่ายผู้ดูแลเว็บไซต์ (webmaster) มหาวิทยาลัยมหิดล” ที่ตัวเองทำหน้าที่เป็นประธาน … วันนี้เราเชิญ อาจารย์บุญเลิศ อรุณพิบูลย์ จาก STKS, NSTDA มาบรรยายเรื่อง “การออกแบบเว็บไซต์ที่สะดวกในการเข้าถึง (Web Accessibility)” ให้พวกเราฟัง เพื่อจะได้นำเทคนิคไปปรับปรุงเว็บไซต์ภายใต้ domain .mahidol.ac.th ให้มีประสิทธิภาพในการเข้าถึงได้ดีขึ้น …

มีหลายเรื่องที่ยังไม่รู้ และได้ idea เยอะแยะเลย สำหรับไปปรับเว็บที่ทำไปแล้ว ให้มีมาตรฐานดียิ่งขึ้น … มีหลายอย่างที่เราละเลยไป เช่น

  • การตั้งชื่อไฟล์และ directory ไม่ควรตั้งชื่อส่งเดช ควรตั้งชื่อที่สื่อความหมาย และสามารถใช้เป็น keyword ให้ google ค้นหาได้ด้วย
  • แบบตัวอักษร หรือฟอนต์ ถ้าเป็นภาษาไทย ควรใช้ฟอนต์มาตรฐาน เช่น Tahoma (เป็น vector font เวลาขยาย ตัวอักษรจะไม่แตก), MS Sans Serif (bitmap font), Thonburi (เผื่อสำหรับคนที่ใช้เครื่อง MacIntosh ในการดูเว็บ)
  • ทำเว็บ อย่าให้มีปัญหาเรื่อง decoding ภาษาไทย จะทำให้คนดูเว็บอ่านไม่ออก โดยเฉพาะคนที่ทำ web dynamic หรือ databases ต่างๆ  ต้องใช้ character set ที่สอดคล้องกับ server ไม่ว่าจะเป็น TIS-620 (สมอ.), Windows-874 (วินโดวส์) หรือ UTF-8 (Unicode) 
  • จำเป็นต้องใส่ “Web Metadata” ต่างๆ เข้าไป เพื่อเป็นข้อมูลให้กับ search engine และเพิ่มประสิทธิภาพในการสืบค้น … ทำให้ทุกส่วนสามารถเป็น keywords ได้ ไม่ว่าจะเป็นชื่อเว็บเพจ (title), ชื่อตำแหน่งที่อยู่ของเว็บไซต์ (URL), ควรใช้ Heading Tag <H1>,<H2> แทนการขยาย font size เพราะจะใช้เป็น keyword ได้ดีกว่า, ควรใส่ keywords หรือคำสำคัญปะปนไปกับเนื้อหาของเอกสารเว็บ (Contents) ควรใส่ Alternate Text (alt=””) อธิบายภาพ และควรกำหนดคุณสมบัติของเอกสาร .doc, .pdf, .ppt ต่างๆ ทุกครั้ง
  • ใส่ meta tags ลงในส่วนของ Head Section ในเอกสารเว็บด้วย โดยเฉพาะ description, keyword และเราสามารถตรวจสอบความเหมาะสมของ meta tags ที่ใส่ไปแล้ว ได้จาก http://www.submitexpress.com/analyzer
  • ภาพกราฟิกบนเว็บไซต์ ควรคำนึงถึงเวลา load ภาพบนหน้าจอด้วย  .jpg ให้สีมาก ทำ effect แบบ pregressive (เบลอ) ได้ แต่ทำพื้นโปร่งใสไม่ได้  .gif ให้สีน้อย ทำ effect แบบ Interlaced (แบบมู่ลี่) ได้  และทำพื้นโปร่งได้ ส่วน .png ให้สีมาก ทำพื้นโปร่งได้ ทำ Interlaced ได้ แต่ไม่แสดงผลบน IE
  • นอกจากนั้น ยังพูดถึงสัญญาอนุญาต (license agreement) แบบ Creative Commons หรือ “สงวนลิขสิทธิ์บางประการ” ที่อยู่ระหว่าง “copyright 100%” กับ “copy 100%” ช่วยให้ผู้คนสามารถเผยแพร่ ทำซ้ำงานต่างๆ ของผู้อื่นในเว็บไซต์ได้ แต่ต้องอยู่ในขอบเขตตามที่เจ้าของชิ้นงานจะกำหนด

ผู้ฟังชอบมากค่ะ บรรยายได้สนุก และเข้าใจง่าย … ต้องขอขอบคุณท่านวิทยากร อาจารย์บุญเลิศ มา ณ ที่นี้ด้วยค่ะ

This entry was posted in webmaster committee and tagged . Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s