במקרים רבים ישנם אלמנטים קליקביליים (לחיצים) או אזורים חשובים שצריך לתת אפשרות למשתמש לנווט אליהם בעת לחיצה על הכפתור TAB שבמקלדת.

ניתן "לאלץ" את קבלת הפוקוס (גם אם לא מוגדר שם קישור או שהקישור אינו מוגדר בצורה תקינה) על ידי השימוש בצמד המילים TABINDEX במסגרת הקוד של האתר.

קבלת פוקוס לאזורים חשובים ומרכזיים בעמוד הוא חלק בלתי נפרד מהנגשת האתר והתאמתו לאנשים המשתמשים בקורא מסך. במידה ואותם אזורים לא מקבלים פוקוס, אנשים המסתייעים באמצעות המקלדת וקורא המסך אינם יכולים לגשת אליהם וכך נמנעת מהם האפשרות להבין מה כתוב באותו אזור.

דוגמה לאזורים חשובים שיש להוסיף להם TABINDEX בעת הנגשת האתר:

• קבלת פוקוס לשם מוצר באתר מכירות המציג מוצרים שונים לרכישה
• קבלת פוקוס למחיר המוצר שיאפשר למשתמש באמצעות המקלדת והקורא מסך להבין מה המחיר שלו.
• אזורים מרכזיים וחשובים כגון דפי אודות או טפסים ליצירת קשר שלא מורכבים מקישורים ואין אפשרות להגיע אליהם באמצעות המקלדת.
• מידע הכתוב במסגרת פופאפ או חלון נפתח בעת כניסה לאתר, לחיצה על קישור או כפתור מסוים.

בעת קבלת פוקוס לאזור מסוים, אותו אזור יקבל מסגרת ברורה המציגה למשתמש היכן הוא נמצא. המסגרת חייבת להיות בניגוד חזותי תקין לעיצוב האתר. ברגע שנגיע לאזור הקורא מסך ידע להקריא לנו את התוכן שקיים בו וכך להנגיש עבורנו את המידע בצורה הטובה והנוחה ביותר.

איך מגדירים TABINDEX במסגרת אלמנט מסוים

במידה וישנם אזורים מרכזיים שצריכים לקבל פוקוס או אלמנטים קליקבילים שאינם נגישים ואינם מקבלים פוקוס מתאים באמצעות לחיצה על המקש TAB, יש להוסיף לו בקוד TABINDEX כדי לגרום לו להגיע לשם בעת לחיצה על הכפתור TAB.

הגדרת היררכיה בעת הניווט באמצעות המקש TAB

ישנם שלוש אפשרויות מרכזיות שניתן להשתמש בהן במסגרת השימוש בTABINDEX:

שימוש בTABINDEX- שלילי

מתן ערך שלילי לאזור מסוים באמצעות TABINDEX – לדוגמה: אtabindex=-1 מונע מהמשתמש להגיע לאותו אזור בעת לחיצה על המקש TAB, כלומר לא משנה כמה פעמים המשתמש ילחץ הוא לא יצליח להגיע לאותו אזור. משתמשים בערך שלילי במקומות שבהן הערך לגולש הוא נמוך מאוד (ולעיתים אף אפסי) לדוגמה באזורים דקורטיביים, או מפה המוגדרת IFRAME בתוך האתר (שיש לה חלופה טקסטואלית מלאה) וכך אנו מונעים את ההגעה אליו מה שעלול לסבך את הניווט בעמוד.

 שימוש בTABINDEX- חיובי

שימוש ב-TABINDEX חיובי מאפשר למשתמש לקבלת פוקוס לפי הסדר המוגדר בקוד או במסגרת השימוש בTABINDEX-.

לדוגמה: שימוש ב- tabindex=1 נותן עדיפות לקורא המסך להגיע למקום ספציפי באתר. בעת הוספת הספרה 1 במסגרת הקוד, אתם מגדירים לקורא מסך להגיע לאזור הזה ראשון, כלומר אותו אזור בעל חשיבות עליונה ואנו רוצים שהוא יקבל פוקוס ראשון בעת הגעה לעמוד/לאתר.

שימוש בTABINDEX- ניטרלי

שימוש ב-TABINDEX  ניטרלי לדוגמה: tabindex=0 – גורם לקבלת פוקוס בעת לחיצה על המקש TAB במקלדת. הסדר יתבצע בהתאם לסדר הקישורים או האלמנטים שכבר הגדרנו בהם TABINDEX. שימוש בצורה ניטרלית תאפשר לכם לשמור על סדר הניווט הקיים באתר תוך כדי הוספה של אלמנט נוסף המקבל פוקוס. לרוב השימוש בTABINDEX- ניטרלי הוא השימוש הנפוץ ביותר לאזורים או אלמנטים לחיצים הנמצאים במקום מסוים בקוד/מבנה האתר ואנו רוצים שהם יקבלו פוקוס בהתאם למקום שבו הם נמצאים.