Dusinka
24 באוקטובר, 2020, 5:52pm
#1
קיבלתי הערות על האתר הסטטי ויש שתיים שאני לא בטוח מה לעשות לגביהן:
מחסור בlabels עבור אנשים עם מוגבלויות:
הכוונה במחסור בlabels ממש לשימוש באלמנט label? בשביל screen readers למיניהם אני מניח?
בשורה מתחת הערה על השימוש בh4 כאשר אין h3 או h2 ושעדיף להשתמש בdiv אם זה רק כדי לשנות גודל.
נראה היה לי נכון להשתמש באלמנט h כלשהו אם זה משמש כותרת ולא בdiv, מה הפתרון הנכון?
תודה
Yam
24 באוקטובר, 2020, 6:19pm
#2
יאפ
אם זו הכותרת הראשית – h1 ולהתאים גודל באמצעות CSS.
במקרה הזה לדעתי זה לא מתאים להיות כותרת (מבחינה סמנטית) – הייתי שם כ־div/span עם עיצוב נאה.
Dusinka
24 באוקטובר, 2020, 6:21pm
#3
תודה! אני מקווה שאצליח להכניס את הlabel בלי להרוס את העיצוב
Dusinka
24 באוקטובר, 2020, 11:48pm
#4
מצאתי משהו באינטרנט במהלך חיפוש על איך להנגיש תוכן לקוראי מסך ועדיין לא להציג אותו פיזית על העמוד:
החלטתי להשתמש באופציה של הוספת aria-label לinput, היה נראה לי יותר אלגנטי מלזרוק איזה לייבל 10000 פיקסלים מהמסך (האופציה האחרת שם).
תודה!
Yam
25 באוקטובר, 2020, 12:02am
#5
אופציה אחרת טיפה יותר מקובלת – bootstrap עושים את זה עם class שנקרא visually-hidden שמוגדר כך:
.visually-hidden, .visually-hidden-focusable:not(:focus) {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0,0,0,0) !important;
white-space: nowrap !important;
border: 0 !important;
}
2 לייקים