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.

» Siga-me no twitter e assine a newsletter para ler mais novidades!

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

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.

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!