עדכן את ניגודיות צבע הטקסט

כל אחד אמור להיות מסוגל לקרוא את הטקסט שלך

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

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

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

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

השתמש ב-Ally כדי למצוא טקסט בעל ניגודיות גרועה

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

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

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

אם אתה מתחיל בכרטיסייה סקירה, בחר את הבעיה ולאחר מכן את התחום עם הבעיה.

בעיות של ניגודיות עשויות להתחיל עם 'מסמך' או HTML ברשימה.

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

הצג בתצוגה מקדימה את הטקסט עם הניגודיות הגרועה

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

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

כלי תצוגה מקדימה

השתמש בכלי התצוגה המקדימה כדי לבחון את הבעיות במסמך שלך.

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

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

Ally יוצאת מנקודת הנחה שיש לך ידע בסיסי ב-HTML ובאופן השימוש ב-Content Management System‏ (CMS). כדי לפעול בהתאם לשלבים המונחים, עליך לדעת כיצד לערוך דף אינטרנט ב-HTML או בקוד המקור ב-CMS שלך.

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

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

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

דרכים לפתרון בעיות ניגודיות

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

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

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

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

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

בקר ב- w3schools כדי לקבל מידע נוסף אודות HTML ו-CSS

תבנית HEX או RGB של צבע

HEX ו-RGB הן דרכים שונות שבהן ניתן להגדיר צבע.

• RGB מגדיר צבע לפי כמות האדום (R), ירוק (G) וכחול (B) הנמצאות בשימוש. לדוגמה, גוון של אדום עשוי להיות מוגדר כ-RGB (253, 2, 2)‎.
• HEX היא תבנית הקסדצימאלית המגדירה צבע לפי ערכי האדום, הירוק והכחול בשילוב של 6 אותיות ומספרים. ערכים הקסדצימאליים מתחילים במספר או בסמל ההאשטג (#). לדוגמה, אותו גוון של אדום יוגדר כ-‎#fd0202.

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

שיטות עבודה מומלצות לניגודיות טקסט

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

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

אינך בטוח אם לטקסט שלך יש מספיק ניגודיות?  השתמש ב מנתח ניגודיות הצבעים של The Paciello Group כדי לבדוק את התוכן שלך.

מדוע ניגודיות טקסט חשובה?

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

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

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

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