Esta página foi traduzida com auxílio de IA. O original em inglês é a versão de referência.
O comprimento de linha — a medida, em termos tradicionais — é a largura de uma coluna de texto contada em caracteres. A edição de 2005 recomendava 55–65 caracteres por linha, cerca de dez a doze palavras, e alertava que a leitura em tela era mais fatigante que no impresso, de modo que linhas mais curtas e parágrafos menores eram mais seguros. De tudo o que havia na pesquisa original, esta recomendação é a que melhor se sustentou. O consenso tipográfico sobre a medida confortável permanece estável há mais de um século de prática impressa e foi repetidamente reafirmado para as telas. O que mudou não foi o número, mas a maquinaria ao redor dele: a web agora tem unidades que expressam a medida diretamente, normas que a delimitam e viewports que o original não poderia ter imaginado.
O que mudou desde 2005
Em 2005, restringir o comprimento de linha significava larguras fixas em pixels estimadas a partir de um caractere médio. O CSS moderno expressa a medida nos termos do próprio texto: a unidade ch equivale à largura de avanço do glifo do zero na fonte corrente, o que a torna um substituto prático para a largura média de caractere. Uma única declaração — max-width: 65ch — codifica a recomendação central deste capítulo e se adapta automaticamente quando a fonte, o corpo ou a preferência do usuário mudam. É a linha de CSS adjacente à acessibilidade mais útil que um designer pode escrever. Note que ch é uma aproximação: uma coluna de 65ch normalmente rende um pouco mais de 65 caracteres reais em texto proporcional, já que o zero é mais largo que a média. Trate-a como alvo, não como garantia, e verifique parágrafos reais.
As normas agora delimitam a faixa. O Critério de Sucesso 1.4.8 Apresentação Visual da WCAG (nível AAA) especifica que deve haver um mecanismo para que blocos de texto não excedam 80 caracteres de largura (40 para escritas CJK). Oitenta é um teto, não um alvo — o critério define onde o dano à legibilidade se torna uma questão de acessibilidade, enquanto a zona de 55–65 continua sendo onde o conforto atinge o pico. Uma coluna que se limita a cerca de 65–70ch satisfaz tanto a diretriz quanto o consenso mais antigo do ofício.
A outra restrição nova corre na direção oposta. O Critério de Sucesso 1.4.10 Refluxo (nível AA, WCAG 2.1 e 2.2) exige que o conteúdo reflua para um viewport de 320 pixels CSS de largura — equivalente a uma página de desktop com zoom de 400% — sem rolagem bidimensional. Em 2005 o risco eram linhas longas demais; em 2026 um risco igual são layouts que se recusam a encurtar. Colunas de largura fixa, layouts lado a lado que nunca empilham e elementos com larguras mínimas rígidas forçam rolagem horizontal a 320px, o que é ao mesmo tempo uma falha de conformidade e uma barreira genuína: ler texto que exige rolar para o lado a cada linha está entre as experiências mais punitivas relatadas por usuários com baixa visão. A 320px com texto corrido de 16px, as linhas ficam em torno de 30–40 caracteres. Isso está abaixo da zona de conforto, e não há problema — linhas curtas retardam ligeiramente a leitura, mas não a quebram, ao passo que a rolagem horizontal a quebra por completo. Projete a medida como um máximo, nunca como um mínimo.
Por que a faixa funciona
A estabilidade da recomendação de 55–65 reflete a mecânica da leitura. Linhas longas alongam o movimento de retorno — o salto do olho de volta ao início da linha seguinte — e aumentam os erros de duplicação, em que o leitor pousa na linha errada; elas exigem entrelinha extra para compensar. Linhas muito curtas colocam poucas palavras na pré-visualização de cada fixação, forçam trocas constantes de linha e picotam as frases contra sua estrutura gramatical. A pesquisa de legibilidade complica o quadro de um jeito interessante: alguns estudos em tela constataram que linhas mais longas podem produzir velocidades de leitura maiores, presumivelmente por reduzir o número de custosos movimentos de retorno — e no entanto os leitores consistentemente preferem linhas moderadas e as avaliam como mais confortáveis, e o conforto governa se as pessoas continuam lendo. Para leitura prolongada, a preferência e a fadiga reduzida falam a favor da medida moderada, e é isso que este capítulo continua a recomendar.
A interdependência com a entrelinha, tratada no capítulo anterior, merece ser repetida como uma única regra: se a medida precisa ser longa, acrescente entrelinha. Uma linha de 75 caracteres com line-height 1.6 permanece legível; a mesma linha com 1.3 convida à duplicação.
Medida responsiva na prática
O padrão moderno combina três ingredientes. Uma coluna de conteúdo com max-width em torno de 60–70ch estabelece a medida ideal em telas grandes. Um padding horizontal fluido deixa a coluna respirar até viewports estreitos sem jamais induzir rolagem horizontal. E, se houver tipografia fluida em jogo — corpos de fonte escalando com o viewport via clamp() —, lembre que a medida é contada em caracteres, não em pixels: como ch acompanha o corpo da fonte, um max-width baseado em ch cresce com o tipo e mantém a contagem de caracteres praticamente constante, que é precisamente o comportamento desejado.
Uma reversão em relação ao texto original: a edição de 2005 aconselhava evitar hifenização no texto corrido. Com composição alinhada à esquerda em medidas generosas, a hifenização é de fato desnecessária. Mas nas medidas estreitas que o refluxo exige, palavras longas em texto sem hifenização criam recortes escancarados na margem ou transbordam por completo. Ativar hyphens: auto (com o atributo lang correto definido, já que a hifenização é guiada por dicionário) é hoje boa prática para texto corrido que precisa sobreviver a colunas estreitas. Combine com text-wrap: pretty onde houver suporte, para melhores decisões de quebra.
Por fim, o conselho do original sobre o comprimento dos parágrafos continua válido e ganhou força normativa: parágrafos mais curtos ajudam a orientação de que dependem leitores de tela, quem lê por alto e leitores com dificuldades de atenção ou memória. O 1.4.12 da WCAG espera adicionalmente que o conteúdo tolere espaçamento entre parágrafos aumentado pelo usuário, portanto evite layouts que presumam que os parágrafos se encaixam em uma altura exata.
No CSS
article {
max-width: 65ch; /* 45–75 characters; ~65 is the sweet spot */
margin-inline: auto;
padding-inline: 1rem; /* fluid gutter at every width */
}
/* Test at a 320px viewport: no horizontal scrolling (WCAG 1.4.10) */Recomendações
- Mire 55–65 caracteres por linha no texto corrido; trate 80 como o limite externo conforme a WCAG 1.4.8.
- Implemente a medida com max-width em unidades ch (aproximadamente 60–70ch) na coluna de conteúdo.
- Garanta que o conteúdo reflua em um viewport de 320px sem rolagem horizontal (WCAG 1.4.10); nunca defina uma medida mínima.
- Aumente a entrelinha quando a medida for longa; os dois ajustes são uma única decisão.
- Ative hyphens: auto com um atributo lang correto para que colunas estreitas quebrem com limpeza, e acrescente text-wrap: pretty onde houver suporte.
- Com tipografia fluida, mantenha a medida em unidades relativas a caracteres para que o comprimento de linha permaneça estável conforme o corpo escala.
- Mantenha os parágrafos curtos; verifique se os layouts toleram espaçamento entre parágrafos aumentado conforme a WCAG 1.4.12.