Daniele V Silva - Webdesigner, desenvolvedor front-end, programador de interfaces, Gerente de projetos web, consultora e freelancer


Taken at Galeto’s Higienópolis

Mom and stepdad :)

One Page Sites – Sites de uma página só

Publicado em , por , na categoria Elementos e técnicas, Webdesign

Sites de uma página estão no topo da lista de conceitos de comunicação eficientes. O nome já diz tudo: são sites que não tem paginação, todo o conteúdo é exibido em uma página só, ou praticamente isso. Em alguns casos, usa-se flash ou iframe, mas é em uma página que tudo acontece.

Ultimamente tenho falado bastante sobre a criação de um portfolio, e esse artigo está diretamente relacionado já que a maioria dos sites que seguem esse estilo são portfolios pessoais, no entanto eu acredito que essa seria uma solução muito boa para alguns sites institucionais em que, muitas vezes, optamos por uma estrutura mais complexa.

Muitas vezes, não há muito que dizer e acabamos preenchendo as páginas com o um pouco de “lero lero“apenas para ter uma estrutura padrão de “home, produto, empresa, contato”. Eu acredito que a causa disso seja o fato de que projetos desenvolvidos em uma única página ainda são atípicos e inconscientemente podem causar a impressão de algo feito às pressas e sem planejamento (o que na maioria das vezes não é verdade) e, mesmo que tenhamos pressa, não queremos que os outros percebam isso, a idéia já é descartada antecipadamente.

Eu não gosto de dizer que uma técnica é a mais fácil de ser executa do que outra, mas essa, em especial, pode ser uma solução bastante simples pra quem precisa de uma portfolio e não tem tempo para desenvolver uma estrutura mais elaborada. A receita é simples: junte todo o conteúdo em uma lista bem organizada, com uma estrutura bonita e sem complicações. Et voilá! Temos um portfolio.

Isso evidentemente não se enquadra a todo profissional, mas para muitas situações pode ser uma grande idéia.

A maior vantagem de se projetar o portfolio nesse formato é clareza que as peças ficam disponíveis. Isso é especialmente importante para aqueles que buscam novos negócios e precisam mostrar seus trabalhos de forma simples e rápida.

Para quem tem poucos trabalhos a exibir, pode optar pela visualização como está no site do Laert Jansen e para quem quer mostrar muita coisa pode dividir em pequenos quadradinhos como no mofo ou usar o formato de banners como no site do Junior. Em alguns casos, da até pra juntar vários formatos de exibição como o Paulo Tenorio conseguiu fazer muito bem.

O problema dessa forma de apresentação é que as peças expostas no portfolio precisam ser muito boas, pois o layout é normalmente muito simples e pouco impressionante, realmente, se você não tem certeza da qualidade do seu trabalho, ou se está ingressando agora nessa área talvez seja melhor optar por outra solução, como já falado aqui e aqui. Por outro lado nada impede de criar um layout mais elaborado também.

Alguns exemplos comentados

didooEsse é o melhor exemplo que encontrei de site que com uma navegação convencional podem montados em uma página só, tudo depende da quantidade de informação.
raulftAlguns sites, a maioria em flash ou html com iframe, apresentam a estrutura de uma página, mas não são. Eles possuem uma paginação ainda que discreta.
raulftEsse é outro exemplo de site de uma página só e com uma navegação atípica. Eu adoro a facilidade de visualização e forma como escolhemos
Esse é é o exemplo mais comum desse tipo de navegação: os trabalhos são apresentados por inteiro em uma única página onde também encontramos informações de contato e uma pequena “Bio”

Exemplos de Uso

16 Responses to “One Page Sites – Sites de uma página só”

  1. Otimo teu site! Era isso justamente o que estava procurando. Tenho que fazer um site (ate ja fiz), mas tem quase nada de conteudo que resolvi mudar na ultima hora… iAlém disso, você é linda e inteligente! Parabéns!

  2. Otimo teu site! Era isso justamente o que estava procurando. Tenho que fazer um site (ate ja fiz), mas tem qiAlém disso, você é linda e inteligente! Parabéns!

  3. SERGIO PIZZONI says:

    GOSTARIA DE FAZER UMA PG PARA ESSE SITE QUANTO CUSTA ?

  4. Jnna says:

    Crie seu website conosco em até 20 dias!!

    Temos promoções especiais para sites profissionais (site padrão)

    confira: http://www.jsdesigner.net

  5. Oi Daniele, mais uma vez valeu pela menção do meu site no seu post. Vc já colocou ele como exemplo num outro posto sobre portfólio e listou o da Jungle como ilustração e vetor. Valeu ai.

  6. Cassius Fraga says:

    olá, ótimo o seu artigo… bem explicativo para quem esta querendo montar seu portfólio.
    fiquei supreso ao ver meu nome. mas mudei o meu site, aderia o wordpress(pela facilidade de atualização)
    agrande abraço, passa la depois. =)

  7. Oi Dani,

    Obrigado pela menção ao meu site.
    Gostei muito dos seus artigos e opiniões

    Abraço

  8. Camilo Vitorino da Costa says:

    Antes de mais nada, não sou o Camilo ai de cima ;)

    bom, voltando ao assunto, é muito bacana site feito em uma página só, principalmente por serem simplismente DIRETOS! Vão direto ao assunto, no caso de um portfolio, site de empresas pequenas, hotsites, etc. É muito mais facil de lidar e não tem a hoje tão questionada paginação que tanto nos estressa!! hahaha

    adorei o post!

    ps.: ahh! acompanho seu blog a um tempo já mas não costumo comentar… Acho que vou começar a dar pitacos por ai… rss

  9. Isadora says:

    Como fazer um site de uma pagina só tipo esse http://mussatto.com.br/home.htm ?

  10. Camilo says:

    Muito bacana Daniele!

    Acho os sites com uma página muito interessantes também. Como estou montando meu portfólio (projetando ainda) penso na possibilidade de usar um recurso assim. Não vou fazer uma página só, mas expor vários trabalhos na primeira página é uma coisa que provavelmente farei.

    Até mais!

  11. Seja bem-vindo Camilo²! Vou adorar se vc participar por aqui mais vezes

  12. Oi moça
    No DaMussato eu usei javascript, fiz a página cumprida e usei javasript para efeito de rolagem.

  13. -Seu site está bem legal, Márcio, por isso eu escolhi, parabéns

Leave a Reply