Memperkenalkan empat fitur internasional baru di CSS

Jack J
Jack J

Empat fitur CSS internasional baru dari Modul Teks CSS Level 4 akan hadir di Chrome. Postingan ini menjelaskan apa yang telah dikirim, dan apa yang akan segera datang.

  • Mulai Chrome 119: Jeda baris frasa bahasa Jepang dengan word-break: auto-phrase.
  • Di belakang tanda dari Chrome 120: Spasi antar-skrip dengan properti text-autospace.
  • Dalam pengembangan: Kerning tanda baca dalam bahasa China, Jepang, dan Korea (CJK) dengan properti text-spacing-trim.
  • Ukuran font minimum yang konsisten di seluruh bahasa.

Jeda baris frasa Jepang: word-break: auto-phrase

Fitur ini meningkatkan keterbacaan teks bahasa Jepang, dan tersedia mulai Chrome 119

Beberapa bahasa Asia Timur seperti China atau Jepang tidak menggunakan spasi untuk memisahkan kata, dan baris dapat menggabungkan karakter apa pun, meskipun berada di tengah kata. Ini merupakan perilaku yang merupakan pemutusan baris yang normal untuk bahasa-bahasa ini, tetapi dalam teks singkat seperti judul atau puisi, lebih disarankan untuk menggabungkan garis pada batas frase yang alami (Dalam bahasa Jepang, batasan ini disebut "Bunsetsu").

Fitur CSS baru word-break: auto-phrase menentukan bahwa penggabungan harus terjadi pada batas tersebut.

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

<h1>窓ぎわのトットちゃん<h1>
pemutusan kata: frasa otomatis menggabungkan baris pada batas frasa alami.
word-break: auto-phrase menggabungkan baris pada batas frasa alami.

Deteksi batas dilakukan oleh mesin machine learning sehingga mungkin tidak menghasilkan apa yang Anda inginkan. Jika hal itu terjadi, Anda dapat menyesuaikan titik kerusakan secara manual. Tag <wbr> atau Zero Width Space (&ZeroWidthSpace;) menerapkan titik pecah, dan Penggabungan Lebar Nol (&zwj;) mencegah jeda.

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

Saat ini, Chrome hanya mendukung fitur ini untuk bahasa Jepang, menggunakan port BudouX C++ yang menggunakan teknologi AdaBoost ML. Baca selengkapnya di Google Developers Jepang: BudouX: 読 restoranやすん改行のための軽量地shaderち書bias號.

Kami berencana untuk mendukung bahasa Korea dan China di Chrome versi mendatang.

Spasi antar-skrip: text-autospace

Fitur berikut saat ini berada di belakang tanda di Chrome. Untuk mengujinya, aktifkan tanda Fitur Platform Web Eksperimental (terdapat di chrome://flags/#enable-experimental-web-platform-features) di Chrome 120 atau yang lebih baru.

Bahasa China dan Jepang menggabungkan beberapa huruf, Han, Latin, dan ASCII serta huruf Hiragana dan Katakana dalam huruf Jepang. Spasi kecil saat beralih dari dan ke skrip ideografi non-Han sering kali membantu meningkatkan keterbacaan.

Chrome berencana untuk mulai menyisipkan spasi antar-skrip secara default. Fitur ini menghadirkan praktik umum, yang banyak digunakan dalam materi cetak untuk meningkatkan keterbacaan, ke web.

Default baru menerapkan spasi kecil untuk keterbacaan yang lebih baik yang dapat dikontrol dengan spasi otomatis teks.
Default baru menerapkan spasi kecil untuk keterbacaan yang lebih baik yang dapat dikontrol dengan text-autospace.

Jika ingin menonaktifkan perilaku ini, properti text-autospace memungkinkan Anda mengontrol penyisipan spasi.

text-autospace: no-autospace;

Kerning tanda baca CJK: text-spacing-trim

Fitur berikut sedang dalam pengembangan, dan akan diaktifkan secara default di Chrome.

Dalam bahasa China, Jepang, dan Korea, penerapan kerning di antara karakter tanda baca akan meningkatkan keterbacaan dan menghasilkan tipografi yang lebih menarik secara visual. Saat ini, sebagian besar materi cetak dan pengolah kata menerapkan kerning ini.

Misalnya, periode CJK dan tanda kurung tutup CJK biasanya dirancang untuk memiliki spasi internal glyph di paruh kanan ruang glyph, sehingga setiap karakter memiliki kemajuan yang konstan.

Namun, saat karakter tanda baca ini muncul dalam baris, spasi internal glyph ini menjadi berlebihan. Dalam dua contoh berikut, yang kedua adalah tipografi yang benar; separuh kanan periode CJK harus dihapus.

Jika karakter tanda baca muncul berturut-turut, bagian kanan titik CJK harus dihapus.
Jika karakter tanda baca muncul berturut-turut, bagian kanan periode CJK harus dihapus.

Perilaku default ini secara umum memberikan hasil yang baik, tetapi developer dapat menggunakan properti text-spacing-trim untuk memilih gaya yang berbeda, atau untuk menonaktifkannya dalam beberapa kasus.

Ukuran font minimum yang konsisten di seluruh bahasa

Sebelum Chrome 118, ukuran font yang lebih kecil dari 10 px atau lebih tidak dirender seperti yang ditentukan, tetapi dibulatkan jika bahasanya adalah bahasa Arab, Persia, Jepang, Korea, Thai, China Aksara Sederhana, atau Aksara Tradisional. Developer memerlukan solusi untuk merender teks kecil, misalnya dengan menggunakan properti transform.

Mulai Chrome 118, batas ini akan dicabut untuk semua bahasa sehingga tujuh bahasa lainnya akan cocok. Perubahan ini meningkatkan interoperabilitas dengan browser lain.

Mulai Chrome 118, batasan dengan ukuran font yang lebih kecil dari 10 piksel atau lebih yang tidak dirender seperti yang ditentukan akan dicabut untuk bahasa Arab, Persia, Jepang, Korea, Thai, China Aksara Sederhana, atau Aksara Tradisional.
Mulai Chrome 118, batasan dengan ukuran font yang lebih kecil dari 10 piksel atau lebih yang tidak dirender seperti yang ditentukan akan dicabut untuk bahasa Arab, Persia, Jepang, Korea, Thai, China Aksara Sederhana, atau Tradisional.

Berinteraksi dan memberikan masukan

Jika Anda memiliki masukan tentang fitur ini, laporkan masalah di crbug.com.