Apresentamos quatro novos recursos internacionais no CSS

Jack J
Jack J

Quatro novos recursos internacionais do CSS do Módulo de texto do CSS nível 4 estão chegando ao Chrome. Esta postagem explica o que já foi enviado e o que será enviado em breve.

  • No Chrome 119: quebra de linha de frase japonesa com word-break: auto-phrase.
  • Por trás de uma flag do Chrome 120: espaçamento entre scripts com a propriedade text-autospace.
  • Em desenvolvimento: ajuste de kerning de pontuação em chinês, japonês e coreano (CJK) com a propriedade text-spacing-trim.
  • tamanho mínimo e consistente de fonte em todos os idiomas.

Quebra de linha de frase japonesa: word-break: auto-phrase

Esse recurso melhora a legibilidade do texto em japonês e está disponível no Chrome 119.

Alguns idiomas do leste asiático, como o chinês ou o japonês, não usam espaços para separar palavras, e as linhas podem ser quebradas em qualquer caractere, mesmo que esteja no meio de uma palavra. Esse é o comportamento normal de quebra de linha para esses idiomas, mas em textos curtos, como títulos ou poemas, é preferível ajustar as linhas nos limites naturais das frases. Em japonês, esse limite é chamado de "Bunsetsu".

O novo recurso CSS word-break: auto-phrase especifica que o ajuste precisa ocorrer nesses limites.

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

<h1>窓ぎわのトットちゃん<h1>
word-break: a frase automática envolve a linha no limite da frase natural.
word-break: auto-phrase envolve a linha no limite da frase natural.

A detecção de limites é realizada por um mecanismo de machine learning e, portanto, pode não resultar no resultado pretendido. Se isso acontecer, você poderá ajustar manualmente os pontos de quebra. Uma tag <wbr> ou espaço de largura zero (&ZeroWidthSpace;) impõe um ponto de quebra, e o combinador de largura zero (&zwj;) impede uma quebra.

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

No momento, o Chrome oferece suporte a esse recurso apenas para o japonês, usando a porta BudouX C++ que usa a tecnologia de ML AdaBoost. Leia mais sobre isso no Google Developers do Japão: BudouX: 読まやす plana改っののめの軽量ちち書籍器.

Planejamos oferecer compatibilidade com coreano e chinês em futuras versões do Chrome.

Espaçamento entre scripts: text-autospace

No momento, o recurso a seguir está atrás de uma sinalização no Chrome. Para testar, ative a sinalização de recursos experimentais da plataforma da Web (encontrada em chrome://flags/#enable-experimental-web-platform-features) no Chrome 120 ou mais recente.

O chinês e o japonês misturam vários scripts, dígitos han, latinos e ASCII, além de hiragana e katakana no caso do japonês. Espaços pequenos ao alternar entre scripts ideográficos não-Han geralmente ajudam na legibilidade.

O Chrome planeja começar a inserir espaçamento entre scripts por padrão. Esse recurso traz para a Web uma prática comum, amplamente usada em materiais impressos para melhorar a legibilidade.

O novo padrão aplica espaçamentos pequenos para uma melhor legibilidade, que pode ser controlada com o espaço automático de texto.
O novo padrão aplica espaços pequenos para melhorar a legibilidade, que podem ser controlados com text-autospace.

Se você quiser desativar esse comportamento, use a propriedade text-autospace para controlar a inserção dos espaçamentos.

text-autospace: no-autospace;

kerning de pontuação do CJK: text-spacing-trim

O recurso a seguir está em desenvolvimento e será ativado por padrão no Chrome.

Em chinês, japonês e coreano, a aplicação de espaçamento entre caracteres de pontuação melhora a legibilidade e produz uma tipografia mais agradável. Atualmente, a maioria dos materiais impressos e processadores de texto aplica esse kerning.

Por exemplo, os pontos e parênteses de fechamento do CJK geralmente são projetados para ter espaçamentos internos de glifos na metade direita dos espaços de glifos, para que cada caractere tenha um avanço constante.

No entanto, quando esses caracteres aparecem em uma linha, o espaçamento interno do glifo se torna excessivo. Nos dois exemplos a seguir, o segundo é a tipografia correta. A metade direita do período CJK precisa ser removida.

Quando os caracteres de pontuação aparecem em uma linha, a metade direita do ponto CJK precisa ser removida.
Quando os caracteres de pontuação aparecem em uma linha, a metade direita do ponto CJK precisa ser removida.

O comportamento padrão gera bons resultados em geral, mas os desenvolvedores podem usar a propriedade text-spacing-trim para escolher estilos diferentes ou desativá-la em alguns casos.

Tamanho mínimo da fonte consistente em todos os idiomas

Antes do Chrome 118, os tamanhos de fonte menores que 10 px não eram renderizados como especificados, mas arredondados para cima se o idioma fosse árabe, farsi, japonês, coreano, tailandês, chinês simplificado ou tradicional. Os desenvolvedores precisavam de soluções alternativas para renderizar textos pequenos, por exemplo, usando a propriedade transform.

A partir do Chrome 118, esse limite foi removido para todos os idiomas, fazendo com que os sete idiomas correspondam aos demais. Essa mudança melhora a interoperabilidade com outros navegadores.

A partir do Chrome 118, a limitação de tamanhos de fonte menores que 10 px ou menos não é renderizada conforme especificado para árabe, farsi, japonês, coreano, tailandês, chinês simplificado ou tradicional.
A partir do Chrome 118, a limitação de que tamanhos de fonte menores que 10 px ou mais não são renderizados conforme especificado foi removida para chinês simplificado, chinês tradicional, árabe, farsi, japonês, coreano, tailandês e simplificado.

Engajamento e compartilhamento de feedback

Se você tiver algum feedback sobre esses recursos, registre um problema em crbug.com.