במאמר הבא אני אפרט לכן מספר הנחיות חשובות שיאפשרו לכם לשפר את רמת הנגישות באתר האינטרנט שלכם לאנשים עם מוגבלות. יישום ההנחיות הללו יבטיחו גישה טובה ונגישה יותר לאתר שלכם לכל אדם.
יישום ההנחיות זה לא רק יעזור למשתמשים עם מוגבלות המשתמשים בתוכנות להקראת מסך או באמצעות ניווט במקלדת, אלא גם ישפר את חוויית הגלישה לכלל האוכלוסייה. לפני שאתם שוכרים את שירותיו של יועץ נגישות לאתרי אינטרנט שווה לבדוק האם האתר שלכם עומד בהנחיות הנגישות שמפורסמות במאמר.
קודם כל נסביר בקצרה מהו תהליך של נגישות באינטרנט
על פי הנחיות הארגון הבינלאומי W3C, נגישות באינטרנט פירושה שכל אדם יכול לתפוס, להבין, לנווט, לתקשר ולגלוש בבטחה באתר האינטרנט. בעניין זה בעת נגישות באתר יש לטפל בכל הנושאים הקשורים לגישה ותפעול האתר בקרב אנשים עם מוגבלות בראיה, מוגבלות שמיעתית, פיזית וקוגניטיבית.
אל תשתמשו בצבע מסוים לצורך העברת מסר מסוים
צבע הוא כלי רב עוצמה שאנו משתמשים בו לעתים קרובות כדי לבטא רגשות ולהעביר הודעות או מסרים באמצעות רשת האינטרנט ובכלל. עם זאת, אסור לנו להשתמש בצבע ספציפי (או במשמעות שנגזרת ממנו) כדי להעביר מסור או מידע למשתמשים באתר שלנו.
לדוגמה, צבע ירוק פירושו "נכון" ואילו אדום פירושו "לא נכון". חשבו לרגע, מה יקרה לאדם אשר אין ביכולתו להבדיל בין הצבעים? הוא פשוט לא יוכל לצרוך או להבין את מטרתנו בשימוש שאותו צבע. ולכן חשוב להוסיף טקסט מתאים בצורה נגישה שתאפשר לו להבין במדויק את מטרת הפעולה או הקישור.
תאפשרו הגדלת התוכן או המידע המופיע באתר ל-200%
היכולת להגדיל את התצוגה אינה רק עוד הנחיה לשיפור הנגישות באתר, אלא כלי לפישוט חיי היומיום עבור אנשים שאינם מצליחים לקרוא תוכן קטן או מרכיבים משקפיים.
חוץ מזה שתאפשרו למשתמשים לבצע הגדלה והקטנה במחשבים הנייחים ובמכשירים ניידים, זכור גם לבדוק שהפריסה שלך נראית טוב עד 200% זום במגוון דפדפנים.
הצגת קישורים באתר בצורה נגישה וקלה לתפעול
כל קישור באתר צריך להיות בולט ולכלול בתוכו קו תחתון המציג לגולש כי מולו יש קישור אשר מפנה אותו לעמוד אחר באתר או מחוצה לו. כל קישור חייב להיות מפורט וברור בצורה הטובה ביותר. זכרו קישור נגיש לאנשים עם מוגבלות יאפשר להם לנווט בקלות ובמהירות בן דפי האתר ומחוצה לו.
הכנס תמיד טקסט אלטרנטיבי ALT לתמונה שאינה תמונת רקע
אנשים רבים לא מבינים את המשמעות הרבה בהוספת ALT לתמונות המופיעות באתר האינטרנט שלכם. הוספת טקסט אלטרנטיבי הוא חובה לכל תג IMG שמטרתו להעביר מסר או מידע מסוים. אם תמונה דקורטיבית בלבד המשמשת כרקע תוכלו פשוט להשתמש ב-ALT ריק.
קוראי המסכים מקריאים למשתמש שתג IMG הוא תמונה ולכן אין צורך ולהתחיל את הטקסט האלטרנטיבי שלך עם "תמונה של", פשוט לרשום בקצרה את המסר הקיים בתמונה.
הפונקציה של תמונה חשובה לא פחות ממשמעותה, לדוגמה אם הלוגו שלך מקשר ישירות לדף הבית של האתר שלך, הטקסט האלטרנטיבי שלך צריך להיות כמו "דף הבית" ולא המילה "לוגו" כפי שהיא מופיעה באתרים רבים היום.
טקסט אלטרנטיבי לא קשור רק לנגישות אתרים. לפעמים משתמשים שיש להם חיבורי אינטרנט איטיים משביתים את התמונות כדי להשיג חווית גלישה מהירה יותר בדפדפן.
אבל מה עושים אם לא כל התמונות באתר שלך בעלות תגית IMG? כמו אייקונים או קבצי לוגו בסיומת SVG. איך מנגישים באתר קבצי SVG? בכדי לתאר את הווקטורים שלנו בצורה הטובה ביותר ניתן להשתמש בתגיות H "כותרת" ותיאורים קצרים וארוכים.
הוספת כתוביות מתאימות לסרטונים שמפורסמים אצלכם באתר
זאת אחת הנחיות הנגישות באינטרנט הקשות ליישום מכיוון שתהליך הוספת כתוביות לרוב אורך זמן רב (תלוי בכמות המידע המועברת בסרטון).
ישנם כמה דרכים לעשות זאת:
ניקח למשל את היוטיוב YouTube. לאחר העלאת סרטון לפלטפורמה תוכלו לאפשר הוספת כתוביות במערכת חכמה ומתקדמת. יש אפשרות יצירת כתוביות באופן אוטומטי, אך לאחר לא מעט בדיקות ניתן להבין כי הכתוביות עשויות להתברר כלא מדויקות בנסיבות מסוימות, תלוי בשפה, רעשי רקע או הדובר בסרטון.
אם אנו מחפשים כתוביות מדויקות קשה לסמוך על YouTube שיבצע אתה זה בצורה מלאה ולכן עלינו לכתוב את הכתוביות בעצמנו או לשכור את שירותיה של חברה המתעסקת בהנגשת תוכן או כתיבת תרגומים נגישים לסרטונים.
סמנטיקה נכונה משפרת את רמת הנגישות באתר
השאלה העיקרית היא האם סמנטיקה נכונה (כמו למשל שימוש בכותרות, בולט וכו'") משפיעה רק קידום האתר בגוגל?
לא בהכרח. כשאתה בוחר במודע בתג H במקום תג P, אתה משנה במכוון את המשמעות של אותו אלמנט, מספק היררכיה ובונה מבנה נכון ומסודר של המידע בדף שלך.
קוראי המסכים משתמשים בסמנטיקה ומשמיעים למשתמשים את המידע לפי התג המתאים.
תגים נועדו לקשר קישור או קובץ אחד לקובץ אחר. עם זאת שימוש בתג זה אינו אידיאלי בכל פעם שאנו רוצים להפעיל פעולות כמו תפריטי המבורגר או גלריות תמונות.
הסתרת אלמנטים שונים מהאתר ומהתוכנה להקראת מסך
ישנן מספר שיטות זמינות להסתרת דברים באמצעות הקוד או באמצעות פקודות CSS שונות.
חשוב להבין שאם הסתרתם אלמנט מסוים מבחינה חזותית יש סיכוי שהקורא מסך עדיין יוכל לגשת אליו ולהקריא אותו מה שעלול לגרום לקושי רב בגלישה באתר בקרב אנשים עם מוגבלות בראיה. החלטתם להסתיר משהו מסוים? תוודאו כי הוא מוסתר גם באתר וגם שאינו מופיע בקוד האתר.
מעוניינים לדעת איזה עוד הנחיות חשוב ליישם לצורך תהליך של הנגשת אתרים לאנשים עם מוגבלות? צרו איתי קשר עוד היום!
