💡


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

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

הכללים

כלל 1 – הימנעו מהמילה "קישור" בטקסט הלחיץ

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

כלל 2 – הימנעו מאותיות רישיות (בעיקר באנגלית)

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

כלל 3 – הימנעו מתווי ASCII וסמיילים בטקסט קישור

סמלים כמו ":-)" עלולים להקשות על קוראי מסך. לפי תקן WCAG סעיף 1.1.1 וקריטריון H86, נדרש לספק חלופה טקסטואלית לסמלים אלו. אם אין ברירה – יש להשתמש ב־ARIA או בתגית abbr כדי לספק משמעות.

כלל 4 – הימנעו מכתובת URL כטקסט הקישור

קורא מסך יקריא כל אות וסימן בכתובת, מה שמכביד ומבלבל. עדיף לספק תיאור מילולי ברור כמו "מעבר למדור המחשבים באתר XYZ".

כלל 5 – שמרו על קישור קצר ותמציתי

מומלץ לא לעבור את 100 תווים לקישור. קישור ארוך מדי – למשל פסקה שלמה – פוגע ביכולת של משתמשים לסרוק את הדף או לדלג בין קישורים.

כלל 6 – הגבילו את כמות הקישורים בדף

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

כלל 7 – הודיעו על הורדה

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

כלל 8 – הודיעו על פתיחה בחלון חדש

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

כלל 9 – סדר לינקים לפי הקשר

בקישורים שמסודרים בסדר אלפביתי או עימוד (1, 2, 3...), יש להוסיף טקסט הסבר לפני הרשימה (למשל: "חפש לפי אות"). חשוב לוודא שהקישורים מרווחים ומספיק גדולים ללחיצה – במיוחד במסכים ניידים.

כלל 10 – תפריט תוכן פנימי מחייב הסבר

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

כלל 11 – הבחנה חזותית ברורה בין קישור לטקסט

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

כלל 12 – שימוש זהיר בתמונות כקישורים

כאשר תמונה היא קישור, ה־alt משמש כטקסט הקישור. יש לתאר את הפעולה או המטרה ("שלח טופס", "מצא", "חפש"), ולא את סוג האלמנט ("איקון", "תמונה").

כלל 13 – הימנעו מלינקים שבורים או ריקים

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

כלל 14 – שמרו על עקביות

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

כלל 15 – אל תכפילו מידע

אם אין לכם מידע חדש להוסיף במאפיין title – פשוט אל תשתמשו בו. אין טעם לשמוע פעמיים את אותו הטקסט.

כלל 16 – אין להשתמש בקישורים ריקים

קישור בלי תוכן (טקסט, תמונה עם alt, או הסבר ARIA) הוא לא נגיש. הימנעו לחלוטין מהתנהגות כזו.

כלל 17 – מיקום נכון של קישורים צפים

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

כלל 18 – שימוש במאפיין rel

מאפייני rel ו־rev מגדירים את משמעות הקישור (למשל "prev", "next") ועוזרים למנועים, דפדפנים וטכנולוגיות מסייעות להבין את ההקשר.

כלל 19 – ניגודיות מצב קישורים

וודאו שלכל מצב של קישור (link, visited, hover, focus, active) יש ניגודיות מספקת. זה חיוני הן לראייה והן להתמצאות בממשק.


FAQ



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

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

חובה לציין זאת בטקסט הקישור או ב-title – לדוגמה: “הורד קובץ PDF (ייפתח בחלון חדש)”.

רק אם לתמונה יש alt ברור שמתאר את הפעולה (למשל "חפש" או "שלח טופס"). אחרת – מדובר בקישור לא נגיש.

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

עודכן בתאריך: