משתמשים שונים רבים מסתמכים על המקלדת כדי לנווט בין אפליקציות, החל ממשתמשים עם לקויות מוטוריות זמניות וקבועות ועד משתמשים שנעזרים במקשי קיצור כדי להיות יעילים ופרודוקטיביים יותר. סדר כרטיסיות לוגי הוא מרכיב חשוב ביצירת חוויית ניווט חלקה במקלדת.
איך מבצעים בדיקה ידנית
כדי לבדוק אם סדר הכרטיסיות באפליקציה הגיוני, תוכלו לדפדף בין הכרטיסיות. הסדר שבו הרכיבים מתמקדים צריך להיות לפי סדר ה-DOM. באופן כללי, המיקוד צריך להיות לפי סדר הקריאה, משמאל לימין, מהחלק העליון לתחתית הדף.
מידע נוסף זמין במאמר יסודות הגישה למקלדת.
האם אתם מצליחים להגיע לכל הפקדים האינטראקטיביים בדף?
אם לא, יכול להיות שצריך להשתמש בtabindex כדי לשפר את יכולת המיקוד של אמצעי הבקרה האלה.
כקו מנחה כללי, כל אמצעי בקרה שבהם המשתמש יכול לבצע אינטראקציה או לספק קלט צריך להיות ניתן למיקוד ולהציג אינדיקטור של מיקוד.
אם משתמש במקלדת לא יכול לראות את מה שנמצא במיקוד, אין לו דרך ליצור אינטראקציה עם הדף.
איך פותרים את הבעיה
אם נראה שסדר המיקוד שגוי, כדאי לארגן מחדש את הרכיבים ב-DOM כדי שסדר הכרטיסיות יהיה טבעי יותר.
אם אינך מצליח להגיע לכל הפקדים האינטראקטיביים בדף, הפתרון הראשון הוא להחליף פקדים מותאמים אישית בחלופות HTML סטנדרטיות.
לדוגמה,
צריך להחליף את <div> שפועל כמו לחצן ב-<button>.
שימוש ברכיבי HTML מובנים יכול לשפר משמעותית את נגישות האתר ולהפחית משמעותית את עומס העבודה.
אם יוצרים רכיבים אינטראקטיביים מותאמים אישית שאין להם קוד HTML סטנדרטי, צריך להשתמש במאפיין tabindex כדי לוודא שאפשר לגשת אליהם באמצעות המקלדת.
לדוגמה:
<div tabindex="0">Focus me with the TAB key</div>
מידע נוסף זמין במאמר שליטה במיקוד באמצעות Tabindex.