ואולי Icon Fonts לא היו רעיון כזה טוב

22/08/2023

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

היום כבר אפשר להשתמש ב SVG כדי להשיג בדיוק את אותו אפקט, אבל האקים שנוצרו ב 2012 לא מתים בקלות.

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

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

<span class="fa-solid fa-envelope" aria-hidden="true" />

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