Uma das propriedades da tipografia de um site que você pode optar por ajustar durante o desenvolvimento de um site é a justificativa do texto do site. Por padrão, o texto do site é justificado à esquerda e é assim que muitos sites deixam seu texto. As únicas outras opções são justificadas à direita, o que ninguém usa em sites, pois tornaria o texto essencialmente impossível de ler on-line, ou o que é conhecido como totalmente justificado.
O texto justificado é um bloco de texto alinhado nos lados esquerdo e direito, em oposição a apenas um desses lados (que é o que a justificação "esquerda" e "direita" fazem). O efeito duplamente justificado é realizado ajustando os espaços de palavras e letras em cada linha de texto para garantir que cada linha tenha o mesmo tamanho. Este efeito é chamado de justificação completa. Você justifica o texto em CSS usando o alinhamento de texto propriedade.
Como a justificação funciona?
A razão pela qual você costuma ver uma borda irregular no lado direito de um bloco de texto é porque cada linha de texto não tem o mesmo tamanho. Algumas linhas têm mais palavras ou mais palavras, enquanto outras têm menos ou mais palavras. Para justificar esse bloco de texto, espaços extras devem ser adicionados a algumas linhas para uniformizar todas as linhas e torná-las consistentes.
Cada criador de navegadores tem seu próprio algoritmo para aplicar os espaços extras dentro de uma linha. Os navegadores analisam o tamanho da palavra, a hifenização e outros fatores para determinar onde colocar os espaços. Como resultado, o texto justificado pode não parecer idêntico de um navegador para outro. Isso é bom, já que nenhum visitante do site pulará de um navegador para outro apenas para comparar o tamanho das linhas do seu site! Tenha certeza, no entanto, de que o suporte ao navegador principal é bom para justificar o texto com CSS.
Como justificar o texto
Justificar o texto com CSS requer uma seção de texto para justificar. Normalmente, isso é feito em parágrafos de texto, pois grandes blocos de contexto de texto que abrangem várias linhas serão marcados com tags de parágrafo.
Depois de ter um bloco de texto para justificar, é apenas uma questão de configurar o estilo para se justificar com a propriedade de estilo de alinhamento de texto CSS.
alinhamento de texto: justificar;
Você precisaria aplicar essa regra de CSS a um seletor apropriado para obter o bloco de texto para renderizar conforme pretendido.
Quando justificar o texto
Muitas pessoas gostam da aparência de texto justificado do ponto de vista do design, principalmente porque cria uma aparência muito consistente e medida, mas há desvantagens para justificar totalmente o texto em uma página da Web.
Primeiro, o texto justificado pode ser difícil de ler. Isso ocorre porque, quando você justifica o texto, muitas vezes pode ser adicionado muito espaço extra entre algumas palavras na linha. Essas lacunas inconsistentes podem tornar o texto mais difícil de ler. Isso é especialmente importante em páginas da Web, que podem ser difíceis de ler devido à iluminação, resolução ou outra qualidade de hardware. Adicionar espaços incomuns ao texto pode piorar ainda mais a situação.
Além dos problemas de legibilidade, os espaços em branco às vezes se alinham para criar "rios" de espaço em branco no meio do texto. Essas grandes lacunas de espaço em branco podem realmente fazer uma exibição estranha. Além disso, em linhas extremamente curtas, a justificação pode causar linhas que contenham uma palavra com espaços extras entre as próprias letras.
Então, quando você deve usar a justificativa do texto? O melhor momento para justificar o texto ocorre quando as linhas são longas e o tamanho da fonte é pequeno (algo que é difícil garantir em sites responsivos, onde o tamanho das linhas muda de acordo com o tamanho da tela). Não há nenhum número difícil e rápido para o comprimento da linha ou o tamanho do texto, você deve usar o seu melhor julgamento.
Depois de aplicar o estilo de alinhamento de texto para justificar o texto, teste-o para garantir que o texto não tenha rios de espaço em branco - e certifique-se de testá-lo em vários tamanhos. A maneira mais fácil de fazer isso é visualizá-lo com os olhos apertados. Os rios se destacam como manchas de branco em um bloco de texto de outra forma cinza. Se você vir rios, você deve fazer alterações no tamanho do texto ou na largura do bloco de texto para se livrar desses rios feios.
Use apenas a justificação depois de compará-la com o texto alinhado à esquerda, conforme visto neste artigo. Você faz como a consistência da justificação completa, mas o texto justificado à esquerda padrão é geralmente mais legível. No final, você deve justificar o texto porque escolheu justificar o texto para fins de design e confirmou que o site continua sendo de fácil leitura.
