סיכום חודשי של נתוני הבסיס להשוואה: אפריל 2026

Jeremy Wagner

פורסם: 27 במאי 2026

ברוכים הבאים לסיכום החודשי של Baseline. באפריל 2026, חלק מהיכולות של CSS וכלי מתמטיקה מדויקים הפכו לזמינים, ואילו רכיבים סמנטיים מבניים ותוספות אחרות ל-Web API הפכו לזמינים באופן נרחב, לצד אירועים בקהילת המפתחים.

בסיס להשוואה ונגישות בשנת 2026

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

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

תכונות חדשות שזמינות ב-Baseline

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

הפונקציה contrast-color() של CSS

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

.card-header {
  background-color: var(--dynamic-bg-color);
  /* Automatically resolves to the highest-contrast text color */
  color: contrast-color(var(--dynamic-bg-color));
}

כך תוכלו לעמוד בתקני הנגישות לקריאות, בלי פתרון מותאם אישית או CSS שקשה לתחזק. עדיין כדאי לשים לב לבחירות שלכם לגבי צבעים בגוון ביניים, אבל הפונקציה הזו מצמצמת את קוד ה-CSS הסטנדרטי שנדרש כדי להתאים את האתר למשתמשים. מידע נוסף זמין בדף העזר של MDN בנושא contrast-color().

Math.sumPrecise()

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

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

תכונות Baseline שזמינות במקומות רבים

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

רכיב <search>

רכיב ה-HTML‏ <search> משמש כרכיב wrapper מפורש לפקדי טופס, למנגנוני סינון ולכלי שירות לשליחה, שביחד מייצגים חוויית חיפוש באפליקציית אינטרנט.

<search>
  <form action="/site-search">
    <label for="query">Search documentation</label>
    <input type="search" id="query" name="q">
    <button>Go</button>
  </form>
</search>

החלפת רכיב מכיל בתג <search> מספקת יתרון נגישות למשתמשים. הדפדפן מקצה באופן אוטומטי לרכיב תפקיד ARIA מרומז של ציון דרך search, כך שאין צורך לציין role="search" ברכיב <form>. כך קוראי המסך יכולים לזהות את ממשקי החיפוש ולעזור למשתמשים לנווט אליהם. אפשר לקרוא את פרטי ההטמעה בדף MDN של רכיב <search>.

גישה למפתח ציבורי לאימות באינטרנט

המעבר לשימוש ב-API לאימות אינטרנט (WebAuthn) ללא סיסמה הוא עכשיו פשוט יותר, הודות לתמיכה רחבה בכלי חילוץ ישירים של מאפיינים בממשק AuthenticatorAttestationResponse. בעזרת שיטות כמו getPublicKey() ו-getPublicKeyAlgorithm(), הדפדפן מחלץ בשבילכם את הפרטים של המפתח הציבורי בלי שתצטרכו לעבוד עם נתונים בינאריים גולמיים. מידע נוסף על המאפיינים האלה ועל אופן השימוש בהם זמין בדף של MDN בנושא AuthenticatorAttestationResponse.

String.prototype.isWellFormed() וגם String.prototype.toWellFormed()

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

הפונקציה isWellFormed() מאפשרת למפתחים לבדוק אם מחרוזת מכילה זוגות סורוגטים בודדים, ומחזירה ערך בוליאני. אם מחרוזת לא עוברת את האימות, אפשר להפעיל את הפונקציה toWellFormed() כדי להחליף את התווים הלא תקינים בתו ההחלפה הרגיל של Unicode‏ (U+FFFD). זה שימושי לפני הפעלת פונקציות כמו encodeURI(), שיוצרות שגיאה מסוג URIError כשנתקלים בקלט לא תקין. בתיעוד של MDN בנושא String.prototype.isWellFormed() מוסבר איך השיטות האלה פועלות.

שיקוף מאפייני ARIA

כדי לעדכן את מצבי הנגישות ברכיבים אינטראקטיביים, נדרשות פעולות הלוך ושוב באמצעות שיטות סטנדרטיות של מאפייני DOM – למשל, element.setAttribute('aria-expanded', 'true'). ההשתקפות של מאפייני ARIA מפשטת את התהליך הזה על ידי שיקוף של מאפייני נגישות כמאפייני אובייקט.

ממשק Element משקף מאפייני ARIA ישירות למאפייני מופע כמו element.ariaExpanded, element.ariaChecked ו-element.ariaHidden. כך אפשר לשנות את מצבי הנגישות באמצעות תחביר של נקודות:

// Clean and readable state updates
toggleButton.ariaExpanded = toggleButton.ariaExpanded === "true" ? "false" : "true";

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

זה הכול להפעם

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