Como configurar texto xustificado con CSS

Usando a propiedade de Alinear texto CSS para xustificar o texto

Unha das propiedades da tipografía dun sitio web que pode optar por axustar durante o desenvolvemento dun sitio é como se xustifica o texto do sitio. De xeito predeterminado, o texto do sitio web queda xustificado e así é como moitos sitios deixan o seu texto. As únicas outras opcións están xustificadas de maneira xusta, que ninguén usa nos sitios web porque faría que o texto sexa imposible de ler en liña, ou o que se coñece como totalmente xustificado.

O texto xustificado é un bloque de texto que se aliña nos dous lados esquerdo e dereito, en oposición a só un deses lados (que é o que fan a xustificación "esquerda" e "dereita"). O efecto dobremente xustificado realízase axustando os espazos de letras e letras en cada liña de texto para garantir que cada liña ten a mesma lonxitude. Este efecto chámase xustificación completa . Xustifica o texto en CSS empregando a propiedade de aliñamento de texto .

Como funciona a xustificación?

A razón pola que adoita ver un borde desigual no lado dereito dun bloque de texto é porque cada liña de texto non ten o mesmo tamaño. Algunhas liñas teñen máis palabras ou palabras máis longas, mentres que outras teñen palabras menos ou máis curtas. Para xustificar ese bloque de texto, hai que engadir espazos adicionais a algunhas liñas para uniformar todas as liñas e facelas consistentes.

Cada fabricante de navegador web ten o seu propio algoritmo para aplicar os espazos extras dentro dunha liña. Os navegadores consultan a lonxitude da palabra, a guionización e outros factores para determinar onde poñer os espazos.

Como resultado, o texto xustificado non pode verse idéntico dun navegador para o outro. Isto está ben porque ningún visitante do sitio saltará dun navegador a outro só para comparar o aspecto das lonxitudes da páxina do sitio. Asegúrese, con todo, que o soporte principal do navegador é bo para xustificar o texto con CSS.

Como xustificar o texto

A xustificación do texto con CSS require que se xustifique unha sección de texto.

Normalmente, isto faise para parágrafos de texto xa que os grandes bloques de contexto de texto que se estenden por varias liñas serán marcados con etiquetas de parágrafo.

Despois de ter un bloque de texto para xustificar, é só unha cuestión de definir o estilo para xustificar coa propiedade de estilo de texto de aliñamento de CSS.

alinear texto: xustificar;

Debería aplicar esta regra CSS a un selector axeitado para que o bloque de texto se execute tal como se desexa.

Cando xustificar o texto

Moita xente quere a aparencia dun texto xustificado desde o punto de vista do deseño, en gran medida porque crea un aspecto moi uniforme e medido, pero hai inconvenientes para xustificar completamente o texto nunha páxina web.

En primeiro lugar, o texto xustificado pode ser difícil de ler. Isto ocorre porque cando xustifica o texto, ás veces pode engadirse moito espazo adicional entre algunhas palabras da liña. Esas brechas inconsistentes poden facer que o texto sexa máis difícil de ler. Isto é especialmente importante nas páxinas web, que poden ser difíciles de ler xa por iluminación, resolución ou outra calidade de hardware. Engadindo espazos pouco habituais ao texto pode empeorar a situación.

Ademais dos problemas de lexibilidade, os espazos en branco ás veces se aliñan para crear "ríos" do espazo en branco no medio do texto.

Esas grandes lagoas de espazo en branco realmente poden facer unha exhibición incómoda. Ademais, en liñas moi curtas, a xustificación pode causar liñas que conteñan unha palabra con espazos extras entre as mesmas letras.

Entón, cando debes usar a xustificación do texto? O mellor momento para xustificar o texto prodúcese cando as liñas son longas e o tamaño da fonte é pequeno (algo que é difícil de garantir nos sitios web responsivos nos que a lonxitude da liña cambie en función dos tamaños de pantalla). Non hai un número duro e rápido para a lonxitude da liña ou o tamaño do texto; debes usar o teu mellor xuízo.

Despois de aplicar o estilo de aliñamento de texto para xustificar o texto, proba-lo para asegurarse de que o texto non ten ríos de espazo en branco e asegúrese de probalo nunha variedade de tamaños.

A forma máis sinxela de facelo é vela con ollos ollos. Os ríos destacan como manchas de branco nun bloque de texto doutro xeito gris. Se ves ríos, debes facer cambios no tamaño do texto ou no ancho do bloque de texto para desfacerse dos ríos desagradables.

Só use xustificación despois de que o comparaches con texto aliñado á esquerda como se ve neste artigo. Fas como a coherencia da xustificación completa, pero o texto xustificado estándar normalmente é máis lexible. Ao final, debes xustificar o texto porque decidiu xustificar o texto para fins de deseño e confirmou que o teu sitio permanece fácil de ler.