דף זה תורגם על ידי Cloud Translation API.

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

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

Rachel Andrew

גרסאות יציבות של דפדפנים

באוקטובר, Firefox 106, Chrome 107 ו-Safari 16.1 הפכו ליציבים. בואו נראה מה המשמעות של זה לפלטפורמת האינטרנט.

אנימציה של טראקים ברשת

תודה לתרומתם של האנשים שלנו ב-Microsoft, מעכשיו אפשר לבצע אינטרפולציה של הערכים grid-template-columns ו-grid-template-rows ב-Chrome. המשמעות היא שפריסות של רשתות יכולות לעבור בצורה חלקה בין מצבים, במקום להצמיד את התמונות בנקודת הביניים של אנימציה או מעבר.

מעבירים את העכבר מעל התמונות כדי לראות את האנימציה. הדוגמה הזו מופיעה במאמר פריסות רשת מונפשות ב-CSS, שבו אפשר למצוא מידע נוסף.

תמיכה בדפדפנים

תוספות אל `getDisplayMedia()`

בנוסף, ב-Chrome יש כמה תוספות ל-getDisplayMedia() שנועדו למנוע שיתוף מידע מיותר בטעות כשמשתפים מסך.

האפשרות displaySurface יכולה לציין שאפליקציית האינטרנט מעדיפה להציע סוג מסוים של משטח תצוגה (כרטיסיות, חלונות או מסכים).
האפשרות surfaceSwitching קובעת אם Chrome יאפשר למשתמש לעבור באופן דינמי בין כרטיסיות משותפות.
אפשר להשתמש באפשרות selfBrowserSurface כדי למנוע מהמשתמש לשתף את הכרטיסייה הנוכחית. כך אפשר למנוע את אפקט 'אולם המראות'.
האפשרות systemAudio מבטיחה ש-Chrome יציע למשתמש רק הקלטת אודיו רלוונטית.

ב-Safari 16.1 יש גם תמיכה ב-getDisplayMedia, שמוסיפה תמיכה בצילומי חלון ספציפי ב-Safari.

בדיקה של תמיכה בטכנולוגיות ובתכונות של גופנים מ-CSS

ב-Firefox נוספו הפונקציות font-tech() ו-font-format() כדי להציג שאילתות עם @supports. בדוגמאות הבאות מתבצעת בדיקה של תמיכה בגופני COLRv1.

@supports font-tech(color-COLRv1) {

}

דוגמאות נוספות זמינות ב-MDN.

גלילה למקטע טקסט

ב-Safari 16.1 יש תמיכה בגלילה לקטע טקסט, שמוסיפה תמיכה בניווט לכתובת URL עם קטע טקסט מסוים שצוין.

תמיכה ב-AVIF

ב-Safari 16 הייתה תמיכה בתמונות AVIF סטטיות, וב-Safari 16.1 יש תמיכה בתמונות AVIF מונפשות ב-macOS Ventura, ב-iOS 16 וב-iPadOS 16.

התראות Push מהאינטרנט ל-Safari

ב-Safari 16.1 יש תמיכה ב-Web Push ב-Safari ב-macOS Ventura. לשם כך נעשה שימוש ב-Push API וב-Notifications API. מידע נוסף זמין במאמר מידע על Web Push. העובדה ש-Web Push זמין עכשיו ב-Safari מאפשרת לכם להשתמש בו בכל שלושת המנועים העיקריים.

גרסאות בטא של דפדפנים

גרסאות בטא של דפדפנים נותנות לכם תצוגה מקדימה של תכונות שייכללו בגרסה היציבה הבאה של הדפדפן. זו הזדמנות מצוינת לבדוק תכונות חדשות או הסרות שעשויות להשפיע על האתר שלכם, לפני שהן יושקו לכולם. גרסאות הבטא החדשות שפורסמו החודש הן Chrome 108,‏ Firefox 107 ו-Safari 16.2.

ב-Chrome 108 יש תמיכה בערך avoid של מאפייני הפיצול של CSS‏ break-before,‏ break-after ו-break-inside בזמן ההדפסה. הערך הזה מנחה את הדפדפן למנוע תקלות לפני, אחרי או בתוך הרכיב שעליו הוא חל. לדוגמה, שירות ה-CSS הבא מונע מספר שבור שמופיע במעבר דף.

figure {
    break-inside: avoid;
}

בגרסה 108 של Chrome מתחילה ההשקה של שינוי בהתנהגות של Overflow ברכיבים שהוחלפו, שעלול לגרום לשינויים חזותיים בנסיבות מסוימות. במאמר שינוי ב-overflow על רכיבים שהוחלפו ב-CSS מוסבר בהרחבה איך לטפל בבעיות שעשויות להופיע.

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

ב-Chrome יש גם את יחידות תצוגת המסך החדשות של CSS. אלה כוללות יחידות קטנות (svw, svh, svi, svb, svmin, svmax), יחידות גדולות (lvw, lvh, lvi, lvb, lvmin, lvmax), יחידות דינמיות (dvw, dvh, dvi, dvb, dvmin, dvmax) ויחידות לוגיות (vi, vb). היחידות האלה כבר מוטמעות ב-Firefox וב-Safari.

בגרסה 107 של Firefox יש תמיכה בגופנים מסוג COLRv1, והיא מצטרפת ל-Chrome בתמיכה בטכנולוגיית הגופנים הזו. בנוסף, בגופנים, ב-Chrome 108 נוספה תמיכה בפונקציות font-tech() ו-font-format() כדי להציג שאילתות עם @supports.

ב-Firefox נוספה גם תמיכה ב-contain-intrinsic-size, כך ש-Chrome ו-Firefox הם עכשיו שני הדפדפנים עם תמיכה בתכונה הזו.

גרסה 16.2 בטא של Safari כוללת כמה תיקונים ל-CSS, כולל שינוי גודל ונעילה בזמן גלילה.

חלק מהסדרה חדשות באינטרנט