Explorando as tendências de design de layouts de página inicial no estilo de revista

Designers que estão prestando atenção em blogs online e fontes de notícias terão notado a tendência crescente de layouts de sites no estilo de revista. Especificamente, listagens de notícias onde você pode encontrar uma dúzia de histórias, todas relacionadas a diferentes tópicos, agrupadas em uma seção. É um estilo favorito porque os leitores vão folhear esses feeds de notícias individuais procurando uma manchete para chamar sua atenção.

Neste artigo, quero aprofundar a popularidade desse estilo de design. Mais especificamente, aprofundando os layouts da página inicial das revistas que se tornaram mais dinâmicos e influentes em comparação com os sites de blogs de 5 a 10 anos atrás. Inúmeras revistas colocaram suas publicações online para apoiar um público mais amplo. Os benefícios são enormes se você conseguir organizar muito conteúdo de maneira abundante e de fácil acesso.

A sensação de uma revista

Você notará que a maioria desses sites se parece com uma revista digital. Não há papel para segurar ou páginas para virar, mas as cores e a tipografia espelham uma página impressa. Claro, isso nem sempre é o caso, mas você pode achar essa estética de design como o ajuste perfeito.

Os leitores que entendem os designs das revistas normalmente terão mais facilidade em navegar no site. Você não precisa se preocupar tanto em criar uma navegação de cabeçalho além das categorias, e até mesmo elas podem ser anexadas a uma barra lateral. A maior parte do seu espaço em branco deve ser ocupada por manchetes e notícias em destaque.

O layout do site para Noivas faz um excelente trabalho transmitindo a sensação de revista impressa. Cada história tem uma imagem em miniatura típica, e há até mesmo blocos no meio da página dividindo notícias em destaque e pequenos anúncios. Há também um formulário de pedido para retirar cópias físicas impressas que podem ser enviadas diretamente para sua casa! Este formulário de inscrição é uma boa ideia se você planeja oferecer esse serviço de remessa, que pode fornecer uma renda extra para o negócio.

A área inferior do rodapé também é normalmente o que você esperaria em uma revista. Simples, contraste natural para leitura e contém todos os links que você esperaria encontrar em uma navegação de site. Acho que o fundo branco com texto escuro é uma solução fácil, pois permite que os leitores imprimam sua revista sem desperdiçar tinta. Assim, todo o site quase parece uma revista impressa transferida para conteúdo digital.

Blocos de postagem incorporados

Um estilo de design interessante é construir um layout de revista com conteúdo ajustado em cada coluna. Alguns leitores ficarão irritados ao percorrer tantos títulos embalados em um modelo de caixa exclusivo. No entanto, a apresentação está acima de sólida, e você pode deixar uma marca nos leitores que estão procurando as últimas notícias.

O site da Clutch Magazine é um bom exemplo em que a barra lateral esquerda contém notícias secundárias. Últimos comentários, artigos de opinião, anúncios e alguns outros widgets serão exibidos aqui. Isso deixa espaço para duas colunas de novos artigos organizados cronologicamente. O layout também é um design de carregamento lento que anexará automaticamente novas páginas via Ajax.

As novas postagens eventualmente ultrapassarão a barra lateral e preencherão toda a página inicial com novos conteúdos. Esse estilo só pode funcionar se você deixar espaço suficiente para que cada postagem seja gerenciada sozinha. O Clutch usa miniaturas e bordas ao redor de cada título para distingui-los. Eu sinto que isso só melhora o desejo “incorporado” de afundar o conteúdo em sua página. Observe que a barra de ferramentas de cabeçalho fixo também fornece acesso direto aos links de navegação e ao formulário de pesquisa.

Notícias de rolagem infinita

Eu quero voltar e revisitar essa ideia de notícias de rolagem infinita. O recurso não parece tão grande a princípio. Mas depois de testar um layout que inclui essa interface de carregamento lento, você nunca mais vai querer voltar. O Tumblr e o Pinterest foram os primeiros a adotar entre as redes sociais, e desde então tem crescido rapidamente.

UGS Mag é outro exemplo que usa o efeito de rolagem infinita em sua página inicial. A única desvantagem é que os leitores não conseguem copiar e compartilhar links permanentes para as diferentes páginas de arquivo. Obviamente, cada artigo terá um URL exclusivo, mas é lamentável como as listagens de páginas reais nunca terão seu próprio URL. Essas páginas individuais não são muito populares, então não há muito a perder, mas leve isso em consideração para cada projeto de blog/revista em que você trabalha.

O layout da página inicial do UGS se encaixa perfeitamente com cada listagem de postagem porque as miniaturas ficam bem ajustadas à caixa. Portanto, cada artigo é distinto e se destaca da multidão, mas ainda se reúne para um padrão de caixa estranho e frenético. Leve em consideração as necessidades pessoais ao planejar esses vários designs de layout e pergunte a si mesmo o que melhor se adequa ao site.

Acho que vale a pena adicionar diversão a este tópico por causa de sua implementação. Ao rolar até o final da página, você notará um link no rodapé que diz “LOAD MORE”. Em vez de buscar automaticamente novas histórias, você tem a oportunidade de examinar alguns dos links do rodapé e talvez decidir se deseja que outra página seja carregada. Essa interface de carregamento lento dá controle ao usuário, o que é uma solução muito melhor.

Miniaturas mistas com títulos

Para entrar no território do jornal, considere designs de página inicial que apresentam uma grande coleção de novos artigos. Eles podem ser misturados em diferentes categorias ou colunas na página, e você terá postagens maiores no topo usando tamanhos de fonte muito maiores. Normalmente, esses títulos representam postagens em destaque que são promovidas pelos editores.

O conceito de misturar um feed de notícias da página inicial é escalonar conteúdo importante sem perder o apelo visual. Isso é feito com maestria no site da WWD Magazine usando várias colunas diferentes. Os principais “Top Stories” reportam ao centro usando apenas uma única miniatura. Mas você pode rolar pelo controle deslizante de imagens de publicações recentes, que também está localizado na parte superior da página.

Dar a seus leitores uma série de seleções para escolher os manterá interessados ​​por mais tempo. E manter os visitantes envolvidos é como você pode ligá-los a tópicos mais interessantes que podem ser encontrados mais profundamente no site. O layout da revista WWD é ótimo para implementar uma ampla variedade de listagens de notícias. Mas ele tem um design um pouco confuso, que poderia ser melhor organizado mantendo mais artigos em destaque no topo para chamar a atenção.

A maneira mais fácil de expandir sua compreensão dos efeitos de UI/UX é encontrar sites de revistas semelhantes que já estejam online. Analise esses exemplos com uma mente crítica, considerando os aspectos ótimos e os não tão bons que poderiam ser melhorados. Em seguida, aplique sua visão em seus projetos para capitalizar o que os outros estão fazendo de errado (ou poderiam estar fazendo melhor).

Pensamentos finais

Ao projetar o layout de sua revista/blog, espero que você considere algumas dessas ideias. Novos lançamentos devem ser mais focados na criação de conteúdo antes de aplicar efeitos interessantes de interface do usuário. No entanto, um belo design chamará a atenção quase imediatamente e atrairá muitos novos leitores interessados ​​​​para sua página inicial.

À medida que avançamos, espero ver muito mais variedade nas revistas digitais online. Os métodos de publicação mais antigos exigem muito tempo e papel. Distribuir notícias pela Internet é uma situação muito mais lucrativa e lucrativa. A chave para construir sua reputação é através de uma marca sólida e muito conteúdo excelente.