Descubra os novos padrões para construção de Landing Pages

Os padrões criados pela Seox para o Gutenberg oferecem uma forma prática e intuitiva de construir landing pages com rapidez e consistência visual. Eles foram pensados para garantir uma experiência ágil na montagem de páginas, reduzindo o tempo de implementação e mantendo a coerência identidade entre diferentes layouts. Para acessar um padrão no editor, o usuário pode clicar no ícone de inserção de blocos no canto superior esquerdo da tela e depois selecionar a aba de padrões. Outra opção é digitar uma barra (/) e escrever o nome do padrão desejado diretamente na área de edição.

Pensando em facilitar a criação de diferentes tipos de landing pages, a equipe da Seox desenvolveu uma série de padrões organizados por categorias. Entre elas estão seções, banners, cabeçalhos, carrosséis, vídeos e outras estruturas comumente utilizadas nesse tipo de aplicação. Essa divisão foi feita para auxiliar na localização dos blocos e agilizar o fluxo de criação do conteúdo.

Foram criadas algumas opções de headers e footers, considerando que, através do bloco de styleguide, é possível desativar a visualização do cabeçalho padrão do site. Isso permite a criação de headers específicos para cada landing page, garantindo maior flexibilidade de design e alinhamento com os objetivos da página.

Para alterar o background desses elementos, basta acessar a primeira camada do bloco e, na barra lateral direita do editor, clicar na aba “Estilo” e depois em “Background”. A partir daí é possível ajustar cores, imagens ou gradientes conforme a necessidade da composição.

Benefícios desses padrões:

• Permitem alinhar o visual da landing page com campanhas ou momentos específicos sem alterar o cabeçalho global do site.
• Ajudam a criar experiências imersivas ao longo da página.
• Facilitam a organização de elementos funcionais como menus, contatos ou chamadas para ação de forma 100% personalizada

Alguns padrões foram criados com a função de servir como o primeiro scroll da página, geralmente o principal ponto de atenção para o usuário logo ao acessar a landing page. Essa área é estratégica para retenção, pois permite que a mensagem principal seja apresentada com clareza, impactando rapidamente o usuário e incentivando-o a continuar navegando.

Dentro dessa categoria, estão disponíveis opções de Banner Hero, que ocupam quase toda a altura da tela. São ideais para apresentar chamadas importantes, destaques visuais e elementos de conversão logo no início da experiência. Eles foram pensados para garantir flexibilidade visual sem a necessidade de montar o layout do zero.

Assim como em outros padrões, é possível personalizar o background desses banners. Para isso, basta selecionar a primeira camada do padrão inserido e acessar a barra lateral direita do editor. Na aba “Estilo”, clique em “Background” e escolha a cor, imagem ou gradiente que deseja aplicar.

Principais benefícios dos Banners:

• São otimizados para diferentes contextos e campanhas, sem necessidade de ajustes técnicos.
• Garantem forte impacto visual logo nos primeiros segundos de navegação.
• Permitem personalização rápida da aparência da landing page.

Os padrões de seções simples foram criados para atender às aplicações mais básicas dentro das landing pages. Eles incluem combinações essenciais como título, parágrafo e imagem, e são ideais para montar blocos de conteúdo direto e objetivo ao longo da página.

Para usuários com proficiência na utilização do bloco container, esses padrões agilizam o setup visual inicial, permitindo que se crie rapidamente segmentos estruturados e visualmente organizados sem partir do zero. Além disso, foram configurados com comportamento responsivo, garantindo uma boa experiência de leitura em diferentes tamanhos de tela.

Principais benefícios das Seções simples:

• Estrutura responsiva pronta para uso, sem necessidade de ajustes manuais.
• Flexibilidade para expansão visual por quem já domina o uso de containers.

Para dar suporte à exibição de diferentes tipos de mídia e blocos informativos, a Seox desenvolveu uma série de padrões voltados para seções de conteúdo enriquecido. Esses padrões abrangem combinações de imagem, vídeo e carrossel, facilitando a criação de experiências visuais mais dinâmicas e completas.

Entre as opções disponíveis, estão carrosséis já configurados com comportamento adequado para desktop e mobile, sem necessidade de ajustes adicionais. Também há padrões dedicados a blocos de vídeo, com versões otimizadas para vídeos em formato padrão de landing page e para exibição de shorts do YouTube, garantindo versatilidade no uso de diferentes formatos audiovisuais.

Além disso, foram criados carrosséis de blocos de cards que permitem a personalização de conteúdo com imagem, título e descrição. Esses carrosséis são ideais para apresentar benefícios, produtos, etapas ou qualquer informação que se beneficie do formato em slides.

Finalizando essa categoria, foi adicionado um segmento específico para o bloco de FAQ, com perguntas e respostas. Ele é pensado para sanar dúvidas frequentes diretamente na landing page e melhorar a experiência do usuário sem sobrecarregar o layout.

Principais benefícios das Seções de conteúdo:

• Estruturas que facilitam a organização de informações complexas de forma clara.
• Ampliação da expressividade visual da landing page com blocos prontos.
• Suporte a formatos modernos como vídeos curtos e carrosséis adaptáveis.