Sites de uma página são quentes e populares - sem dúvida. Mas eles não são para todos ou todos os negócios. É fácil querer um porque eles são populares; e se feito corretamente, o seu pode ser um sucesso. Mas certifique-se de que o projeto seja qualificado primeiro.

Um bom candidato para um site de uma página não é super pesado em conteúdo. Você só tem uma página para mostrar seu ponto de vista, e há tantas animações e truques que você pode jogar antes que fiquem obsoletos.

Além disso, a maioria dos sites de uma página não é convencional em seu layout. Tentar encaixar muito conteúdo em uma página sem parecer desordenado é bem difícil.

Os usos potenciais variam, mas alguns dos candidatos mais populares para sites de uma página são portfólios pessoais e sites para empresas que vendem apenas alguns produtos ou serviços.

Se você se qualifica, certifique-se de que seu site atinja a marca. Há sempre certas coisas que você precisa seguir ao criar qualquer site, mas os pontos abaixo são especialmente importantes para sites de uma única página.

1. Mantenha-se focado

Faça tudo o mais simples possível para o público. As chances são, se você está considerando um site de uma única página, você provavelmente não tem uma tonelada de conteúdo. Isso é bom. Às vezes, somos tentados a adicionar muito fluff aos nossos sites. Sites de uma única página não exigem fluffing porque seu único objetivo é chegar ao ponto. Se você é um designer montando um portfólio, apresente seu melhor trabalho; não se distraia com projetos medíocres ou com o seu negócio de camisetas.

Tira o seu site de qualquer coisa, e veja as coisas que importam. Embora essa seja uma boa estratégia para qualquer site, a maioria dos sites de várias páginas pode se safar com um pouco de cotão, porque os usuários geralmente sabem onde encontrar as informações que desejam. Com um pager, você recebe uma chance, e se as informações que alguém está procurando não estiverem lá, você as perderá.


Não há dúvidas sobre o que este site de e-commerce está vendendo.


Esse portfólio chega direto ao ponto. Um design minimalista maravilhoso também.

2. Dê ao layout uma hierarquia

Além de manter o foco do visitante, um site de uma única página deve mostrar seu produto ou serviço. Se você pensar em sites de uma única página, eles provavelmente terão um propósito singular, seja para exibir o trabalho de design de uma agência ou para aumentar o interesse em um evento futuro.

Um ótimo design e layout focado pode ajudar a definir o propósito do seu site. Você, como designer, tem o poder de direcionar os olhos do visitante para onde você deseja ir. As pessoas naturalmente notam as coisas grandes primeiro e as pequenas coisas duram, então use isso a seu favor. Coisas importantes não devem ser as menores ou últimas coisas na página.

Esses parágrafos introdutórios de fontes grandes se tornaram tão populares em portfólios de designers porque chegam ao ponto rapidamente e soam atraentes para as pessoas que procuram um designer. A última coisa que você provavelmente quer ver é de qual escola eles se formaram. Mas você quer saber em que eles se especializam e que tipo de trabalho eles fazem.

Mais uma vez, você tem poucas oportunidades para transmitir sua mensagem, então acerte. Se você achar que tem muito conteúdo para poder fazer isso, considere ir com um site de várias páginas.


Enquanto este site faz vários pontos diferentes, mesmo dentro desta imagem, podemos dizer o que é mais importante.


Podemos dizer o que essa empresa faz, mas a hierarquia visual poderia ser melhor.

3. Limpar navegação

Alguns sites de uma página são páginas estáticas, cuja navegação leva o visitante a sites externos. Por exemplo, um músico pode ter uma opção de navegação em seu site com o rótulo "Vídeos", que leva você a sua conta do YouTube. Absolutamente nada está errado com isso, e até facilita as coisas (especialmente para os não-programadores). A única coisa é que os visitantes devem saber quando estão sendo direcionados para uma página externa.

Se o site de uma página for mostrar um produto e o link de compra enviar os clientes para uma plataforma de pagamento externa sem informá-los, você poderá perder algumas vendas.

Seu objetivo é manter tudo simples. Redirecionar usuários para sites externos sem aviso pode ser confuso. Eles podem assumir que o link está quebrado ou incorreto. Considere o uso de ícones (muitos deles gratuitos) ou títulos para que os visitantes saibam para onde estão indo.


Aqui está o que não fazer. Os links na parte superior levam você para fora do site sem aviso prévio. Isso realmente me jogou fora.


O design e codificação deste site são muito incomuns. No entanto, os links para páginas externas são distinguidos pelos círculos verdes e são rotulados como tal.

4. Vai louco de design

Agora chegamos à parte divertida: usar um site de uma única página para exibir. Você não quer que o site seja chato ou repetitivo, então fique maluco. Leve o design para o próximo nível e pense fora da caixa. Um design não ortodoxo é bom para chamar a atenção para o seu produto e torná-lo memorável.

One-pagers estão se tornando sinônimo de ótimo design, porque você pode fazer mais com a tela maior. Você não é forçado a usar o mesmo fundo em todos os lugares; você muda as seções. Navegar pelos sites de uma página costuma ser como folhear uma revista ou uma apresentação de slides bem montada. Explore as possibilidades.

Torne o design excelente, seja usando imagens grandes que abranjam toda a janela do navegador ou criando um ótimo plano de fundo ilustrado. Você receberá pontos de bônus e poderá acabar sendo destaque em mostruários de Web design.


Este design é de tirar o fôlego, algo como um cartaz. E o resto do site não decepciona.


A limpeza deste design (e o código) é incrível. Isso faz você parar e olhar.

5. Go coding crazy

Muito parecido com o design, você também quer mostrar suas habilidades de codificação. Sites de uma única página devem interagir. A experiência do usuário é fundamental, por isso, preste atenção aos detalhes. O código pode levar seu site para o próximo nível.

Algumas coisas a se prestar atenção são as cores e o comportamento dos links (especialmente o seletor de foco); a aparência e o comportamento dos formulários (por exemplo, fazendo com que o formulário se encaixe no design e usando validadores AJAX e JavaScript); envio e mensagens de erro (usadas com os formulários e alguns AJAX); e a grade e posicionamento do conteúdo (assim como o comportamento do conteúdo na janela do navegador). Todos estes devem estar alinhados com o design.


Uma maneira simples de colocar o código para funcionar em um site de uma única página.


Eu posso ser tendencioso porque eu gosto do truque onde o conteúdo carrega no pergaminho, mas a atenção aos detalhes no código aqui é incrível por toda parte.

6. Mexa-se

Além de cuidar dos detalhes da codificação, você pode usar o código para criar algum movimento e excitação na página. Mais uma vez, evite ser chato. Dê à sua página uma sensação de vida e movimento; faça parecer que está se movendo com os visitantes. Adicione algumas animações ou transições divertidas para destacar a página.

Idiomas como jQuery e AJAX se tornaram o padrão para criar movimento em um site. Quer você faça o conteúdo desaparecer de lados diferentes ou tornar o plano de fundo uma apresentação de slides, mantenha o público envolvido.


Este fundo é uma animação. Eu não tenho idéia do que o site é sobre, mas parece puro.


As transições neste site são excelentes. Amo este!

Que outras coisas são necessárias para tornar um site de uma página especial?