10 práticas recomendadas de layout de blog para 2022 - não deixe que layouts estranhos arruinem seu UX
Publicados: 2022-04-30Um sábio designer de experiência do usuário disse: “bom design é invisível”. Em outras palavras, se você ou seus usuários estão percebendo o layout do seu blog ou a experiência do usuário, provavelmente é um design ruim.
Pense em todos os sites, aplicativos e plataformas que usamos diariamente. Estamos pensando conscientemente na interface e na experiência do usuário?
A melhor interface do usuário (UI) e experiência do usuário (UX) é aquela que não nos impede de atingir nossos objetivos, seja comentar em uma postagem do Instagram, navegar em uma postagem de blog de formato longo ou inserir dados em um aplicativo da web.
Um blog bem projetado é essencial para os proprietários de empresas de comércio eletrônico de várias maneiras. Por exemplo, eles direcionam o tráfego para um site e ajudam a criar confiança com clientes em potencial. Eles também ajudam a promover produtos e serviços, levando a oportunidades de crescimento mais tarde.
Infelizmente, se você tiver um design estranho, descobrirá rapidamente que as pessoas ficarão menos propensas a ficar e ler seu conteúdo. Isso significa que nenhuma das coisas boas mencionadas acima provavelmente acontecerá.
"O meio é a mensagem." Isso significa que como você entrega seu conteúdo é tão importante quanto a qualidade do conteúdo em si.
Como seu blog é uma parte significativa do seu funil de marketing, uma boa UI/UX certamente afetará os visitantes de retorno e a receita.
Esta postagem do blog apresentará algumas das melhores práticas de layout para 2022 que manterão os usuários engajados, voltando para mais e recomendando seu blog para outras pessoas.
10 melhores práticas de layout de blog para UX em 2022
A tecnologia – incluindo as melhores práticas da web – parece mudar semanalmente. E com a nova tecnologia vêm novas e excitantes maneiras de consumir conteúdo.
Os usuários agora estão acostumados a consumir conteúdo em rajadas curtas, seja por meio de mídias sociais ou lendo blogs em seus telefones.
O layout do seu blog deve se adaptar a essas mudanças e ser fácil de ler, não importa onde ou como alguém o esteja consumindo.
Aqui estão algumas dicas para ter em mente ao projetar o layout do seu blog para otimizar o UX.
Dica nº 1: Use uma abordagem centralizada de “Centro de aprendizado”
Escrever extensivamente sobre um tópico específico é uma ótima maneira de criar autoridade tópica no Google e confiar em seu público.
No entanto, a forma como você organiza esse conteúdo em seu blog é tão importante quanto o conteúdo em si.
Digamos que você tenha escrito tudo o que há para saber sobre angariação de fundos para organizações sem fins lucrativos. Fantástico. Mas de que adianta isso para uma perspectiva sem fins lucrativos se o conteúdo relevante estiver sem tags, sem categorização e intercalado entre vários outros tópicos?
Isso não é ideal para o usuário que deseja consumir todo o seu conteúdo em um tópico específico de uma só vez. É muito melhor ter uma abordagem cumulativa em que tudo sobre esse tópico seja organizado em um só lugar – chamamos isso de abordagem de “centro de aprendizado”.
Essa abordagem é uma excelente maneira de aumentar o engajamento. Ele permite que os usuários encontrem e consumam facilmente todo o conteúdo que você tem sobre um tópico específico sem precisar fazer uma caça ao tesouro em todo o site. Ele também permite que você faça a promoção cruzada de outros conteúdos e aumente o tempo gasto em seu site.
Além disso, a abordagem do centro de aprendizagem provavelmente aumentará suas páginas por sessão.
Como é isso na prática? Você pode conferir o blog do MatterApp para bons exemplos. A empresa, que possui um aplicativo que dá elogios e feedback às equipes do local de trabalho, agrupou seu conteúdo de pilar e agrupamento em seis categorias em uma página. A página contém tudo o que um usuário precisaria pesquisar para saber mais sobre seu produto.
Dica nº 2: aproveite os elementos “pegajosos”
Os humanos são preguiçosos. Portanto, um dos princípios básicos do design é agregar o máximo de valor ao mesmo tempo em que faz com que o usuário trabalhe o mínimo possível.
Usar elementos on-page “pegajosos” é uma das melhores maneiras de facilitar isso e aumentar o engajamento em seu blog.
Elementos fixos permanecem visíveis na tela à medida que os usuários rolam para baixo. Isso significa que eles estão sempre acessíveis sem que o usuário precise rolar de volta para o topo da página.
Por exemplo, se você tiver uma frase de chamariz para se inscrever em sua lista de e-mail, usar um elemento fixo garantirá que ela esteja sempre visível e de fácil acesso.
Você pode ver um exemplo disso no blog da HubSpot . A empresa usa um call-to-action pegajoso no canto inferior direito da tela que incentiva os usuários a se inscreverem em sua lista de e-mail.
Você pode usar elementos pegajosos para uma variedade de outros propósitos, como:
- Botões de mídia social
- Menus de navegação
- Barras de pesquisa
- Widgets de bate-papo ao vivo
Moderação é a chave aqui. Muitos elementos pegajosos podem tornar a página sobrecarregada e confusa, o que acabará prejudicando a experiência do usuário.
Dica #3: Vá direto ao ponto
Ter conteúdo de formato longo é essencial para direcionar o tráfego para o seu blog e ter uma boa classificação no Google. No entanto, a maioria dos leitores quer respostas rápidas e não quer ouvir você falando sem parar sobre as virtudes de seus produtos ou serviços.
Por exemplo, se seus usuários querem apenas a resposta para a pergunta “o que é escrever em blog”, a maioria dos resultados de pesquisa para sua consulta envolve a leitura de guias longos e abrangentes. Embora os guias respondam às perguntas, o usuário terá que percorrer o conteúdo longo para encontrar a definição.
Outro exemplo é percorrer uma longa postagem de blog no Pinterest para chegar aos ingredientes e etapas da receita. Ainda bem que os especialistas culinários usam links que levam você direto para a receita, certo?
Esses exemplos são inegavelmente demorados e frustrantes para a maioria dos usuários, o que é o epítome de uma experiência de usuário ruim. Então, em vez disso, utilize caixas de resumo rápido de artigos para ir direto ao ponto.
Ter pequenas caixas contendo o resumo de todo o artigo é útil e uma ótima maneira de economizar o tempo de seus usuários ou leitores. Embora as caixas de resumo sejam ajustáveis para caber o conteúdo em qualquer lugar, colocá-las no início do artigo é uma excelente maneira de elaborar a resposta ou o conteúdo para os leitores.
Como bônus, responder clara e claramente às perguntas dos usuários aumentará a probabilidade de o Google colocar você em seu cobiçado resultado de “snippet em destaque”, que é o principal resultado em uma SERP do Google que destaca a resposta à pergunta de um usuário.
Dica nº 4: Utilize um design de cartão de blog
Para manter seu blog atualizado, você provavelmente está produzindo muitos artigos - muito bem! Mantem.
No entanto, isso pode levar rapidamente à confusão visual, especialmente quando você está tentando destacar todas as suas novas postagens de uma só vez na página principal do blog.
Então, qual é o melhor equilíbrio entre apresentar postagens na página principal do seu blog sem sobrecarregar o usuário? Quão grandes ou pequenas devem ser as miniaturas do blog e os links dos artigos?
Bem, não há uma resposta definitiva para essa pergunta, mas pelo menos sabemos que a abordagem mais eficaz é o layout de “cartão de blog”. Quanto às especificidades, recomendamos estudar e replicar as práticas de sites de publicação respeitáveis.
Medium.com fornece um excelente exemplo desse formato.
Há muitas vantagens em usar um design de cartão de blog, incluindo o seguinte:
- Eles são fáceis de digitalizar e digerir.
- Eles nos permitem reconhecer, lembrar e ler facilmente informações importantes.
- Eles permitem que você inclua muitas informações sem sobrecarregar o usuário.
- Eles podem ser facilmente reorganizados e reordenados, o que é ótimo para um design responsivo.
- Eles fornecem amplo espaço em branco, tornando-os visualmente atraentes e fáceis de navegar.
No entanto, os layouts devem ter tamanhos de fonte e imagens diferentes para distinguir claramente entre os elementos menos importantes e os mais importantes. Essa tática torna o design mais legível para os leitores.
Além disso, você pode incluir os seguintes elementos no design do cartão.
- Imagem em destaque
- Autor do blog (imagem)
- Categoria
- Título do Blog
- Links de compartilhamento social
- Data de postagem
- Trecho do blog
- Botão Leia mais
Mantendo esta lista em mente, vamos dar uma olhada na página inicial do Medium:
Observe cada “cartão” e todas as informações associadas. Quase todas as postagens do blog têm pelo menos o seguinte:
- Título do Blog
- Imagem em destaque
- Autor do blog
- Imagem do autor do blog
- Data de publicação
- Tempo de leitura
- A capacidade de marcar a postagem para mais tarde
Você provavelmente nunca notou todos esses elementos antes, não é? No entanto, você provavelmente aprecia a existência deles. Esse é um exemplo perfeito de um ótimo design sendo invisível.
Além disso, uma das melhores práticas que os especialistas em marketing de entrada da Impact recomendam para organizar os artigos no layout do cartão do blog é colocá-los em colunas de duas ou três.
Isso depende das informações que você está apresentando, mas, no geral, maximiza quantas postagens são vistas simultaneamente.
Dica nº 5: inclua o tempo de leitura
Ao criar conteúdo, você quer que as pessoas fiquem por perto e leiam. Mas se seus leitores sentirem que não têm tempo, eles provavelmente seguirão em frente. É por isso que uma das melhores coisas que você pode fazer é dizer a eles exatamente quanto tempo seu artigo levará para ser lido.
Essa tática é especialmente importante se seu público-alvo consiste em pessoas ocupadas que estão sempre em movimento. Ao dar-lhes um tempo de leitura estimado, você implementou uma estratégia que dá ao leitor um compromisso de tempo de antecedência que também é mais provável de trazê-los de volta para o conteúdo que é fácil de digerir em curtos períodos.
Então, se você quer que as pessoas fiquem por perto e leiam seu conteúdo, diga a elas exatamente quanto tempo vai demorar. Esse simples ato aumentará o engajamento e manterá as pessoas em seu site por mais tempo.
Dica nº 6: Use os espaços em branco a seu favor
Espaço em branco, também conhecido como espaço negativo, é o espaço em torno de elementos em uma página. É importante usar espaços em branco em seu layout para despertar o interesse visual do leitor e chamar a atenção para um conteúdo específico.
Encontrar o equilíbrio certo de espaço em branco é essencial para criar um layout bem projetado. Muito pouco espaço em branco pode fazer uma página parecer apertada e ocupada, o que pode ser esmagador para os usuários. Por outro lado, muito espaço em branco pode fazer uma página parecer inacabada ou pouco profissional.
Por exemplo, o TikTok utiliza muito espaço em branco. A quantidade que eles usam pode parecer boba em um site de negócios, mas é perfeita para direcionar toda a atenção para o vídeo na página.
Em geral, é melhor errar do lado de usar muito em vez de muito pouco espaço em branco. Isso ajudará a criar uma aparência limpa e espaçosa que é fácil para os olhos.
Então, quando se trata de layouts de blog, o espaço em branco é seu amigo. Isso pode ajudar a chamar a atenção para um conteúdo específico e tornar seu layout mais atraente visualmente.
Dica # 7: Não tenha barras laterais desordenadas
Este é um erro comum que muitos blogueiros cometem. Eles enchem suas barras laterais com ícones de mídia social, opt-ins, anúncios e outras porcarias aleatórias.
Essa prática não apenas faz com que tudo pareça ruim, mas também pode ser confuso e avassalador para os visitantes.
Também dá a impressão de que você se preocupa mais em vender algo do que agregar valor aos seus clientes, derrotando todo o propósito do conteúdo informativo e de construção de confiança.
Não trate sua barra lateral como uma gaveta de lixo. Em vez disso, atenha-se ao essencial, como ícones de mídia social e opt-ins. Isso ajudará a criar uma aparência mais simplificada, fácil de navegar e melhorar a experiência do usuário.
Dica # 8: Use a tipografia com sabedoria
Tipografia é como o texto fica em uma página física ou digital para os curiosos. Também envolve a manipulação do tipo de letra para tornar a forma escrita legível e atraente quando exibida.
Esse arranjo normalmente envolve pegar elementos de design como comprimento de linha e palavra, espaçamento, etc., ou tamanho de ponto e adicioná-los ou manipulá-los para torná-los agradáveis aos olhos e mais digeríveis.
Para um melhor impacto, é essencial usar a tipografia com sabedoria em seu layout. Você cria interesse visual e chama a atenção para um conteúdo específico quando o faz.
Por exemplo, você sempre desejará utilizar fontes maiores para os títulos e menores para o corpo do texto. Ou você pode querer utilizar uma fonte diferente para os títulos.
Idealmente, tamanhos de fonte entre 17px e 21px são considerados adequados para leitores digitais. Alguns tamanhos de fonte são naturalmente maiores em comparação com outros.
Além disso, é uma boa forma de limitar o número de fontes que você usa em uma página para no máximo três. Por exemplo:
- Use o primeiro estilo de fonte para o título das postagens.
- Use o segundo estilo de fonte para os títulos das barras laterais.
- Use o terceiro estilo de fonte para o corpo do post.
E uma última dica, certifique-se de que suas fontes sejam seguras para a web. Caso contrário, eles podem não carregar em alguns dispositivos. O Google Fonts é um repositório gratuito de fontes da web e é sempre uma aposta segura.
Dica nº 9: incorpore artigos relacionados
Outra maneira de fazer com que as pessoas fiquem por perto e leiam seu conteúdo é incorporar artigos relacionados ao seu layout.
Artigos relacionados são links para outras postagens de blog (internas e externas) semelhantes em tópico ou assunto. Ao incluir esses links, você pode manter as pessoas engajadas e lendo seu conteúdo por mais tempo.
Para encontrar artigos relacionados, você pode usar um plugin como o Yoast SEO. Este plug-in analisará sua postagem no blog e sugerirá artigos relacionados para você incluir.
Ou você pode fazer uma pesquisa manual acessando o Google e pesquisando por “[topic keyword] site:[yoursite.com]”. Contanto que o Google indexe seu site, isso revelará todas as páginas e postagens em seu site que contêm essa palavra-chave.
Por exemplo, se quiséssemos ver todas as páginas que escrevemos sobre blogs, eu digitaria a seguinte busca no Google: “blogging site:skuvault.com”.
As páginas resultantes provavelmente são ótimas candidatas para interligação.
Dica nº 10: use imagens de alta qualidade
É crucial usar imagens de alta qualidade e não bregas no layout do seu blog. Isso porque as pessoas são criaturas visuais que tendem a se envolver mais com imagens do que com texto.
De fato, estudos mostraram que as pessoas são mais propensas a lembrar de informações se forem apresentadas ao lado de uma imagem.
Portanto, ao escolher imagens para as postagens do seu blog, verifique se elas são de alta qualidade e relevantes para o tópico em questão.
Faça o seu melhor para evitar fotos genéricas. Às vezes, isso é tão simples quanto realizar algumas edições em uma foto existente para torná-la mais personalizada.
Um ótimo lugar para encontrar fotos elegantes e gratuitas é o Pexels .
Outras maneiras de aumentar o nível do UX do seu blog
Além das dez dicas que listamos, aqui estão algumas outras maneiras de melhorar a UX/UI do seu blog:
- Escolha um design escaneável : Blogar é muito diferente de escrever um livro ou trabalho acadêmico. Você pode tornar o layout do blog escaneável escrevendo seções curtas e precisas, evitando parágrafos longos, quebrando o texto com cabeçalhos e imagens relevantes e organizando seções usando subcabeçalhos e cabeçalhos.
- Marque seu layout : Branding é a chave para o marketing de um negócio de sucesso e funciona da mesma forma para o layout do seu blog. O blog que você cria deve refletir a sensação e a aparência da sua marca. Isso significa que se sua página inicial tiver um tema ou design simples, é uma boa ideia mantê-lo igual para o layout do seu blog.
- Use alinhamento vertical : elementos mal projetados se destacam como um polegar dolorido. Por exemplo, quando as imagens e o texto parecem deslocados do resto da coluna, isso se torna uma distração e parece pouco profissional. Além disso, parágrafos e fotos devem ter a mesma largura para continuidade visual.
- Inclua uma barra de pesquisa : se você tiver muito conteúdo em seu site, pode ser difícil para as pessoas encontrarem o que estão procurando. É importante incluir uma barra de pesquisa no layout do seu blog. Dessa forma, as pessoas podem encontrar rápida e facilmente as informações que procuram.
- Destaque os autores do seu conteúdo : se você tiver vários autores em seu blog, é importante destacar seus nomes e incluir uma foto de alta qualidade ao lado de suas postagens. Essa abordagem humaniza tudo e ajuda a criar confiança com seus leitores. Também facilita a localização de outros conteúdos do mesmo autor e ajuda o Google a determinar seu EAT (experiência, autoridade, confiança).
- Torne seu site compatível com dispositivos móveis: é 2022. Não é negociável garantir que o layout do seu blog seja compatível com dispositivos móveis. Felizmente, todos os layouts de blogs modernos de provedores respeitáveis (WordPress, Squarespace, Shopify) incluem um layout compatível com dispositivos móveis imediatamente. Se você não tiver um layout compatível com dispositivos móveis, terá problemas além do escopo desta postagem.
Aí está! Utilize essas dicas para criar um layout de blog matador que mantenha os leitores voltando para mais.
Não se esqueça do controle de estoque
Se você seguir nossos conselhos e implementar essas dicas de UX, prepare-se para um aumento no número de leitores, tráfego e vendas (de nada!).
Se você é uma loja de comércio eletrônico, precisará de um bom sistema de estoque para gerenciar esse crescimento.
O SkuVault existe para ajudar empresas de todas as formas e tamanhos a otimizar e agilizar o trabalho tedioso envolvido no controle de estoque.
Clique aqui para obter mais informações sobre as formas específicas com que nos relacionamos com os empresários para ajudá-los a aumentar seus resultados (e salvar sua sanidade).