servindo como porta da frente virtual da sua empresa, esta página é responsável por atrair a maior parte do tráfego do seu site. Ainda assim, apesar de sua proeminência, muitas empresas lutam para otimizá-lo adequadamente.

você vê, sua página inicial precisa usar muitos chapéus. Em vez de tratá-lo como uma página de destino dedicada construída em torno de uma ação específica, ele deve ser projetado para atender a diferentes públicos, de diferentes origens. E para fazê-lo de forma eficaz, ele precisa ser construído com propósito. Em outras palavras, você precisará incorporar elementos que atraem tráfego, educam visitantes e convidam conversões.

para melhorar o desempenho da sua página inicial, confira esses elementos que cada página inicial deve ter.

 Download Grátis: 77 Exemplos Brilhantes de Web Design

12 Elementos Críticos para Cada Site a página inicial Deve Ter

Salvar

12 elementos fundamentais para um site página inicial infográfico

Salvar

Compartilhe esta Imagem Em Seu Site

o Que Você Deve Incluir no Seu Website Design da home page

Manchete

Dentro de três segundos, um site precisa para contar aos visitantes o que a empresa tem para oferecer. É aí que entra sua manchete. Pode ser apenas algumas palavras, mas é uma das cópias mais importantes do seu site.

muitos tipos de pessoas podem visitar o seu site, e você vai ser duramente pressionado para encontrar algumas palavras que chegam em casa para todos. Em vez disso, escreva seu título para segmentar um terço das pessoas com maior probabilidade de serem felizes com seu produto.

mantenha o título claro e simples. O título do Dropbox é um ótimo exemplo: “tudo que você precisa para o trabalho, tudo em um só lugar.”É simples, mas poderoso-não há necessidade de decodificar o jargão para descobrir o que o Dropbox realmente faz.

página inicial do site do Dropbox

subtítulo

seu subtítulo deve complementar o título, oferecendo uma breve descrição do que você faz ou do que oferece. Isso pode ser feito de forma eficaz, concentrando-se em um ponto de dor comum que seu produto ou serviço resolve.

aqui está um exemplo de um ótimo subtítulo do Mirror: “escondendo-se à vista.”Ele aprimora o ponto de venda principal da Academia mirror: É um ginásio completo em casa, personal trainer e plano de treino, tudo no conforto da sua casa, sem ocupar uma preciosa metragem quadrada com equipamentos. Espelho site homepage subtítulo que lê escondendo à vista

para otimizar suas manchetes para celular, use fontes maiores para dar aos visitantes uma melhor experiência. Fontes pequenas podem forçar os visitantes móveis a beliscar e ampliar para ler e interagir com o conteúdo do seu site. O nosso conselho? Use as opções de cabeçalho em seu editor de página. Os títulos H1 são perfeitos para títulos de página — deve haver apenas um H1 em uma página. Os subtítulos devem seguir a ordem da hierarquia, H2, H3 … H6, e assim por diante. Você pode ter vários desses títulos, apenas certifique-se de que eles estão em ordem. Por exemplo, você não vai querer pular de um H1 para um H3 — escolha um H2.

chamadas primárias para ação

o objetivo da sua página inicial é obrigar os visitantes a se aprofundarem no seu site e movê-los pelo funil. Inclua duas a três chamadas à ação acima da dobra que direcionam as pessoas para diferentes estágios do ciclo de compra — e coloque-as em locais fáceis de encontrar.

esses CTAs devem ser visualmente impressionantes, idealmente em uma cor que contrasta com o esquema de cores da sua página inicial enquanto ainda se encaixa no design geral. Mantenha o resumo da cópia — não mais do que cinco palavras-e orientado para a ação, por isso obriga os visitantes a clicar no que você está oferecendo. Exemplos de cópia CTA são “Inscrever-se”, “marcar uma consulta” ou ” experimentá-lo gratuitamente.”

o site da Afterschool HQ apresenta dois CTAs acima da dobra, ambos voltados para diretores de programas que estão interessados em promover seus programas pós-escola para famílias no site. A nota abaixo do CTA mais longo “crie seu perfil gratuito” dá aos visitantes o empurrão de que precisam para criar uma conta — o primeiro passo para se tornarem um provedor de HQ pós-escola.

imagem de suporte

a maioria das pessoas é visual. Certifique-se de usar uma imagem (ou mesmo um vídeo curto) que indique claramente o que você oferece. Use imagens que capturem a emoção, impulsionem a ação e contem visualmente a história sobre a qual você está escrevendo.

para otimizar suas imagens para usuários móveis, use imagens de alta qualidade que tenham um tamanho de arquivo reduzido. (Os clientes da HubSpot não precisam se preocupar com isso, pois as imagens carregadas no software da HubSpot são compactadas automaticamente. Caso contrário, ferramentas como TinyPNG farão o truque.) Além disso, sempre Adicione texto alternativo às suas imagens para torná-las mais acessíveis aos visitantes que usam leitores de tela e para elevar seus esforços de SEO.

a página inicial do 4 Rivers Smokehouse é um ótimo exemplo de imagens emocionais: apresenta uma série de vídeos curtos, de alta definição e de dar água na boca que tocam em um loop atrás de um título simples, subtítulo e CTA primário:

4 rivers smokehouse página inicial do Site imagem em destaque com um hambúrguer de queijo

benefícios

não é apenas importante descrever o que você faz, mas por que o que você faz importa. Os clientes em potencial querem saber sobre os benefícios de comprar de você, porque é isso que os obrigará a ficar por perto.

mantenha a cópia leve e fácil de ler e fale o idioma de seus clientes. O Evernote faz um ótimo trabalho ao listar benefícios em sua página inicial de uma forma atraente, visualmente agradável e fácil de entender:

 Evernote website homepage benefícios

prova Social

prova Social é um poderoso indicador de confiança. Seu produto ou serviço pode ser o melhor do mundo, e não há problema em afirmar isso — é só que as pessoas podem não acreditar em você, a menos que o ouçam de outras pessoas também. E é exatamente isso que a prova social faz.

inclua apenas algumas de suas melhores citações (curtas) na página inicial e link para estudos de caso, se aplicável. Adicionar um nome e uma foto dá a esses depoimentos mais credibilidade. Lessonly prega isso em sua página inicial com depoimentos brilhantes de clientes reais.

lessonly página inicial do site depoimentos e comentários

navegação

o design e o conteúdo em sua navegação na página inicial podem significar a diferença entre uma conversão de site e um salto. Para diminuir a taxa de rejeição, dê aos seus visitantes um caminho claro para as páginas de que precisam diretamente da página inicial. Torne o menu de navegação visível na parte superior da página e organize os links em uma estrutura hierárquica.

ninguém conhece seu site melhor do que aqueles que ajudaram a projetá-lo, portanto, certifique-se de realizar testes de usuário para garantir que seja simples e intuitivo para os visitantes encontrarem o que estão procurando em seu site. Inclua uma caixa de pesquisa, Se puder. (Leia esta postagem do blog para obter dicas de navegação no site mais úteis.)

aqui está um exemplo de um design de navegação claro e bem estruturado da Página Inicial do Husky’s Pizza Beeria:

navegação na página inicial do site Slim e huskys

oferta de conteúdo

para gerar ainda mais leads de sua página inicial, apresentam uma oferta de conteúdo realmente excelente, como um whitepaper, ebook ou guia. As pessoas que podem não estar prontas para comprar podem preferir baixar uma oferta que lhes dê mais informações sobre um tópico em que estão interessadas. Se você precisa de inspiração, aqui estão vários tipos de conteúdo diferentes para escolher.

chamadas secundárias para ação

inclua CTAs secundários em sua página inicial para oferecer oportunidades adicionais de conversão para clientes em potencial que não estão interessados em seu objetivo principal. Pense neles como o plano de contingência: eles oferecem outro caminho para os visitantes que ainda não estão prontos para algo tão alto quanto você está pedindo.

enquanto seus CTAs primários devem estar acima da dobra, coloque CTAs secundários abaixo da dobra para dar aos visitantes coisas para clicar quando eles rolam para baixo. Por exemplo, abaixo da dobra na página inicial do Spanx, você encontrará três chamadas para ação claramente rotuladas que dão às pessoas que rolaram até agora mais algumas opções para clicar. Esses CTAs secundários são para dois tipos diferentes de conversões: um na extrema esquerda por US $20 de desconto e outro, “compre agora” para explorar o catálogo online.

página inicial do site Spanx CTAs secundários

recursos

além dos benefícios, liste alguns dos seus principais recursos. Isso dá às pessoas mais compreensão do que é fornecido por seus produtos e serviços. Mais uma vez, mantenha a cópia leve e fácil de ler. O Dropbox for Business, por exemplo, não se coíbe de exibir uma matriz de recursos diretamente em sua página inicial abaixo da dobra.

 página inicial do dropbox for business recursos

recursos

novamente, a maioria dos visitantes do seu site não estará pronta para comprar … ainda. Para pessoas que procuram mais informações, ofereça um link para um centro de recursos onde possam navegar por informações relevantes. Isso não apenas os mantém em sua página da web por mais tempo, mas também ajuda a estabelecer sua credibilidade como um líder de pensamento em seu setor.

Lovesac adiciona um link de recursos ao rodapé abaixo da dobra. Observe como cada uma dessas secundário Cta tampa de vários estágios no ciclo de compra: um cartão de crédito link para ajudar os clientes a comprar os seus móveis, facilmente, uma amostra de tecido de guia para aqueles que ainda estão procurando a cor perfeita antes de fazer uma compra, e um catálogo on-line para as pessoas que estão no mercado de móveis novos, mas ainda não está pronto para fazer uma compra.

 página inicial do site lovesac com recursos e CTAs no rodapé

indicadores de sucesso

além das histórias de sucesso do cliente, os prêmios e o reconhecimento também podem ajudar a inspirar uma boa primeira impressão. Sua empresa é um restaurante aclamado pela crítica? Você foi eleito o melhor novo aplicativo Este ano? Deixe seus visitantes homepage saber de suas realizações. Como prova social, Isso dará mais credibilidade ao seu negócio para aqueles que não o conhecem.

na página inicial do Calendly, por exemplo, você encontrará os nomes de organizações famosas que as reconheceram, como Gartner e Dropbox.

página inicial do site do Calendly

uma página inicial que vale a pena visitar

a página inicial do seu site é a primeira introdução que cada visitante terá para o seu negócio. Antes de se decidirem a se tornar um cliente, eles revisarão sua página inicial para ter uma ideia do que você vende, por que isso é importante para eles e como eles podem se beneficiar do que você tem a oferecer.

faça uma primeira impressão brilhante com uma página inicial que incorpora os elementos descritos acima. E para mais inspiração, confira exemplos impressionantes de homepages baixando o lookbook gratuito abaixo.

Nota do Editor: este post foi publicado originalmente em janeiro de 2012 e foi atualizado para frescor, precisão e abrangência.

exemplos de página inicial brilhante, blog e design de página de destino

Deixe uma resposta

O seu endereço de email não será publicado.