בנוסף למבנה, קיימים רכיבי HTML תומכים רבים שכדאי לשקול כאשר פיתוח ועיצוב של נגישות דיגיטלית. לאורך הלמידה כמובן, אנחנו מכסים הרבה אלמנטים.
המודול הזה מתמקד באלמנטים ספציפיים מאוד שלא מתאימים לאף אחד את המודולים האחרים, אבל הם שימושיים להבנה.
כותרת דף
קוד ה-HTML <title>
מגדיר את התוכן של הדף או המסך שהמשתמש עומד
חוויה אישית. הוא נמצא
קטע <head> מתוך
מסמך HTML והוא מקביל ל<h1> או לנושא הראשי של הדף.
תוכן הכותרת מוצג בכרטיסיית הדפדפן ועוזר למשתמשים להבין
הדף שבו הם מבקרים, אבל הוא לא מוצג באתר או באפליקציה עצמם.
באפליקציה עם דף יחיד (SPA),
הטיפ של <title> הוא קצת שונה, כי משתמשים לא מנווטים
בין דפים, כפי שהם עושים באתרים עם מספר דפים. עבור שירותי SPA, הערך של
document.title
להוסיף את הנכס באופן ידני או באמצעות חבילת עזר, בהתאם
JavaScript framework. אנחנו מכריזים על
כותרות דפים מעודכנות
למשתמשים עם קורא מסך עשויה להימשך עבודה נוספת.
כותרות תיאוריות של דפים מועילות גם למשתמשים וגם אופטימיזציה למנועי חיפוש (SEO), לא להגזים ולהוסיף הרבה מילות מפתח. מכיוון שהכותרת ברגע שהמשתמש מבקר בדף מסוים, הוא חייב להיות מדויק, ייחודי תיאורית אבל גם תמציתית.
כשכותבים כותרות של דפים, מומלץ גם לבצע "טעינה קדמית" פנים או של תוכן חשוב קודם, ואז להוסיף את כל הדפים או המידע הקודמים אחרי. כך, משתמשי AT לא צריכים לעיין במידע שיש להם כבר שמעתם.
<title>The Food Channel | Outrageous Pumpkins | Season 3 </title>
<title>Season 3 | Outrageous Pumpkins | The Food Channel</title>
שפה
שפת הדף
מאפיין השפה של הדף (lang) קובע את שפת ברירת המחדל של הדף כולו. המאפיין הזה מתווסף לתג <html>. יש להוסיף מאפיין שפה חוקי לכל דף כי הוא מסמן את השפה ב-AT שאליה צריך לבחור את השפה.
מומלץ להשתמש ב-2 תווים קודי שפות ISO לכיסוי נרחב יותר של ATS, מאחר שרבים מהם לא תומכים קודי שפה מורחבים.
כאשר מאפיין שפה חסר לגמרי, AT יוגדר כברירת מחדל בשפת התוכנה של המשתמש. לדוגמה, אם מדד AT הוגדר לספרדית, אבל משתמש ביקר באתר או באפליקציה באנגלית, צוות השטח ינסה לקרוא את הטקסט באנגלית טקסט עם נגיעות וקצב פעולות בספרדית. השילוב הזה גורם ליצירה של של משתמש מתוסכל.
<html>...</html>
<html lang="en">...</html>
למאפיין lang אפשר לשייך רק שפה אחת. כלומר
למאפיין <html> יכולה להיות רק שפה אחת, גם אם יש כמה שפות
השפות שמוצגות בדף. מגדירים את lang כשפה הראשית של הדף.
<html lang="ar,en,fr,pt">...</html>
<html lang="ar">...</html>
שפת הקטע
אפשר גם להשתמש במאפיין השפה (lang) לשינויי שפות בתוכן עצמו. אותם כללים בסיסיים חלים כמו מאפיין השפה בדף מלא, אבל מוסיפים אותו לרכיב המתאים בתוך הדף במקום בתג <html>.
חשוב לזכור שהשפה שתוסיפו לרכיב <html> יורדת למטה אל כל
את הרכיבים הכלולים, אז צריך להגדיר תמיד את השפה הראשית של הדף
מאפיין lang ברמה העליונה תחילה.
אם יש רכיבים שונים בדף, אם הם כתובים בשפה אחרת, צריך להוסיף את הפרמטר lang.
לרכיב ה-wrapper המתאים. הפעולה הזו תבטל את
הגדרת השפה ברמה העליונה עד שהרכיב הזה ייסגר.
<html lang="en">
<body>...
<div>
<p>While traveling in Estonia this summer, I often asked,
"Kas sa räägid inglise keelt?" when I met someone new.</p>
</div>
</body>
</html>
<html lang="en">
<body>...
<div>
<p>While traveling in Estonia this summer, I often asked,
<span lang="et">"Kas sa räägid inglise keelt?"</span>
when I met someone new.</p>
</div>
</body>
</html>
iFrames
רכיב iFrame
(<iframe>) הוא
משמש לאירוח דף HTML אחר או תוכן של צד שלישי בדף. הוא
למעשה מציבה דף אינטרנט אחר בתוך דף ההורה. iFrames
שמשמש לפרסומות, לסרטונים מוטמעים, לניתוח התנהגות המשתמשים ולמודעות אינטראקטיביות
תוכן.
יש כמה היבטים שצריך להביא בחשבון כדי להפוך את <iframe> לנגיש. קודם כול, כל <iframe> עם תוכן ייחודי צריך לכלול רכיב כותרת בתוך תג ההורה. הכותרת הזו מספקת למשתמשי AT מידע נוסף על התוכן שמופיע ב-<iframe>.
שנית, מומלץ להגדיר את הגלילה למצב אוטומטי או 'כן' בהגדרות התג <iframe>. הפעולה הזו מאפשרת לאנשים עם ליקויי ראייה לגלול לתוכן שבתוך <iframe>, שייתכן שהם לא יוכלו לראות בדרך אחרת. במצב אידיאלי, גם הגובה והרוחב של הקונטיינר <iframe> יהיה גמיש.
<iframe src="https://www.youtube.com/embed/3obixhGZ5ds"></iframe>
<iframe title="Google Pixel - Lizzo in Real Tone" src="https://www.youtube.com/embed/3obixhGZ5ds" scrolling="auto"> </iframe>
בדיקת ההבנה
בוחנים את הידע שלכם לגבי נגישות למסמכים.
האתר שלכם הוא ספר לימוד באינטרנט בכמה שפות, שבו מוצגות כמה שפות בדף אחד. מהי הדרך הטובה ביותר להגדיר לטכנולוגיה המסייעת מהי שפת הטקסט?
<html>. לדוגמה <html lang="en,lt,pl,pt">lang רק שפה אחת.lang ראשי ל<html> ושפות נוספות לכל רכיב שמכיל תוכן בשפה אחרת.<html> כדי לקרוא את המסמך. אם יש לכם טקסט בכמה שפות, חשוב להוסיף את המאפיין lang לאלמנט המתאים (כמו קטע או פסקה) עם קוד ה-ISO הנכון בן שתי האותיות.