Design de landing page

Design de landing page significa dar uma só tarefa a uma página: um título que repete a promessa do anúncio, provas ao lado de um único botão e um formulário curto que carrega rápido no celular. Abaixo estão as partes, oito regras, três exemplos e um jeito gratuito de criar uma.

Site de organização de voluntariado criado com o Mobirise (tema HumanityM5), versão desktop Site de marca de suplementos alimentares criado com o Mobirise (tema EvolveM5), versão desktop Site de clínica médica criado com o Mobirise (tema SpecialtyM5), versão desktop

Guia revisado em 13 de outubro de 2026 · equipe do Mobirise

A anatomia de uma landing page

Landing page é a página em que alguém chega a partir de um anúncio, e-mail, post ou QR code específico, e ela existe para conseguir uma única ação dessa pessoa. As mesmas seis partes a sustentam, quase sempre nesta ordem.

01

Um título que repete a promessa

Reutilize as palavras do anúncio ou da mensagem que levou o visitante até ali. Se o anúncio oferece um orçamento grátis de reparo de telhado, o título diz exatamente isso, e não o slogan da sua empresa.

02

Uma linha sobre para quem é

Um subtítulo de uma ou duas frases: a quem a oferta serve, o que a pessoa recebe e em quanto tempo. Substantivos e números fazem mais do que adjetivos; “preço fechado até amanhã” diz mais ao leitor do que “atendimento rápido e simpático”.

03

Uma imagem da coisa real

O produto, o ambiente, a equipe ou o resultado. Fotos posadas de banco de imagens pesam, mas não informam. Veja como a imagem é cortada em uma tela estreita.

04

Uma única chamada para ação

Um único botão com um verbo e um resultado, na única cor forte da página. Repita-o mais abaixo para quem lê até o fim, mas nunca acrescente um segundo objetivo concorrente.

05

Provas junto da decisão

Avaliações com nome, notas com o total de avaliações, logos de clientes que você pode usar, certificados. Coloque-os ao lado do botão, onde a dúvida aparece, e não empilhados no fim da página.

06

Respostas e, depois, o formulário

Como funciona, quanto custa e o que acontece depois do clique. Em seguida, o formulário: só os campos de que o próximo passo precisa e uma frase dizendo o que o visitante recebe e quando.

Regras de design de landing page que funcionam

Cada uma pode ser verificada na página pronta em um ou dois minutos. Quando uma regra traz um número, ele vem de um padrão público com nome.

1

Elimine as saídas

Retire o menu principal, os links do blog e os ícones de redes sociais. Cada link a mais é uma saída antes da ação. Um logo, uma linha de contato e os links legais no rodapé bastam.

2

Combine com a origem

Mantenha o texto, a oferta e o estilo visual do anúncio. O Google Ads inclui a experiência da página de destino, ou seja, o quanto ela é relevante e útil para quem clicou, entre as três partes do Índice de qualidade.

3

Coloque o essencial em uma tela

No celular, o título, o subtítulo e o botão devem aparecer antes de qualquer rolagem. Se a imagem empurra o botão para baixo, reduza a imagem, não o texto.

4

Nomeie o resultado no botão

“Quero meu orçamento”, “Agendar visita”, “Receber a lista de preços”. Rótulos como “Enviar” ou “Saiba mais” descrevem o clique, e não o que o visitante recebe.

5

Peça menos

Para um primeiro contato, nome mais e-mail ou telefone costuma bastar. Cada campo adicional precisa de um motivo que você saiba explicar; as perguntas de qualificação podem esperar a ligação.

6

Cumpra os limites de velocidade do Google

As Core Web Vitals classificam uma página como boa quando o maior elemento é renderizado em até 2,5 segundos, a interação recebe resposta em até 200 ms e a mudança de layout fica em 0,1 ou menos, no percentil 75 das visitas.

7

Passe no básico de acessibilidade

A WCAG 2.2 exige contraste de texto de pelo menos 4,5:1 (3:1 para texto grande) e alvos de toque de pelo menos 24 por 24 pixels CSS no nível AA. Dê a cada campo do formulário um rótulo visível, e não só o texto de exemplo (placeholder).

8

Teste uma mudança de cada vez

Um teste A/B compara duas versões que diferem em uma só coisa e precisa de visitas e conversões suficientes em cada versão para descartar o acaso. Em uma campanha pequena, observar algumas pessoas usando a página costuma ensinar mais.

Exemplos de design de landing page com três temas do Mobirise

As três capturas de tela de desktop sob o título deste guia são as telas iniciais de demos de temas do Mobirise: uma organização de voluntariado (HumanityM5), uma marca de suplementos alimentares (EvolveM5) e uma clínica médica (SpecialtyM5). São demos, e não páginas de campanha; por isso, veja o que cada primeira tela faz bem e o que mudar antes de pagar por tráfego.

Organização de voluntariado

Tudo é centralizado: um título grande, uma frase sobre a causa e um botão escuro, sobre a foto esmaecida de mãos estendidas, que mantém o texto legível. Para uma campanha de recrutamento, troque “About Organization” (“Sobre a organização”) por “Quero ser voluntário” e informe o próximo evento.

Marca de suplementos alimentares

Um close de folhas verdes em largura total cria o clima antes de alguém ler uma palavra. O nome do produto aparece em letras brancas bem grandes, com uma descrição curta embaixo à esquerda e um botão “About supplement” (“Sobre o suplemento”) embaixo à direita. Em um anúncio, ponha o benefício no título em vez da categoria e acrescente uma avaliação ou um certificado perto do botão.

Clínica médica

Um topo dividido em duas partes: à esquerda, um título em fonte serifada e três linhas sobre médicos experientes, diagnósticos e atendimento centrado no paciente; à direita, a foto de um interior claro de clínica. Um ambiente real conquista mais confiança do que uma ilustração. Para uma campanha de agendamento, o botão principal deve dizer “Agendar consulta”, com o telefone ao lado.

O que mudar nos três

Cada demo mantém um menu completo (Home, About, Events ou Pricing), como um site normal deve ter. Em uma campanha, você o apagaria, manteria uma só ação e acrescentaria provas e um formulário curto mais abaixo. Como cada página é uma pilha de blocos, isso é uma edição, não um redesign.

Como criar uma landing page no Mobirise

Um só editor cria landing pages e sites completos, no navegador ou no aplicativo baixado. Quatro passos levam uma página até um endereço no ar.

01

Tenha um primeiro rascunho

Diga à IA o que você oferece e a quem atende em uma ou duas linhas, no seu idioma, ou entregue um esboço desenhado ou uma captura de tela. O gerador com IA devolve quatro designs, cada um com texto e imagens, geralmente em menos de um minuto; o Regenerate oferece mais variações sem consumir uma tentativa. Ou abra um tema e adicione os blocos manualmente.

02

Reduza a um só objetivo

Arraste os blocos até a ordem certa, apague os que não ajudam a ação e deixe o menu de fora. Use Clone Block para repetir a chamada para ação mais abaixo e escolha a tag H de cada título para que a página tenha um único H1. Textos e imagens são editados no próprio lugar; os parâmetros de cada bloco definem espaçamento, fundo, colunas e elementos visíveis.

03

Adicione o formulário e os extras

O Form Builder cria o formulário de captação, o Popup Builder adiciona um pop-up e o Chat Button abre uma conversa no WhatsApp, Telegram, Messenger e outros aplicativos. Os três estão incluídos nos planos pagos KIT, BASE e GROW.

04

Confira no celular e publique

Visualize a página em larguras de celular, tablet e desktop; as imagens viram WebP automaticamente. Publique em um endereço mobirisesite.com com HTTPS ou em um domínio próprio (planos BASE e GROW). Em qualquer plano, inclusive no plano FREE, o aplicativo para desktop também pode enviá-la por FTP ou FTPES, publicá-la no GitHub Pages ou gravá-la em uma pasta local.

O Mobirise não tem teste A/B integrado. Para comparar duas versões, publique cada uma em seu próprio endereço, envie metade dos seus anúncios para cada uma e compare os resultados na conta de anúncios ou na sua ferramenta de análise. A edição também funciona sem conexão no aplicativo offline para desktop; publicar e usar a IA exigem internet.

Qual criador de landing page combina com cada tarefa

As plataformas dedicadas a landing pages são feitas em torno de testes e de tráfego de anúncios. Os criadores de sites generalistas custam menos e deixam uma página crescer até virar um site. Nossas escolhas, inclusive os casos em que nós mesmos não escolheríamos o Mobirise:

Muitas variantes com tráfego pago
Unbounce ou Instapage. Os dois oferecem teste A/B nos planos intermediários; o Instapage testa no servidor e acrescenta personalização.
Testes A/B com orçamento menor
Leadpages, onde os testes começam no plano Grow.
Uma página simples por quase nada
Carrd: um plano gratuito e planos pagos cobrados por ano.
Uma página gratuita que fica com você em arquivos
Mobirise: o aplicativo para desktop não custa nada, exporta HTML e publica em qualquer hospedagem.
Um design com IA antes de pagar
8B AI: criar o design não custa nada, e para publicar é preciso o plano Pro.
Uma página que vira um site completo
Mobirise, ou outro criador de sites, já que as páginas seguintes ficam no mesmo projeto.
Onde o Mobirise deixa a desejar
Sem teste A/B integrado; formulários e pop-ups vêm com extensões pagas; sem layout separado para celular; os sites gratuitos exibem a marca do Mobirise.

Seis criadores de landing page comparados

O Mobirise perde na linha de testes A/B; as plataformas dedicadas perdem em ficar com os seus arquivos e em trabalhar offline. Repare na base de cobrança na linha de preço: mensal ou anual.

O Mobirise comparado com Unbounce, Leadpages, 8B AI, Carrd e Instapage na criação de landing pages
MobiriseUnbounceLeadpages8B AICarrdInstapage
Indicado paraLanding pages e sites inteiros a partir de blocos responsivos, com arquivos que ficam com vocêProfissionais de marketing e agências que rodam páginas de campanhaPequenas empresas que publicam landing pages, sites e blogsTestar um design completo de site com IA sem custo e publicar depoisSites simples de uma página e perfisCampanhas de anúncios em escala, com personalização
Teste A/BNão, não é integradoSim, ilimitado, a partir do plano ExperimentSim, a partir do plano GrowNão informadoNão informadoSim, no servidor, a partir do plano Optimize
FormuláriosExtensão Form Builder, nos planos KIT, BASE e GROWFormulários de captação de leads em todos os planos; formulários de várias etapas a partir do plano BuildFormulários e webhooks em todos os planosFormulários de contato e de captação, no plano gratuito e no ProA partir do Pro Standard; formulários avançados no Pro PlusCriador de formulários em todos os planos; formulários de várias etapas a partir do plano Optimize
Ajuda de IAQuatro designs por geração, a partir de texto digitado, um esboço ou uma captura de tela; 3 gerações gratuitas por mêsRedação com IA a partir do plano Build; otimização de tráfego com IA no plano OptimizeCriação de páginas com IA em todos os planosGera um design completo a partir de uma única frase; edições por chat com IA no ProNão informadoTexto com IA para títulos, parágrafos e botões
Plano gratuitoSim: o aplicativo para desktop e seus 200+ blocos, sites ilimitados em qualquer servidor, mais 3 sites online gratuitos em um subdomínio do Mobirise; os sites gratuitos exibem a marcaNão; teste de 14 dias sem cartão, sem domínio próprio durante o testeNão; teste de 7 dias, com cartão obrigatórioSó para criar o design; sem publicaçãoSim, até 3 sites com a marca “Made with Carrd”Não; teste de 14 dias, com cartão obrigatório
Plano pago mais baratoUS$ 149 por ano no plano KIT: aplicativo para desktop, todas as extensões, sem marca. US$ 199 por ano no plano BASE, que acrescenta domínios próprios na hospedagem do MobiriseStarter, US$ 22 por mês com cobrança anual (US$ 29 no mensal): 5 páginas, tráfego de até 500Pro, US$ 29 por mês; a cobrança anual economiza 20%US$ 9 por mês no Pro, pagos anualmente, com hospedagem e domínio próprioUS$ 9 por ano no Pro Lite (só endereço do Carrd); US$ 19 por ano no Pro Standard, que acrescenta domínios próprios e formuláriosCreate, US$ 79 por mês com cobrança anual (US$ 99 no mensal): 15.000 visitantes únicos por mês
Exportar o códigoSim: arquivos HTML, CSS e JS simples, grátis no aplicativo para desktop; a exportação do criador no navegador exige o plano BASE ou GROWNão; as páginas só são baixadas como arquivos .unbounce para o UnbounceClassic Builder: um arquivo HTML que carrega a página do Leadpages; uma cópia estática não tem suporteExportação completa em HTML no ProPro Plus (US$ 49 por ano): HTML, CSS e JS em um zip; os formulários deixam de funcionarNão informado
Funciona offlineSim, no aplicativo para desktop (Windows, macOS, Linux)Não, só no navegadorNão, só no navegadorNão, só no navegadorNão, só no navegadorNão, só no navegador

Consultado em 13 de outubro de 2026 nas páginas de preços e nos artigos de suporte de cada provedor. Preços em dólares americanos; “cobrado anualmente” é o equivalente mensal de um único pagamento anual, enquanto o Mobirise e o Carrd informam um preço por ano. Os valores em dólar do Leadpages vêm do FAQ da página de preços. Avaliações antigas costumam citar planos anteriores, e os preços mudam; por isso, confirme em cada site antes de comprar.

Checklist antes de lançar uma landing page

Percorra esta lista em um celular, com dados móveis e não com o Wi-Fi do escritório, antes de chegar o primeiro clique pago, e envie você mesmo um cadastro de teste pelo formulário.

Corrija qualquer item reprovado antes de gastar com tráfego: cliques pagos em um formulário quebrado são o erro mais caro aqui. Em um site de uma página, e não em uma página de campanha, ignore o primeiro item e o objetivo único.

  • Coerência com a origem. O título usa as palavras do anúncio, e-mail ou post.
  • Primeira tela. Título, subtítulo e botão aparecem no celular sem rolar a página.
  • Um só objetivo. O menu e os links sem relação sumiram; qualquer botão repetido leva à mesma ação.
  • Texto do botão. Ele diz o que o visitante recebe.
  • Provas. Ficam perto do botão, e toda citação tem nome.
  • Formulário. Só os campos de que o próximo passo precisa, cada um com rótulo visível.
  • Cadastro de teste. Ele chega à caixa de entrada certa, e a mensagem de agradecimento diz o que acontece depois.
  • Contraste e tamanho do toque. O texto atinge 4,5:1 e os botões são fáceis de acertar com o polegar.
  • Velocidade. A página passa nas Core Web Vitals no PageSpeed Insights.
  • Básico de busca. O título e a descrição da página descrevem a oferta, e há um único H1.
  • Rodapé. Os links da política de privacidade e de contato funcionam.
  • Rastreamento. Uma conversão é contada na sua ferramenta de análise ou na conta de anúncios.

Perguntas frequentes sobre design de landing page

O que é design de landing page?

É planejar uma página em torno de uma única ação para visitantes de uma origem específica: um anúncio, um e-mail, um post ou um QR code. Abrange título, layout, provas, formulário e velocidade, e o resultado é medido por um só número, a parcela de visitantes que agem.

O que faz uma boa landing page?

Uma promessa que corresponde à origem do visitante, uma única ação, provas ao lado dessa ação e um formulário curto. Ela também precisa carregar rápido e ser legível no celular, já que o tráfego de campanhas muitas vezes chega por um.

Como fazer o design de uma landing page, passo a passo?

Anote a única ação que você quer e de onde vem o tráfego. Escreva o título com as palavras da própria origem, reúna as provas que pode mostrar e esboce a ordem das seis partes. Depois monte tudo com blocos ou um rascunho de IA e teste no celular antes do lançamento.

Um site de uma página é o mesmo que uma landing page?

Não exatamente. Um site de uma página reúne um site pequeno inteiro em uma única página de rolagem, em geral com um menu que salta para as seções, e atende a vários propósitos. Uma landing page tem um único objetivo, costuma ser feita para uma campanha e pode ficar dentro de um site maior.

Uma landing page deve ter menu de navegação?

Em geral, não: cada link do menu é uma saída antes da ação. Mantenha o logo, uma linha de contato e os links legais; em uma página longa, um botão que leva ao formulário substitui o menu.

Qual deve ser o tamanho de uma landing page?

O das dúvidas do visitante. Um download gratuito pede uma ou duas telas; um serviço caro pede preços, processo, provas e respostas, e por isso fica mais longo. Repita o mesmo botão em pontos naturais de pausa.

Qual é o melhor criador de landing page?

Depende da tarefa. Para testes A/B constantes com tráfego pago, Unbounce, Instapage e Leadpages foram feitos para isso. O Carrd é uma opção barata para uma única página simples. O Mobirise serve para uma página gratuita que você pode hospedar em qualquer lugar e depois expandir para um site completo, embora não tenha teste A/B integrado.

Dá para fazer uma landing page de graça?

Sim. O aplicativo do Mobirise para baixar é gratuito, inclui 200+ blocos e pode enviar a página ao seu próprio servidor. Online, o plano gratuito cobre 3 sites em um endereço mobirisesite.com mais 3 gerações com IA por mês, com a marca do Mobirise em cada site. O Form Builder e o Popup Builder exigem um plano pago, a partir de US$ 149 por ano.

A IA consegue criar o design de uma landing page?

Sim. No Mobirise você descreve a oferta e o público, escolhe entre quatro designs de IA e refina um deles conversando com a IA ou editando os blocos por conta própria. Uma única geração rende uma página ou uma versão preliminar do site completo. Seus preços, fatos e fotos reais ainda vêm de você.

O Mobirise tem teste A/B?

Não, não há teste A/B integrado. Você pode publicar duas versões em endereços diferentes, enviar metade do tráfego dos anúncios para cada uma e comparar os resultados na conta de anúncios ou na sua ferramenta de análise.

Crie sua primeira landing page

Comece por um rascunho gerado por IA online ou monte tudo bloco a bloco no aplicativo gratuito, em um computador Windows, Mac ou Linux, e depois publique onde sua campanha precisar.