domingo, 4 de dezembro de 2011

A hifenização automática

Um hífen é um sinal de pontuação que serve para cortar as palavras no fim das linhas (também pode-se chamar uma translineação neste caso). Assim, o texto fica alinhado no seu espaço alocado (ou justificado quando estar alinhado a direita e a esquerda no mesmo tempo).
Até agora, podia-se fazer de duas maneiras: ou colocando um hífen condicional (que diz ao navegador onde poder cortar as palavras inserindo o caractere especial ­, para soft hyphen), ou usando um script javascript para posicionar os hífens do lado do cliente. Uma terceira via é agora possível: a folha de estilo CSS3.

Os hífens automáticos em CSS3


Ao adicionar essas três linhas na sua folha de estilo, vai ajudar o seu texto justificado a ser lindamente mostrado sem esses espaços vazios sem graça no meio das linhas.
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
Os três valores possiveis são: none, manual e auto.

Também deve dizer ao navegador a língua que usa se quiser que aplicar as regras boas de hifenização. Por exemplo, o português, o inglês e o francês não utilizam as mesmas regras. Para fazer isso, deve usar o atributo HTML lang ou o atributo XML xml:lang.

Firefox suporta atualmente as línguas seguintes (de acordo com a sua versão): afrikaans (af), alemão (ortografia tradicional, de-1901 e ortografia reformada, de-1996), alto sorábio (hsb), búlgaro (bg), catalão (ca), curmânji (kmr), dinamarquês (da), esloveno (sl), espanhol (es), estónio (et), finlandês (fi), francês (fr), galego (gl), galês (cy), húngaro (hu), inglês (americano, en-US), islandês (is), italiano (it), latim (la), lituano (lt), mongol (mn), neerlandês (nl), norueguês bokmål (nb), norueguês nynorsk (nn), português (pt), russo (ru), servo-croata (sh), sueco (sv), suíço-alemão (ortografia tradicional, de-CH), turco (tr) e ucraniano (uk). 
Duas línguas artificiais são também suportadas: o esperanto (eo) e a interlíngua (ia).
Talvez nós virmos em breve o sindarin (sjn), o quenya (qya) ou o klingon (tlh) estarem suportados (Alguém já estabeleceu as regras de hifenização do klingon?).

Internet Explorer 10 suporta as línguas seguintes: catalão (ca), dinamarquês (da), espanhol (es), francês (fr), inglês (en, en-US), italiano (it), neerlandês (nl), norueguês bokmål (nb), norueguês nynorsk (nn), polaco, português (pt), português do Brasil, russo (ru), sueco (sv), tcheco (cs) e turco (tr).

A hifenização em javascript


Hyphenator é uma biblioteca javascript que trabalha do lado do cliente. O seu uso básico é tão simples como fazer um link para o script, dar valores aos seus parâmetros e chamá-lo com o texto para processar. Aqui está um exemplo com alguns parâmetros, como useCSS3hyphenation que passa a mão à CSS3 quando ser suportada para fazer a hifenização, safecopy que permite o copiar e colar do texto processado sem os hífens condicionais, e hyphenchar que permite escolher o caractere separador (o hífen condicional codificado em HTML por padrão).
Hyphenator.config({
    minwordlength:2,
    remoteloading: false,
    useCSS3hyphenation: true,
    safecopy:true
});
Hyphenator.hyphenate('Por favor, dê-me h&iactue;fens automáticos (embora anticonstitucionalissimamente)!', 'pt');
Há outras maneiras de utilizar o Hyphenator, tais como bookmarklet (ou favlet), ou para aplicar a hifenização automática à diferentes línguas na mesma página.

No momento em que escrevo estas linhas, a versão 4.0.0 desta biblioteca já suporta as línguas seguintes: alemão, arménio, bielorrusso, bengali, catalão, dinamarquês, eslovaco, esloveno, espanhol, finlandês, francês, grego (monotonal, politonal e clássico), gujarati, hindi, húngaro, inglês (US e GB), italiano, kannada, latim, letão, lituano, malayalam, neerlandês, norueguês, oriya, panjabi, polaco, português, russo, sueco, tamil, tcheco, telugu, turco e ucraniano.

A hifenização automática do lado do servidor


Os mesmos algoritmos de hifenização automática podem aplicar-se do lado do servidor para pôr tantos hífens condicionais quanto possível nas palavras em HTML. Porém, como a apresentação passa do lado do navegador, será melhor deixá-lo cuidar desta tarefa (além disso, podemos assim evitar o efeito colateral do copiar e colar onde todos os hífens condicionais são recuperados no texto copiado).

Conclusão


Com essas três formas diferentes de gerir a hifenização automática, não tem mais desculpa para mostrar textos que não se comportam de uma maneira tipograficamente apropriada, mesmo num espaço reduzido. O método que eu prefiro é, sem dúvida, o da biblioteca javascript Hyphenator, uma vez que segue o princípio de degradação suave usando CSS3 sempre que possível.


Hyphenation on the web (em inglês)
Les césures automatiques (em francês)
Los guiones de corte automático (em espanhol)

2 comentários: