การออกแบบการนำทางด้วยคีย์บอร์ดสำหรับ Data Grid
ผู้ใช้งานระดับสูง (Power users) ต้องการทำงานโดยไม่ใช้เมาส์
Data Grid ที่ได้รับการออกแบบมาอย่างดีจะช่วยให้พวกเขาสามารถนำทาง แก้ไข และดำเนินการต่างๆ ได้โดยใช้เพียงคีย์บอร์ดเท่านั้น ผู้ใช้งานกลุ่มนี้ทำงานได้เร็วกว่าผู้ที่ใช้เมาส์ถึงสองถึงสามเท่า
หาก Grid ของคุณบังคับให้ต้องคลิกในทุกการกระทำ ผู้ใช้งานระดับสูงจะไม่ชอบเครื่องมือของคุณเลย
วิธีแก้ไขนั้นง่ายมาก โดยใช้โค้ดเพียงประมาณหนึ่งร้อยบรรทัดและการเลือกการออกแบบที่ชาญฉลาด
ปฏิบัติตามกฎเหล่านี้เพื่อให้ได้ Grid ที่เป็นมืออาชีพ:
• Tab: ใช้เพื่อเข้าหรือออกจาก Grid เมื่ออยู่ภายในแล้ว Tab ควรใช้เพื่อเลื่อนระหว่างปุ่มหรือช่องกรอกข้อมูล (inputs) ภายในแถวเดียวกัน อย่าใช้ Tab เพื่อเลื่อนระหว่างเซลล์ (cells)
• Arrow Keys: ใช้เพื่อเลื่อนระหว่างเซลล์ ปุ่มขึ้นและลงใช้เพื่อเลื่อนระหว่างแถว ปุ่มซ้ายและขวาใช้เพื่อเลื่อนระหว่างคอลัมน์
• Enter: ใช้เพื่อเริ่มการดำเนินการหลักของแถว เช่น การเปิดมุมมองรายละเอียด (detail view)
• Space: ใช้เพื่อเลือกหรือยกเลิกการเลือกแถว
• Escape: ใช้เพื่อยกเลิกการแก้ไขหรือปิดเมนู
• Home และ End: ใช้เพื่อกระโดดไปยังจุดเริ่มต้นหรือจุดสิ้นสุดของแถว
ข้อผิดพลาดที่ใหญ่ที่สุดคือการใช้ Tab เพื่อเลื่อนระหว่างเซลล์ ใน Grid ขนาดใหญ่ วิธีนี้จะช้าเกินไป หาก Grid มี 7 คอลัมน์ และมี 20 แถวที่มองเห็น ผู้ใช้จะต้องกด Tab ถึง 140 ครั้งเพื่อจบหน้าจอเดียว Arrow keys สามารถแก้ปัญหานี้ได้ เพียงกดครั้งเดียวก็สามารถเลื่อนไปยังแถวถัดไปได้ทันที
สำหรับการแก้ไขแบบ Inline (inline editing) ให้ทำตามรูปแบบของ Spreadsheet:
- กด Enter เพื่อเริ่มแก้ไขเซลล์
- กด Enter อีกครั้งเพื่อบันทึกการเปลี่ยนแปลง
- กด Escape เพื่อยกเลิกการแก้ไข
- กด Tab เพื่อบันทึกและเลื่อนไปยังเซลล์ถัดไปที่แก้ไขได้
เพื่อช่วยให้ผู้ใช้ค้นหาทางลัดเหล่านี้ได้ง่ายขึ้น ให้ใช้รูปแบบดังนี้:
- เพิ่มทางลัด "?" เพื่อเปิดเมนูช่วยเหลือ
- แสดงทางลัดใน Tooltips บนปุ่มต่างๆ
- ใช้คำแนะนำการใช้งาน (onboarding tip) แบบครั้งเดียว
การนำทางด้วยคีย์บอร์ดที่ดีคือตัวคูณประสิทธิภาพการทำงาน (productivity multiplier) มันเป็นการลงทุนเพียงเล็กน้อยเพื่อเพิ่มความเร็วในการทำงานของผู้ใช้ได้อย่างมหาศาล