Por que os designers usam texto lorem ipsum?

A resposta curta

O texto de preenchimento existe para responder a uma pergunta de layout, não de conteúdo. Um designer preenche um wireframe com lorem ipsum porque a distribuição do tipo — onde o titular quebra a linha, como o bloco de parágrafo se apoia no espaço em branco, se a altura fixa de um card sobrevive a frases reais — precisa ser julgada antes que alguém tenha concordado sobre quais serão as palavras. Copy real nessa etapa é distração; molduras vazias estão cegas.

O motivo de ser sem sentido em vez de inglês de enchimento é deliberado: texto ilegível mantém o feedback na hierarquia, no espaçamento e no peso, em vez de começar uma discussão sobre a redação. O motivo de ser latim é que o comprimento das palavras latinas e a mistura de letras parecem prosa de idioma europeu num relance, ao mesmo tempo que está óbvio que não é o copy final, então ninguém confunde aquilo com conteúdo.

Essa é toda a lógica. O que vem abaixo desenvolve isso e depois cobre onde a prática sai do trilho — o que acontece mais vezes do que os designers admitem, sobretudo em produtos que saem em mais de um idioma.

Texto de preenchimento não é forma de preenchimento

A moldura vazia é o problema. Um layout desenhado como retângulos vazios não pode falhar: nada transborda, nada quebra linha, nada é empurrado para fora da tela. Caixas vazias parecem calmas e equilibradas porque não há nada dentro delas com que brigar. Encha as mesmas caixas com texto e o design começa a quebrar de maneiras que você só enxerga depois que algo já foi quebrado.

Então o texto de preenchimento não é decoração do mockup; ele faz as vezes da forma da escrita real. Três propriedades carregam o peso. Comprimento: um titular que corre duas palavras a mais quebra para uma segunda linha e desloca todos os elementos abaixo dele. Comprimento de palavra: palavras longas definem a margem irregular do parágrafo — o lado direito desigual —, obrigam a decidir sobre hifenização e abrem rios de espaço em branco que descem pelas colunas justificadas. Ritmo de linha: parágrafos com quantidades diferentes de frases fazem blocos de texto parecerem densos ou arejados, e uma página vive ou morre nessa textura.

Nenhum desses problemas aparece enquanto as caixas estão vazias, e nenhum aparece com palavras de enchimento de cinco caracteres. Eles aparecem com texto de comprimento realista, de comprimento de palavra realista e de ritmo de linha realista. É exatamente isso que o texto de preenchimento entrega sob demanda, e é por isso que os designers recorrem a ele antes de as palavras existirem.

Componentes de tamanho fixo deixam o ponto mais nítido: um botão, uma célula de tabela, um card com recorte de duas linhas só são testados pelo tanto que cabe. Você descobre qual layout sobrevive no momento em que cola um parágrafo honestamente longo.

• O que uma moldura só revela quando está cheia:
• Onde os titulares quebram, e se a segunda linha deixa uma palavra órfã.
• O quão irregular é de fato a margem direita de cada parágrafo.
• Quais blocos se leem como conteúdo denso e quais se leem como buracos.
• Quais componentes de tamanho fixo cortam, encolhem ou quebram linha quando o texto os ultrapassa.

Por que sem sentido em vez de copy real

Conteúdo legível puxa o olho. Coloque o titular de verdade num mockup e todos que olharem — você, o cliente, o gerente de produto — leem a frase e reagem à frase. O feedback vira escolha de palavras e tom, e o layout fica sem julgamento porque ninguém consegue avaliar hierarquia embaixo de um copy sobre o qual está discutindo agora. Palavras com significado são ímãs; você não pode pedir às pessoas que olhem além delas, porque não é assim que a leitura funciona.

O texto sem sentido se recusa a participar disso. Ninguém tem opinião sobre “consectetur adipiscing elit”, então a conversa fica onde precisa ficar enquanto o layout está sendo decidido: hierarquia, espaçamento, peso, escala. Isso não é uma regra nem um truque — é o reconhecimento de que pedir às partes interessadas que ignorem o significado de palavras legíveis é um pedido que elas não vão honrar.

Há também um benefício mais discreto: texto de preenchimento não gera compromisso. Um borrador de copy real sugere que a página diz alguma coisa, e as pessoas tratam rascunhos circulados como conteúdo aprovado. O texto de preenchimento se anuncia como inacabado, o que impede que a discussão do layout vire uma discussão de aprovação de conteúdo.

Por que latim especificamente

Depois de aceitar que o enchimento deve ser ilegível, você ainda precisa que ele pareça escrita, e essa é a parte do latim. O texto de preenchimento falha na sua função se parecer falso: um campo de “asdf asdf asdf” é lido como um marcador de posição, e o olho escorrega para fora do layout em vez de lê-lo como uma página. Palavras latinas têm a forma da prosa de idioma europeu — comprimentos de palavra mistos, conectivos curtos, pontuação familiar, ascendentes e descendentes distribuídos como em inglês ou alemão —, próximas o suficiente para que um parágrafo disso seja lido como um parágrafo na distância em que você avalia um layout.

Ele também deixa claro que não é o copy final. Grego pareceria uma escolha de design; francês seria lido por metade da sala; um idioma inventado dá trabalho para manter coerente. O latim ocupa um meio estável: todos o reconhecem como uma língua que ninguém vai publicar, então ele substitui o conteúdo sem que ninguém confunda o enchimento com uma decisão. É essa reconhecibilidade que faz a mesma linha de abertura ter sobrevivido como convenção — o significado dela é “este espaço ainda não está preenchido”.

O porém é que “a forma da prosa de idioma europeu” quer dizer alfabeto latino, palavras separadas por espaço e mais ou menos a mistura de caracteres do inglês — e nada além disso. Ele não diz nada sobre quanto o alemão expande, nem sobre como o chinês quebra linha. Essa limitação é o assunto da seção de falhas abaixo.

De onde veio o lorem ipsum

A história de origem é contada com mais confiança do que a evidência sustenta. Aqui está o relato amplamente aceito, com as partes incertas marcadas.

Uma fonte latina clássica

O trecho padrão descende de latim de verdade. Suas palavras de abertura são um extrato alterado do De Finibus Bonorum et Malorum de Cícero — “Sobre os Fins dos Bens e dos Males”, um tratado de ética do século I antes de Cristo —, de uma passagem perto do início do livro um que discute prazer e dor. Que Cícero seja a fonte é a parte em que estudiosos e escritores de design concordam; a referência exata da seção é citada de formas diferentes conforme o relato, e o que sobrevive mostra o extrato picado e remendado, sílabas cortadas no meio da palavra e pedaços costurados de novo. “Lorem ipsum dolor sit amet” não é uma frase em latim; é o destroço de uma.

Então a pergunta “é latim de verdade?” tem uma resposta honesta: o texto-semente era latim, e ele foi quebrado de propósito.

Uma prática de tipografia, não uma invenção

O embaralhamento importa mais do que a fonte, e ele é anterior a qualquer produto específico. Por séculos, provas e especificações de tipos de imprensa usaram latim que parecia prosa real, mas que ninguém poderia confundir com o livro de alguém — um enchimento que demonstrava o tipo sem oferecer texto legível para copiar. O lorem ipsum é um sobrevivente dessa prática, não a invenção de uma pessoa esperta num momento único. Quão longe no tempo fica o exemplo mais antigo é genuinamente nebuloso no relato popular: você verá datas espalhadas pela segunda metade do segundo milênio, e quase todas se rastreiam a um pequeno número de versões online que se escoram umas nas outras. Trate qualquer ano exato nesta história como um palpite que alguém deu.

A história da década de 1960 e o que dá para citar de fato

A versão folclórica diz que um compositor tipográfico — ou uma folha de letras de transferência seca da década de 1960 — inventou o trecho e o espalhou pelos estúdios de design, com a editoração eletrônica finalizando o serviço. O desenho geral é plausível: o texto já estava em uso no ofício gráfico, um produto de massa o tornou universal e o software de design o padronizou a partir daí. Os detalhes repetidos por aí — quem cortou as folhas, em que ano, qual designer famoso — não são algo que você consiga citar com precisão, e quem tentou documentar isso não conseguiu fixar os dados. Se você precisa de uma frase confiável: ninguém sabe quem tornou o lorem ipsum padrão, mas padrão ele se tornou.

O que não é folclore é o que aconteceu em seguida: quando a editoração eletrônica e o design web adotaram o texto, os recém-chegados copiavam o que as ferramentas existentes produziam, e a convenção se travou. É por isso que a maioria dos geradores ainda começa com as mesmas três palavras reconhecíveis.

Como funciona o lorem ipsum

Mecanicamente, gerar texto de preenchimento é uma de duas coisas, e é fácil confundi-las. A primeira é o trecho canônico estendido pelo embaralhamento: pegue o extrato machucado de Cícero e continue aplicando o mesmo processo — remover letras, inserir outras, deslocar terminações — e você obtém página após página de um texto quase latino que nunca se resolve em frases. É daí que vem o visual clássico do “lorem ipsum”.

A segunda é um banco de palavras e um sorteio aleatório: o gerador guarda uma lista de palavras de aparência latina e escolhe dela para montar os parágrafos que você pede. Sem gramática, sem significado, sem modelo de língua real alguma; a saída é ruído em forma de prosa. A maioria das ferramentas que você realmente usa, incluindo o gerador linkado no fim deste guia, funciona assim.

Os dois métodos exploram a mesma propriedade: a reconhecibilidade mora no nível da forma, não no da correção. Você avalia um parágrafo a um pé e meio de distância, que é uma distância em que importam o comprimento das palavras, as quebras de linha e a densidade da tinta, e não a ortografia. Um sem sentido com a forma certa passa por conteúdo num relance — que é exatamente o que um teste de layout precisa.

Conheça também os limites do truque: um sorteio aleatório dá comprimento e ritmo plausíveis, não a mistura de palavras da prosa genuína, que se apoia forte em um punhado de palavras curtas e comuns. Na distância do layout ninguém percebe, e a distância do layout é o padrão que está sendo cumprido.

Onde isso sai errado

O texto de preenchimento tem uma função estreita, e três falhas explicam a maior parte do estrago que ele faz.

Deixá-lo no entregável

O desastre clássico é a página no ar ainda carregando “consectetur adipiscing elit” porque ninguém trocou o copy. Num mockup, o texto de preenchimento anuncia “ainda não terminamos”; num produto lançado ele anuncia “não ligamos”. Titulares reais, rótulos de navegação e texto de botão precisam estar no lugar muito antes de o arquivo sair da sua máquina — são os elementos que todo revisor lê primeiro, e aqueles cujo comprimento você jamais deveria ter precisado chutar.

Existe uma versão mais sutil: preencher todos os espaços com enchimento menos os importantes. Uma tabela de preços montada com nomes de plano fictícios não testou nada, porque o plano que de fato diz “Enterprise Annual Contract” é o que quebra linha.

Revisar acessibilidade ou conteúdo com ele

Texto de preenchimento não diz nada sobre o comprimento do conteúdo real, o que o torna o material errado para qualquer coisa que dependa de significado. Um leitor de tela vai recitar o sem sentido com perfeição, então uma passada de acessibilidade sobre lorem ipsum encontra todos os problemas num texto que não tem nenhum — enquanto texto alternativo, propósito de link e ordem de leitura sob titulares reais ficam sem teste. Sessões de usabilidade com copy de enchimento produzem participantes parafraseando absurdo, o que é uma sessão perdida educadamente.

O mesmo vale para o comprimento. Parágrafos de lorem ipsum tiram a média que os parâmetros do gerador determinarem; o copy real de um produto tem mensagens de erro várias vezes mais longas que o enchimento, nomes de produto sem espaços e strings digitadas pelo usuário tão longas quanto o campo permite. Texto de preenchimento pode aproximar a média. A cauda ele não consegue aproximar.

Testar um produto multilíngue com texto de preenchimento em forma de inglês

Esta é a falha com mais custo real, e a maioria das explicações a pula por inteiro. O texto padrão aproxima uma prosa de comprimento inglês, separada por espaços e em alfabeto latino. Três variáveis que de fato decidem se um layout sobrevive à tradução — quanto espaço o texto ocupa, onde a linha pode quebrar e em que direção o texto corre — ficam todas presas ao inglês por essa escolha, então um parágrafo de lorem ipsum inglês não testa nenhuma delas para nenhum outro idioma.

Expansão primeiro. Traduções para a maioria dos idiomas europeus precisam de visivelmente mais espaço que o original em inglês; uma regra prática citada com frequência em localização é que alemão, francês e espanhol precisam cada um de aproximadamente 15-35 por cento a mais, com o alemão geralmente o mais longo dos comuns. Uma coluna dimensionada a partir de um parágrafo de enchimento inglês de treze palavras é uma coluna da qual uma frase alemã de vinte palavras sai andando direto para fora.

Regras de quebra em segundo lugar, e é a que morde mais forte. Texto em chinês e japonês não usa espaço nenhum: não há palavras entre as quais um algoritmo de quebra de linha possa escolher, a quebra acontece entre caracteres, e a densidade por linha não se parece com nada do alfabeto latino. Testar um parágrafo de lorem ipsum inglês para esses idiomas significa que você não testou a quebra de linha nem um pouco. O problema espelhado é a string inquebrável — uma URL, um endereço de e-mail, um substantivo composto alemão comprido —, que se comporta como CJK em miniatura e transborda do contêiner que lidou com “lorem ipsum” maravilhosamente bem.

Direção em terceiro. Árabe e hebraico invertem o layout — alinhamento, marcadores de lista, ordem de leitura —, e um parágrafo em latim não diz nada sobre como o design espelhado se comporta. Nada disso significa abandonar o texto de preenchimento em produtos internacionais; significa que o enchimento precisa casar com a forma do idioma de destino, não com a do inglês.

O que usar no lugar

Texto de preenchimento é a ferramenta errada no momento em que a pergunta deixa de ser “o layout sobrevive” e passa a ser “a página funciona”. Três trocas cobrem quase todos os casos.

Conteúdo real cedo. O conserto mais forte é parar de usar texto de preenchimento assim que as palavras existirem. Titulares, navegação, rótulos de botão e introduções de seção normalmente são escritos antes da revisão de design; coloque os rascunhos e deixe o layout absorver a verdade sobre o comprimento deles, mesmo que a redação mude depois. Um designer trabalhando contra titulares reais ainda recebe feedback de layout, e as discussões de redação acontecem mais cedo, quando são baratas.

Preenchimento fiel em comprimento para o idioma de destino. Se o produto sai em alemão, gere a forma alemã. Dois caminhos: a pseudotradução, que reescreve cada string real como texto sintético acentuado mais longo na proporção da expansão estimada, para você ver o comprimento sem esperar pelos tradutores; ou parágrafos de enchimento simplesmente mais longos — cerca de 1.3 vezes o volume do inglês — para o idioma específico. Para CJK, cole prosa chinesa ou japonesa real de comprimento realista; o comportamento da quebra é todo o ponto, e só texto genuíno o exercita.

Strings reais de pior caso. Antes da entrega, substitua o enchimento pela entrada mais longa que o campo realmente pode receber: o sobrenome duplo, o título de produto que vem longo, o e-mail de comprimento total, a mensagem de erro mais longa que você já escreveu. É entediante, e é a checagem de maior retorno que você pode fazer, porque layouts são publicados pelos seus casos limite, não pelas suas médias.

• A lista de trocas num lugar só:
• Explorando layout, estilo e hierarquia: texto de preenchimento, mantenha.
• Decidindo dimensionamento de componentes e breakpoints: conteúdo real de rascunho em comprimento realista.
• Desenhando idiomas internacionais: pseudotradução ou preenchimento do idioma de destino.
• Teste de usabilidade, revisão de acessibilidade, revisão de conteúdo: só palavras reais.

Como usar um gerador de lorem ipsum direito

O gerador linkado desta página foi feito para o trabalho de layout e nada mais. Você escolhe o número de parágrafos, de 1 a 10, e opcionalmente define frases por parágrafo e palavras por frase; deixe qualquer um dos dois campos em branco e ele sorteia dentro de uma faixa — de 4 a 9 frases por parágrafo e de 8 a 18 palavras por frase. Essa aleatoriedade é justamente o ponto: cinco parágrafos de tamanho idêntico parecem um marcador de posição, e você não consegue julgar uma margem direita irregular quando toda linha termina no mesmo ponto. A caixa «Começar com a frase clássica» mantém a linha de abertura “Lorem ipsum dolor sit amet” se você quiser que o mockup seja lido como a convenção reconhecida. Nos ajustes máximos — 10 parágrafos, 9 frases cada, 18 palavras por frase — a saída é 10 × 9 × 18 = 1,620 palavras.

Por baixo dos panos é o método do banco de palavras, não o embaralhamento clássico: um banco fixo de 280 palavras latinas, das quais só o trecho inicial segue a passagem derivada de Cícero; o resto é vocabulário latino variado, com alguns tokens irregulares misturados. As palavras são sorteadas de forma independente e uniforme com Math.random, então execuções repetidas parecem diferentes entre si, e nada na saída é modelado sobre a frequência real de palavras do latim. É ruído em forma de prosa de propósito — a função é comprimento e ritmo realistas, não um falso filologicamente correto.

Vale dizer os limites dele com franqueza, porque são escolhas de design, não defeitos a descobrir depois. A saída é texto simples numa caixa com um botão de copiar. Não há modo de marcação HTML, nem modo de lista ou de título, nem download de arquivo — para colar em código ou numa ferramenta de design você mesmo embrulha os parágrafos, o que mantém a estrutura sua. Ele roda totalmente em local, e nada do que você gerar é enviado a lugar nenhum.

Na prática: escolha o número de parágrafos que bate com a seção que você está desenhando, deixe os campos de frases e de palavras em branco para ter variação natural, cole na moldura — e então troque pelas strings que realmente vão existir antes de alguém fora do seu time ver o arquivo.

• O que o gerador faz: de 1 a 10 parágrafos de texto de preenchimento simples, campos opcionais de frases e de palavras, linha de abertura clássica opcional.
• O que o gerador não faz: gerar HTML, listas ou títulos, salvar um arquivo ou enviar para qualquer lugar o que você escrever.

Perguntas frequentes