תמוז

הבדלה בין ירוק לאדום, עיצוב לדיסלקטים, ועוד קישורי נגישות

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

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

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

הסבר מעמיק על דילוג לתוכן – מאמר ב-css-tricks שנכנס לעומק העניין. כרגיל, מעמיק ומעניין.

עיצוב נגיש לכתחילה – המאמר מדבר על חשיבות הנגישות בעיצוב לממשקים דיגיטליים. והוא מדגיש את הצורך לשקול מגבלות שונות כמו הגבלות חזותיות, שמיעה או תנועה, מאחר והרבה משתמשים זקוקים להתאמות אלה. המאמר מציין כי יש לשלב נגישות בעיצוב, במקום ליצור עיצובים חלופיים. הוא מספק עצות מעשיות להנגשת צבעים בתוך המוקאפ, כולל שיפור טקסט, יחס ניגודיות, התייחסות לעיוורון צבעים, סקאלת גופנים של המערכת, תמיכה בערכת צבעים אפלה (dark theme), תאימות לקוראי מסך, רגישות לתנועה, גודל אזור לחיצה עבור קישורים ורוחב מינימלי לכפתורים. המאמר מציין את חשיבות אי ההתערבות בעיצוב הדיפולטי של “פוקוס”.

מדריך לעיצוב מסמני פוקוס – שרה סוהדיאן מביאה חאת אחד הפרקים בקורס שלה על נגישות, והוא עוסק במסמן פוקוס (focus indicator). הפוסט מתחיל בתיאור מהו בעצם מסמן פוקוס, עובר על סגנונות פוקוס כברירת מחדל בדפדפן ודרישות נגישות חדשות של מסמן פוקוס ב-WCAG 2.2. אחר כך היא נכנסת לנושאים כמו אזור מסמן הפוקוס והאזור המנוגד, שטח ניגודי מינימלי, ניגוד לצבעים סמוכים ברכיב. ושאסור לטשטש לגמרי את האלמנט הממוקד. בהמשך הפוסט סוהדיאן בוחנת את מידת הנגישות של מסמני פוקוס במערכות עיצוב פופולריות וספריות UI Patterns; מלמדת איך מציגים את מסמני הפוקוס רק למשתמשי מקלדת, ונותנת טיפים לעיצוב מסמני פוקוס. בסוף יש רשימה של משאבים, הפניות וקריאה נוספת.

עוד מדריך, עןד דוגמה, על מה לכתוב בטקסט אלטרנטיבי של תמונה – אתר webaim בפוסט מפורט על סוגים שונים של תמונות והטקסט האלטרנטיבי המתאים לפי ההקשר: תמונות פונקציונליות, תמונות דקורטיביות, תמונות מתקדמות, כפתורי תמונה, מפות תמונה, תמונות CSS, לוגואים, תמונות מורכבות, ו-Figure ו-figcaption.

לדבג כפתורי HTML מבחינת נגישות – הפוסט, מהאתר htmhell, מתאר את ארבעת המרכיבים שנגישות כפתורים מצריכה: תוית (Label), סמנטיקה, פוקוס ו-Events. אחרי זה הפוסט בוחן את ה-Dev Tools גם של כרום וגם של פיירפוקס ומראה איך המרכיבים הללו מוצגים בהם.

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

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

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

כתבו תגובה

כתובת הדוא"ל שלכם לא תוצג.