Iniciar projeto
Blog

A Anatomia de uma Home Que Converte: Seção por Seção

Neste artigo
  1. A primeira dobra: a promessa que decide se o visitante fica
  2. Velocidade da primeira dobra: o que o LCP mede e por que importa
  3. Prova social: o que sustenta a promessa da primeira dobra
  4. Serviços: organizar a oferta para quem ainda está decidindo
  5. Como funciona: o bloco que reduz a hesitação antes do formulário
  6. Objeções: responder antes que o visitante pergunte
  7. Contato: transformar interesse em conversa
  8. Contraste e legibilidade valem para a home inteira

Suponha um visitante chegando pelo Google, no celular, depois de clicar num anúncio ou num resultado de busca. Ele não lê a home inteira. Ele olha os primeiros segundos de tela e decide, quase sem perceber, se continua rolando ou volta para a busca. Cada seção da home tem uma função específica nesse processo, e entender o papel de cada uma ajuda a construir uma página que guia a decisão, em vez de confundir quem chega.

Além de guiar o visitante, essa estrutura tem peso técnico. O Google usa as métricas de Core Web Vitals diretamente nos seus sistemas de classificação, e trata outros pontos, como conexão segura, adequação a celular e ausência de anúncios que atrapalham o conteúdo principal, como parte da experiência de página, mesmo sem o mesmo peso direto no ranking.

A primeira dobra: a promessa que decide se o visitante fica

A primeira tela visível, sem precisar rolar, tem duas funções: dizer o que a empresa faz e para quem, e oferecer um próximo passo único. Quando a proposta de valor é genérica ou a chamada compete com três ou quatro botões diferentes, o visitante gasta energia decidindo o que fazer, em vez de decidir se quer aquilo. Um título específico, com o serviço, o público e o benefício concreto, responde de imediato à pergunta que trouxe a pessoa até ali, o que costuma funcionar melhor do que uma frase de efeito. Vale a pena estruturar essa mensagem com cuidado: veja como em Como Escrever Textos que Vendem.

A chamada principal deve ser uma só, ou no máximo duas, com hierarquia clara entre a ação primária (agendar, pedir orçamento) e a secundária (ver portfólio, conhecer serviços). Duas chamadas do mesmo peso visual dividem a atenção e atrasam a decisão.

Velocidade da primeira dobra: o que o LCP mede e por que importa

Antes de qualquer palavra ser lida, a primeira dobra precisa aparecer na tela. O Google mede isso pelo LCP (Largest Contentful Paint): o tempo até o maior elemento visível (geralmente a imagem de fundo, o título ou o bloco de texto principal) terminar de renderizar. Segundo o web.dev, o valor considerado bom é de até 2,5 segundos, medido no 75º percentil de carregamentos, separando celular e computador (web.dev, Largest Contentful Paint).

O LCP é uma das três métricas do Core Web Vitals. As outras duas são o INP (Interaction to Next Paint), que mede a resposta a cliques e toques e considera bom um valor de até 200 milissegundos, e o CLS (Cumulative Layout Shift), que mede o quanto os elementos pulam na tela durante o carregamento e considera bom um valor de até 0,1, segundo o mesmo guia do web.dev sobre Core Web Vitals.

Isso muda a forma de montar a primeira dobra na prática. Imagem de fundo pesada, vídeo em autoplay ou uma fonte carregada de um servidor externo lento empurram justamente o elemento que o Google está cronometrando. Uma home bonita que demora para aparecer perde a primeira impressão antes mesmo de o visitante ler a proposta. O comportamento completo de carregamento, incluindo como medir e o que otimizar, está detalhado em Site Lento Perde Venda.

Prova social: o que sustenta a promessa da primeira dobra

Depois que a proposta convenceu o visitante a continuar, a seção seguinte precisa responder a uma pergunta natural: por que confiar nessa empresa. É esse o papel da prova social, seja com depoimentos reais de clientes, número de projetos entregues, selos ou logos de quem já comprou. O mecanismo é direto: a primeira dobra faz uma promessa, e a prova social mostra que outras pessoas já validaram aquela promessa antes. Sem essa seção, a home pede um voto de confiança sem nenhuma evidência.

O erro comum é colocar a prova social distante demais, depois de várias seções de texto institucional. Quanto mais cedo ela aparece na rolagem, mais rápido ela sustenta a decisão que a primeira dobra já colocou em jogo.

Serviços: organizar a oferta para quem ainda está decidindo

Nem todo visitante chega sabendo exatamente qual serviço precisa. A seção de serviços existe para isso: separar a oferta em blocos claros, com um título direto e uma frase de apoio por serviço, sem depender de um texto corrido que obriga a leitura de tudo para entender uma parte. Cada bloco deve linkar para a página específica daquele serviço, permitindo que quem já sabe o que quer pule direto para lá. Um exemplo de como estruturar essa divisão está em Site Institucional: O Que É, O Que Incluir e Quando Sua Empresa Precisa de Um.

Como funciona: o bloco que reduz a hesitação antes do formulário

Uma seção curta explicando o processo, por exemplo os passos de conversa inicial, proposta, execução e entrega, reduz uma fonte comum de hesitação: não saber o que acontece depois de clicar. Quanto mais abstrato for o serviço (consultoria, sistema sob medida, automação), mais essa seção pesa, porque o visitante não tem uma imagem mental pronta do que está comprando. O objetivo não é detalhar cada etapa do projeto, é dar segurança de que existe um processo definido, não uma promessa vaga.

Objeções: responder antes que o visitante pergunte

Toda decisão de compra carrega hesitações previsíveis: quanto custa, quanto tempo leva, o que acontece se o resultado não agradar, se há suporte depois da entrega. Uma home que ignora essas perguntas empurra o visitante para buscar a resposta em outro lugar, e nem sempre ele volta. Tratar objeção não é prometer o que não se pode cumprir, é ser direto sobre o que está incluído.

Preço é a objeção mais comum, e também a mais simples de reduzir com transparência. Não é preciso publicar uma tabela fechada, mas indicar uma faixa de valor evita a hesitação de quem tem medo de pedir um orçamento e descobrir depois que não cabe no bolso. Um site institucional, por exemplo, custa a partir de R$ 2.600: essa única frase, bem posicionada perto da objeção, já responde à pergunta antes que ela vire motivo para sair da página.

Contato: transformar interesse em conversa

A seção final precisa ser a mais fácil de usar da página inteira. Formulário curto (nome, contato, uma frase sobre a necessidade) ou um botão direto de WhatsApp, dependendo do que o público prefere usar primeiro. Cada campo a mais no formulário é uma chance de o visitante desistir no meio do preenchimento, então cada campo precisa justificar a própria existência. Veja as formas de contato disponíveis em Contato.

Contraste e legibilidade valem para a home inteira

Nenhuma das seções acima cumpre o papel dela se o texto não puder ser lido. O WCAG, guia de acessibilidade mantido pelo W3C, exige uma razão de contraste de pelo menos 4,5 para 1 entre texto e fundo para texto normal, e de 3 para 1 para texto grande, a partir de 18pt ou 14pt em negrito (W3C, WCAG 2.2, Contraste Mínimo). Título branco sobre imagem clara, botão cinza claro sobre fundo branco e texto de apoio muito fino são erros visuais comuns que reduzem exatamente esse contraste, na seção que mais precisa ser lida rápido: a primeira dobra.

Vale revisar a home inteira com essa régua, não só o topo. Um checklist seção por seção, incluindo pontos de acessibilidade e desempenho, está em Checklist de Lançamento.

No fim, cada uma dessas seções, da primeira dobra ao contato, serve ao mesmo critério que o Google usa para avaliar conteúdo: existe um público real que se beneficia dessa página, e ela foi pensada para essa pessoa, não para tentar agradar um mecanismo de busca.

Quer uma avaliação da sua home atual, seção por seção, com o que priorizar primeiro?

Falar no WhatsApp Ir para Contato

Perguntas frequentes

Quantas seções uma home precisa ter?

Não existe um número fixo, mas uma home funcional costuma reunir primeira dobra com proposta e chamada, prova social, serviços, um bloco de como funciona, resposta a objeções e contato. O que importa é cada seção cumprir uma função clara, não a quantidade de blocos empilhados na página.

A primeira dobra precisa ter vídeo de fundo?

Não precisa, e vídeo em autoplay costuma atrapalhar o LCP (Largest Contentful Paint), a métrica que o Google usa para medir quando o maior elemento da tela termina de aparecer. Segundo o web.dev, o valor considerado bom é de até 2,5 segundos, e um vídeo pesado dificulta chegar nesse tempo.

Prova social é necessária mesmo para um negócio novo, sem muitos clientes ainda?

O formato muda, mas o papel continua o mesmo: sustentar a promessa da primeira dobra com alguma evidência externa, como selo, certificação, parceria ou portfólio de projetos. Sem clientes suficientes para depoimentos, vale mostrar outro tipo de garantia real, nunca inventar número ou avaliação.

Formulário ou botão de WhatsApp: qual colocar na seção de contato?

Depende de como o público prefere iniciar a conversa. O formulário funciona bem quando a decisão exige mais informação antes do contato, e o WhatsApp funciona quando a resposta rápida importa mais. Muitas homes usam os dois, com o WhatsApp como caminho mais curto e o formulário como alternativa.

O que fazer se a home está lenta mesmo com boa hospedagem?

Verificar primeiro o que compõe o LCP daquela página, geralmente a imagem ou o texto da primeira dobra, e o peso desse elemento específico. Imagem sem compressão, fonte externa e scripts de terceiros carregados antes do conteúdo principal são causas comuns, independentemente da qualidade da hospedagem contratada.

Compartilhar:

Quer um projeto assim na sua empresa?

Me conta o que você precisa e eu te respondo em até 48h com um caminho claro, sem compromisso.

Falar no WhatsApp
Avaliações

O que os clientes dizem no Google

Google
Daniel Andrade (Consultor de SEO) profile picture
Daniel Andrade (Consultor de SEO)
Google star 1Google star 2Google star 3Google star 4Google star 5Trustindex verifica se a fonte original da avaliação é Google.
Mateus é um excelente profissional! Todos os projetos de criação de sites que a minha agência colocou nas mãos dele, ele simplesmente superou um nível máximo de minhas expectativas. Super recomendo!
Google
Thiago Harter profile picture
Thiago Harter
Google star 1Google star 2Google star 3Google star 4Google star 5Trustindex verifica se a fonte original da avaliação é Google.
Trabalho sensacional! Atendimento nota mil e entrega dentro do prazo
Google
Antonio vieira fleck profile picture
Antonio vieira fleck
Google star 1Google star 2Google star 3Google star 4Google star 5Trustindex verifica se a fonte original da avaliação é Google.
Um profissional que verdadeiramente se aprofunda no projeto, foi além das minhas expectativas!! Recomendo com certeza, dificil achar alguém assim hoje em dia
Google
Priscila Ramos profile picture
Priscila Ramos
Google star 1Google star 2Google star 3Google star 4Google star 5Trustindex verifica se a fonte original da avaliação é Google.
Excelente profissional, atencioso super indico trabalho maravilhoso
Google
Luiz Coimbra profile picture
Luiz Coimbra
Google star 1Google star 2Google star 3Google star 4Google star 5Trustindex verifica se a fonte original da avaliação é Google.
Trabalhei com o Mateus, extremamente responsável e dedicado! Recomendo!
Google
Elenilson Costa profile picture
Elenilson Costa
Google star 1Google star 2Google star 3Google star 4Google star 5Trustindex verifica se a fonte original da avaliação é Google.
Excelente profissional, já fiz vários projetos e sempre fui muito bem atendido, trabalho bem feito e fora que alguém muito gente fina...Recomendo demais.
Google
David Rodrigues profile picture
David Rodrigues
Google star 1Google star 2Google star 3Google star 4Google star 5Trustindex verifica se a fonte original da avaliação é Google.
Profissional dedicado, responsável e muito criativo. Já fiz alguns trabalhos com ele e gostei de todos