Modelos de site

Seu site já tem uma estrutura visual adequada? Aqui sugiro dicas de modelos de site para você visualizar o melhor para seu negócio!

Após elaborar um briefing de seu projeto, é hora de trabalhar as referências coletadas e iniciar a criação do site. Dentre vários tipos de modelos de site, é preciso escolher o que melhor se adequa a seu negócio.

Neste post comentarei sobre quatro dos modelos de site (ou seja, estrutura visual de um site) que mais são trabalhados. Há diversos outros modelos (alguns casos necessitam de um modelo único, específico), mas normalmente a base são os que citarei.

Modelos de site

Indicarei um exemplo para cada modelo, assim você poderá navegar e entender melhor cada um. Conforme comentei, a ideia deste post é comentar sobre a estrutura visual dos projetos – ou seja, o padrão que esses modelos de site em específico costumam seguir. Outros detalhes como informações/seções imprescindíveis em um site, e até mesmo funcionalidades como galerias de imagens ou slideshows são assuntos extensos e variam caso a caso.

Sendo assim, vamos aos modelos!

Leia também: Layout para site

Tradicional

modelo de website
Modelo de site “Tradicional”: Via Hospedagem – desenvolvimento por mim pela ANDALE!

Em um modelo de site tradicional, a estrutura costuma ser bem simples, como a do exemplo acima. Um topo com todos os links principais para navegação no site, uma página inicial com todas as principais informações sobre a empresa e chamadas para serviços/produtos (em alguns casos a home pode trazer um banner em formato de slideshow, por exemplo, destacando as principais seções).

Nas páginas internas, normalmente esse modelo traz uma barra lateral (ou “sidebar”) com ferramentas, links úteis e chamadas/destaques. Na Via Hospedagem também há um blog, o que pode ser uma seção de notícias, por exemplo.

Portal

modelos de site responsivo
Modelo de site “Portal”: A globo.com trabalha com design responsivo

Um portal certamente é o tipo de site mais complicado de se criar e desenvolver. Com várias categorias, subcategorias, seções e até blogs internos e “subsites” (como é o caso da globo.com, onde na verdade esses subsites são subportais), um portal deve ser bem trabalhado para trazer os principais destaques na página inicial, que deve ser bem “livre” (por exemplo, alguns portais costumam adicionar mais destaques em épocas de eventos, e para isso não prejudicar as outras áreas, a estrutura da página inicial é alterada – normalmente alguns banners são adicionados no topo e o número de chamadas de seções menos importantes é reduzido).

Gosto muito desse exemplo porque, além do portal globo.com ter inovado com o design de portais no lançamento do G1, as cores são muito bem trabalhadas (cada seção tem sua cor), o que deixa a navegação bem intuitiva. A página interna de um portal não é muito diferente de um post em um blog: além do conteúdo, há uma série de posts relacionados e uma seção de comentários, uma barra lateral com outros conteúdos, links e anúncios. A ideia é “prender” o leitor no site, fazendo com que ele navegue em outras publicações.

Outra coisa que não falta em portais são anúncios, é claro, principalmente para se manter um site desse porte. Em alguns casos a publicidade é extremamente invasiva, como é o caso do UOL (que melhorou muito de uns tempos pra cá – antigamente 50% da página era composta de anúncios). O ideal é que ela seja trabalhada de forma que esteja sempre visível e fácil de ser acessada, mas que nunca atrapalhe a leitura nem a navegação.

Hotsite

modelo hotsite
Modelo de site “Hotsite”: Dexter – criação e desenvolvimento por mim pela Agência 2nd

Um hotsite é um site de vida curta voltado exclusivamente a um produto, serviço ou evento, por exemplo. De “vida curta” porque normalmente ele é feito para algum lançamento ou enquanto algum evento durar – ou seja, ele é uma “campanha”. No final da campanha, o hotsite não tem mais utilidade. No caso de Dexter, o hotsite foi feito para o lançamento da 3ª temporada da série em DVD, então todo o conteúdo era voltado para essa temporada – fotos, vídeos, curiosidades etc. A home trazia chamadas para todo o conteúdo, destacando também um link para a compra do DVD.

Um hotsite ganha pontos quando é interativo – nesse caso, havia um jogo em formato de quiz onde os visitantes testavam seus conhecimentos sobre a série.

Landing Page

modelo landing page
Modelo de site “Landing Page”: Onnet Seguros – criação e desenvolvimento por mim

Uma landing page tem um conceito muito parecido com o de um hotsite. Normalmente ela é uma página que vende exclusivamente um produto/serviço, trazendo todas as informações sobre ele e botões call-to-action para converter vendas, tudo isso em uma página só (ou seja, não há distrações – o usuário entra na página e terá tudo o que for necessário para comprar aquele produto/serviço). Uma landing page não tem “data de validade”, já que é feita pra impulsionar vendas de maneira constante, como no exemplo da Onnet Seguros: uma página de conversão para cotação de seguros para BMW.

Você pode ter uma loja online e fazer uma landing page para impulsionar vendas de um produto novo, por exemplo, atraindo visitas pra ela através de anúncios no AdWords. Nesse caso, ela é uma página de apoio para sua loja.

Mais modelos de site?

Leia também: 10 modelos de portfolio

Se você ainda tem dúvidas sobre qual modelo escolher para seu site ou conhece outros modelos de site bacanas que ficaram de fora, deixe seu comentário abaixo!

Não é permitida a reprodução integral desse conteúdo. A cópia pode ser ruim para você!

Do que você está precisando?

Um site novo? Suporte para WordPress? Criação de logo? Outra coisa? Fale comigo!

Quero um orçamento

Leia também...

...alguns textos que têm a ver com o assunto:

5 diferenças essenciais entre Web Design e Design Gráfico

Web Design e Design Gráfico são mais diferentes do que você imagina. Saiba quais são essas diferenças e qual das duas áreas você deve escolher!

Por que assinar seus trabalhos?

Um web designer ou desenvolvedor deve ou não adicionar sua assinatura no rodapé dos sites que faz? Confira os prós e contras!

Design não tem que ser bonito – tem que funcionar

Considerando que "bonito" é uma opinião pessoal, você nunca irá agradar a todos. Design tem outros fatores e conceitos mais importantes que estética.

Deixe seu comentário

Se você deseja um orçamento, entre em contato clicando aqui.

Quero um orçamento