היכרות עם ארבע תכונות בינלאומיות חדשות ב-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.