בלוג

אנימציות גלילה: animation-timeline במקום IntersectionObserver

יש סיבה שפרלקס JavaScript תמיד נראה קצת לא נכון — קצת מנותק, כאילו השכבות שוחות חצי פריים מאחורי הדף. זה לא קוד רשלני. זה בגלל שאירועי גלילה מגיעים ל-JavaScript אחרי שהדפדפן כבר ציייר את הגלילה. הדפדפן פתר את זה פעם אחת, כשהפך כותרות דביקות ל-position: sticky. Scroll-driven animations הוא אותה המהלך, מיושם על כל האפקטים הקשורים לגלילה בבת אחת.

Popover API ו-dialog הטבעי: הסוף למודלים שבונים ידנית מאפס

במאמר על נגישות היה מודל עם display:none שבכל זאת המשיך להתקיים בעץ הנגישות – דוגמה לשגיאה שנובעת מבניית מודל מאפס על divים. השאלה האמיתית היא: למה בכלל היה צריך לבנות אותו מאפס? בודק מה מקבלים בחינם מ-<dialog> הטבעי ומהתכונה popover – top layer, מלכודת פוקוס, light dismiss – ואיפה שני המנגנונים האלה שונים מספיק כדי שבלבול ביניהם יוביל ישר לממשק לא נגיש.

יצירת רכיבים נגישים לקוראי מסך

HTML תקין הוא רק נקודת ההתחלה. גלו איך עץ הנגישות עובד בפועל, מדוע ARIA לעיתים קרובות עושה יותר נזק מתועלת ממה שנדמה, ובנו איתי אקורדיון אמיתי, אזור חי (live region) וניהול פוקוס ב-Next.js.