היכרות עם ארבע תכונות בינלאומיות חדשות ב-CSS

Jack J
Jack J

ארבע תכונות CSS חדשות בינלאומיות מ-CSS Text Module Level 4 מגיעות ל-Chrome. בפוסט הזה נסביר מה כבר נשלח ומה יגיע בקרוב.

  • מ-Chrome 119: מעבר שורה של ביטוי ביפנית באמצעות word-break: auto-phrase.
  • מאחורי דגל מ-Chrome 120: רווח בין סקריפטים באמצעות המאפיין text-autospace.
  • בשלב הפיתוח: התאמת ריווח בין סימני פיסוק בשפות סינית, יפנית וקוריאנית (CJK) באמצעות המאפיין text-spacing-trim.
  • גודל גופן מינימלי עקבי בכל השפות.

חלוקת שורות של ביטויים ביפנית: word-break: auto-phrase

התכונה הזו משפרת את הקריאוּת של טקסט ביפנית, והיא זמינה מגרסת Chrome 119 ואילך.

בשפות מסוימות במזרח אסיה, כמו סינית או יפנית, לא משתמשים ברווחים כדי להפריד בין מילים, והשורות יכולות להתעגל אחרי כל תו, גם אם הוא באמצע מילה. זוהי ההתנהגות הרגילה של חלוקת שורות בשפות האלה, אבל בטקסט קצר כמו כותרות או שירים, עדיף להפריד בין שורות בגבולות טבעיים של משפטים (ביפנית, הגבול הזה נקרא 'Bunsetsu').

התכונה החדשה של CSS‏ word-break: auto-phrase מציינת שצריך לבצע גלישת טקסט בגבולות כאלה.

<html lang="ja">
<style>
h1 {
  word-break: auto-phrase;
}
</style>

<h1>窓ぎわのトットちゃん<h1>
word-break: auto-phrase מאפשרת למערכת להוסיף שורה חדשה בגבול הטבעי של הביטוי.
word-break: auto-phrase מאפשרת לפסיק את השורה בגבול הביטוי הטבעי.

זיהוי הגבולות מתבצע על ידי מנוע למידת מכונה, ולכן יכול להיות שהתוצאה לא תהיה כפי שציפיתם. במקרה כזה, תוכלו לשנות באופן ידני את נקודות הניתוק. תג <wbr> או רווח ברוחב אפס (&ZeroWidthSpace;) אוכפים נקודת ניתוק, ומקשר ברוחב אפס (&zwj;) מונע ניתוק.

窓ぎわの<wbr>トットちゃん
ユーザー<wbr>インターフェース

בשלב הזה, התכונה הזו נתמכת ב-Chrome רק ביפנית, באמצעות היציאה של BudouX ל-C++‏ שמשתמשת בטכנולוגיית ה-ML של AdaBoost. מידע נוסף זמין במאמר Google Developers Japan: BudouX: 読みやすい改行のための軽量な分かち書き器.

אנחנו מתכננים להוסיף תמיכה בקוריאני ובסינית בגרסאות עתידיות של Chrome.

ריווח בין סקריפטים: text-autospace

התכונה הבאה זמינה כרגע ב-Chrome באמצעות דגל. כדי לבדוק את התכונה, מפעילים את הדגל תכונות ניסיוניות של פלטפורמת אינטרנט (chrome://flags/#enable-experimental-web-platform-features) ב-Chrome מגרסה 120 ואילך.

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

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

ברירת המחדל החדשה כוללת רווחים קטנים כדי לשפר את הקריאוּת. אפשר לשלוט בהם באמצעות text-autospace.
ברירת המחדל החדשה כוללת ריווח קטן יותר לשיפור הקריאוּת, ואפשר לשלוט בו באמצעות text-autospace.

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

text-autospace: no-autospace;

ריווח בין סימני פיסוק בסינית/יפנית/קוריאנית: text-spacing-trim

התכונה הבאה נמצאת בפיתוח, והמטרה היא שהיא תופעל כברירת מחדל ב-Chrome.

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

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

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

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

התנהגות ברירת המחדל מספקת תוצאות טובות באופן כללי, אבל מפתחים יכולים להשתמש במאפיין text-spacing-trim כדי לבחור סגנונות שונים, או להשבית אותו במקרים מסוימים.

גודל גופן מינימלי עקבי בכל השפות

בגרסאות ישנות יותר מ-Chrome 118, גודל גופן קטן מ-10px בערך לא הוצג כפי שצוין, אלא עבר עיגול כלפי מעלה אם השפה הייתה ערבית, פרסית, יפנית, קוריאנית, תאילנדית, סינית פשוטה או סינית מסורתית. המפתחים נאלצו להשתמש בפתרונות חלופיים כדי להציג טקסט קטן, למשל באמצעות המאפיין transform.

מגרסה 118 של Chrome, המגבלה הזו תבוטל לכל השפות, כך ש-7 השפות האלה יהיו זהות לשאר השפות. השינוי הזה משפר את יכולת הפעולה ההדדית עם דפדפנים אחרים.

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

יצירת מעורבות ושיתוף משוב

אם יש לכם משוב על התכונות האלה, תוכלו לדווח על בעיה בכתובת crbug.com.