Índice

Falando de boas práticas na construção de páginas...

O recurso Pages Beta possibilita a construção de modernas páginas em poucos cliques e sem a necessidade a necessidade de conhecimentos técnicos ou programação. Porém, é importante seguir algumas boas práticas, para agilizar a publicação das páginas e deixar o site ainda mais atrativo.

Preste atenção na URL

Forneça uma URL que seja facilmente interpretável pelo usuário, utilizando palavras chaves. Por exemplo: guia-da-marca.
Complemente as URLs com títulos para incentivar o usuário a clicar neles.
Utilize palavras curtas, porém superiores a três caracteres. Evite utilizar caracteres especiais (com exceção de hífen para separar as palavras).

Identifique sua página com o logo

Muitos usuários navegam com várias guias abertas, então sua página precisa se diferenciar! Utilize um logo personalizado para o seu site - procure incluir uma imagem 48x48px no formato .ico.

Atente-se aos conteúdos externos

Os conteúdos externos são componentes de fora do Pages Beta, por exemplo: vídeos do YouTube, artigos, páginas de outro site, etc. Eles multiplicam os recursos do seu site.
Quando for integrado ao Forms Beta, é preciso atentar-se ao tamanho mínimo de altura, pois caso a altura não seja a adequada será inserido um scroll na página.
Evite colocar URLs com muitos parâmetros que comprometam o comportamento padrão de uma URL. Por exemplo: para indicar a URL de um ponto no Google Maps, você pode utilizar um encurtador de URLs para simplificá-lo.
Verifique se a URL que você deseja inserir possibilita o uso em outro contexto.
Sempre que possível, procure inserir o conteúdo externo por último: o peso da página externa pode atrapalhar a montagem de sua página e afetar a experiência do usuário.

Capriche nos conteúdos de texto

A opção Habilitar container deve ser utilizada se você deseja que o seu componente preencha toda a largura da página.
Utilize imagens para chamar a atenção, mas prefira imagens com proporção 4:3 ou 4:4 para evitar que fiquem desconfiguradas.
Escolha títulos com palavras chaves, que atraiam a atenção de quem estiver fazendo uma leitura rápida.
Lembre-se que seu site pode ser acessado por diversos dispositivos. Então procure inserir no máximo 4 boxes de texto por componente, para evitar a quebra de linha devido à responsividade do layout.

Identifique-se no rodapé

Insira os direitos de marca registrada com o nome de sua empresa.
Insira os links de suas redes sociais, para demonstrar maior representatividade na web.

Utilize galeria de imagem

Escolha títulos com palavras chave, e que combinem com todas as imagens da galeria.
Habilite o espaçamento entre as imagens, caso desejado.
Insira legendas nas imagens (por exemplo, os direitos autorais).
As imagens anexadas na galeria devem comportar nas resoluções recomendadas, assim não perderão qualidade ao serem publicadas.

Destaque conteúdos com os banners

Habilite as setas ou os bullets quando houver mais de um slide no banner, para aumentar a navegabilidade do usuário.
Deixe uma mensagem objetiva para o visitante, desse modo a leitura fica mais agradável atraindo a atenção para clicar.
Procure imagens que representem bem o que você quer dizer. Você pode optar por inserir um vídeo também. Mas lembre-se: tanto em imagens quanto vídeos, procure utilizar resolução superior à 720p e inferior a 1080p, com boa qualidade e proporções widescreen (16:9). Procure ferramentas de otimização de imagem para evitar que fique pesado carregá-las dentro do slide.
Personalize a aparência dos seus banners: configure o alinhamento do conteúdo e dos botões, insira uma máscara de cor caso não tenha contraste suficiente, para facilitar a leitura do texto.

Utilize parágrafos para incluir textos relevantes

Escolha títulos sucintos.
Ao inserir a imagem, sempre escolha uma opção que represente bem e chame a atenção para o parágrafo. Dê preferência para imagens com proporção 4:3 para manter a qualidade da imagem.
Ao informar a descrição, opte por textos que instiguem o leitor a saber mais sobre aquele assunto.

Organize o menu do seu site

A função do menu é facilitar a navegação pelos conteúdos do seu site, por isso, dê preferência em utilizar palavras objetivas e evite inserir mais que dez itens de menu.
Evite colocar logos muito grandes - a imagem usada no logo do menu deve ter no máximo 50px de altura.

Utilize seções para dividir os conteúdos

Use títulos com palavras chave para chamar a atenção do usuário; insira subtítulos objetivos, que passem a mensagem em poucas palavras.
Procure uma imagem que represente o que você gostaria de passar para o usuário. Dê preferência a imagens com boa qualidade e nas proporções widescreen (16:9). A imagem a ser anexada no componente de seção deverá comportar nas resoluções recomendadas (720p e 1080p), assim a mesma não perderá qualidade.
Habilite o efeito parallax, uma funcionalidade que move a imagem do fundo, criando uma sensação de profundidade ao percorrer a página.

Esta documentação é válida a partir da atualização 1.6.5 - Liquid. Se você utiliza uma atualização anterior, ela pode conter informações diferentes das quais você vê na sua plataforma.