נגישות: שימוש ב-Accessibility Wizard (אשף הנגישות)

סמני מיקוד הם מלבנים כחולים שמופיעים מסביב לאלמנטים אינטראקטיביים (כמו כפתורים או לינקים) כשהגולשים משתמשים במקלדת כדי לנווט באתר.

הם מאפשרים לגולשים לראות מה המיקום הנוכחי שלהם - ולכן חשובים לנגישות באתר. קראו מידע נוסף על סמני מיקוד.

הפיצ'ר 'דילוג לתוכן הראשי' מאפשר לגולשים שמנווטים באתר באמצעות המקלדת לעקוף את המקטעים העליונים באתר (כמו התפריטים וכותרות העמודים) ולדלג ישירות לתוכן הראשי של העמוד. 

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

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

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

אם הוספתם את Wix Multilingual לאתר, אי אפשר לשנות את השפה הראשית שנבחרה במהלך ההגדרה.  

עם זאת, אתם יכולים:

סדר מודל אובייקטי המסמכים (DOM) באתר קובע את סדר "הקריאה" של האלמנטים בעמוד.

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

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

לכן, ארגון סדר ה-DOM של האתר חשוב לנגישות, כי הוא מבטיח שגולשים שמשתמשים בטכנולוגיות המסייעות והנוספות האלה יוכלו לגלוש ולנווט באתר בסדר הגיוני. לפרטים נוספים על סדר DOM ונגישות

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

האשף ינחה אתכם לשנות את הכותרת של העמוד כשתג הכותרת מכיל New page (ברירת המחדל שמשויכת לעמודים חדשים שאתם מוסיפים לאתר), או Copy of (ברירת המחדל שמשויכת לעמודים ששוכפלו).

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

טיפ: תגים מדויקים של כותרת העמוד הם גם חלק חשוב מה-SEO של האתר שלכם.

תגי ה-Heading הם אלמנטים בקוד ה-HTML של האתר שקובעים את ההיררכיה / המבנה של תוכן הטקסט בעמוד. תגי ה-Heading מופיעים בסדר למעלה-למטה, מ-Heading 1 ‏(H1) ל-Heading 6 ‏(H6), ואז טקסט של פסקה (P).

טכנולוגיות מסייעות משתמשות בתגי heading כדי לדעת את סדר התוכן בעמוד. לדוגמה, קוראי מסך קוראים קודם תוכן ב-H1, אחריו את H2,‏ H3 וכו'. 

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

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

טקסט חלופי (alt text) הוא תיאור טקסטואלי של תמונה בעמוד אינטרנט.

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

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

ניגודיות הצבעים היא מדד להבדל בבהירות הנתפסת בין שני צבעים, ומתבטאת כיחס שנע בין 1:1 (ללא ניגודיות) ל-21:1 (ניגודיות חזקה). ניגודיות חזקה מבטיחה שיהיה קל לראות ולקרוא את התוכן באתר. 

יחס ניגודיות הצבעים הרצוי תלוי בסוג האלמנט וברמת ה-Web Content Accessibility Guidelines (WCAG) שאתם רוצים להשיג - AA (דרישת המינימום) או AAA (משופר):

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

הערה: נדרשת כרגע רק רמה AA באשף הנגישות.

ייתכן שהאשף יזהה אלמנטים ותכנים בעמוד שלא נגישים במלואם לגולשים. בהתאם לסוג האלמנט, יכול להיות שתוכלו להחליף אותו באלמנט חלופי מהחלונית Add Elements (הוספת אלמנטים). אם אין אפשרויות מתאימות, מומלץ להסיר אותו מהאתר.

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

טקסט או אלמנטים שמקשרים לעמודים, לקטעים או לאתרים אחרים צריכים להיות כמה שיותר תיאוריים. לדוגמה, 'מידע נוסף על המחקר האחרון שלנו' ברור יותר מ'למידע נוסף'. גם צריך שיהיה ברור אם הם מובילים לפעולה, כמו שליחת טופס. קראו את מסמך ה-Web Content Accessibility Guidelines ‏(WCAG) בנושא מטרת הלינקים.

מידע שמועבר באמצעות צבע צריך לכלול אינדיקטורים (סמני זיהוי) נפרדים, כמו תבניות, סגנון פונט ואייקונים. לדוגמה, טקסט של לינק צריך להיות מסומן בקו תחתון, וגרפים צריכים להציג נתונים גם עם תבניות או מרקמים שונים. קראו את מסמך ה-Web Content Accessibility Guidelines ‏(WCAG) על השימוש בצבע.

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

אם הטקסט של התמונה הוא חלק חשוב מתוכן האתר, או שהוא חיוני בהעברת מידע, כללו את הטקסט בתיאור התמונה (alt text). קראו מידע נוסף על טקסט בתמונות.

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

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

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