ניווט התמצאות ואיתור מידע

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

הנחיות נגישות רלוונטיות

2.4.1 עקיפת בלוקים: יש לספק מנגנון לעקיפת בלוקים החוזרים על עצמם בעמודים באתר (רמה A)

2.4.2 דף בעל כותרת: דפי רשת הם בעלי כותרות המתארות נושא או מטרה. (רמה A)

2.4.3 סדר ה-Focus: כאשר דף רשת ניתן לניווט ברצף ורצפי הניווט משפיעים על משמעות או על פעולה, מרכיבים שניתן לכוון להם את ה-focus מקבלים אותו בסדר המשמר משמעות ותפעול. (רמה A)

2.4.4 מטרת הקישור (בהקשר): המטרה של כל קישור עשויה להקבע מתוך טקסט הקישור עצמו או מתוך טקסט הקישור יחד עם הקשר הקישור על פי זיהוי ע"י תוכנה, מלבד המקרים בהם המטרה של הקישור תהיה בלתי ברורה למשתמשים באופן כללי. ((רמה A)

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

2.4.6 כותרות ותויות: כותרות ותויות מתארות נושא או מטרה. (רמה AA)

Focus 2.4.7 נראה לעין: לכל ממשק משתמש זמין של מקלדת יש מצב הפעלה בו ניתן לראות את focus המקלדת. (רמה AA)

טכניקות לניווט והתמצאות נגישים

כותרות

• ספקו כותרת לכל עמוד – h1. מומלץ שבכל עמוד יהיה רק h1 אחד. כל שאר הכותרות יסומנו ב h2 והלאה.
• ספקו page title ייחודי לעמוד – ודאו שהוא מתאר את תוכן העמוד וכולל את שם האתר.

תפריטים

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

• תפריט הינה ישות היררכית – יש לה כותרת (למשל תפריט ראשי, תפריט פעולות) הצגת הכותרת (h tag) אם באופן חשוף או בצורה נסתרת תאפשר למשתמשי קורא מסך לנווט בנוחות באתר שלהם. כמו כן יש לבנות את התפריטים באמצעות רשימות מקוננות (list).
• הבטיחו שניתן להפעיל את כל הקישורים בתפריטים באמצעות מקלדת. הקפידו שסדר הניווט באמצעות מקלדת tab order, יהיה היגיוני ותואם למבנה ההיררכי של התפריט.
• אם אתם משנים את העיצוב במצב של mouse over הקפידו לעשות זאת גם ב on focus.

קישורים

• מטרת הקישור חייבת להיות ברורה מטקסט הקישור. אל תשתמשו ב"לחץ כאן" "לפרטים נוספים" וכדומה. כתבו את מטרת הקישור באופן ברור בתוך טקסט הקישור. אם אתם מתקשים לבצע זאת ודאו שטקסט הקישור הוא חלק מטקסט המסביר מהי מטרת הקישור והוסיפו את מטרת הקישור לtitle שלו ו/או לalt שלו אם הקישור הוא תמונה.
• עיצוב הקישור – ודאו שהקישור מובחן משאר הטקסט על המסך. כאשר ההבחנה של קישור נעשית בצבע בלבד (דבר שלא רצוי לעשות) יש להשתמש ב underline או בשינוי רקע ב on mouse over ו on focus. שינוי הצבע של הרקע חייב להיות ביחס של 1:3 מהצבע המקורי של הרקע. כמו כן הצבע של הקישור חייב להיות בולט לעומת צבע הטקסט הרגיל ביחס ניגודיות של 1:3.