30 sites de uma página que você gostaria de ter construído
Com os usuários da Web bombardeados com tanta informação, os web designers estão constantemente explorando novas maneiras de fornecer conteúdo. Os sites de uma única página estão sendo amplamente adotados, sendo que algumas das maiores marcas do mundo os utilizam para oferecer aos usuários uma experiência rápida, limpa e simples, simultaneamente eficaz e bela.
Ao longo dos últimos anos, vimos a tendência de crescimento de websites de uma página graças à introdução do HTML5 e do jQuery, que facilitam a criação de websites impressionantes com transições e efeitos bacanas.
Abaixo estão 30 sites HTML5 de uma página impressionante, cobrindo tudo, desde o design minimalista e navegação simples para rolagem paralaxe. Se você está procurando inspiração para o novo site HTML5 de uma única página, dê uma olhada na lista abaixo:
1. Projeto Trionn
Tendo ganhado vários prêmios, o site HTML5 de uma página da Trionn Design usa rolagem paralaxe para facilitar a navegação dos usuários pelo site. Esse design responsivo usa imagens atraentes para manter os usuários envolvidos e também incorpora alguns ótimos efeitos de CSS.
2. Airbrake MX Oakley
A Oakley criou este site divertido e atraente, combinando rolagem paralaxe e fotografia incrível para mostrar os novos óculos Airbrake MX de uma maneira única.
3. Desloque-se pela sua saúde
Não só este site é impressionante, mas também fornece informações úteis sobre o seu '5 por dia', incentivando os visitantes a comer mais frutas. O site faz uso da inteligente rolagem de paralaxe para uma sensação brilhante, quase de vídeo.
4. Laura Baffari
A designer gráfica Laura Baffari criou um impressionante portfólio interativo que usa rolagem horizontal e toque para smartphones e tablets. Ao entrar no site, você verá blocos exibindo seu trabalho, que podem ser rolados em qualquer direção.
5. Pati e Felipe
Este é para todos os românticos lá fora. Essa deve ser a maneira mais original de confirmar sua presença em um casamento. Uma bela história de um casal que conheceu há muitos anos, este site usa rolagem de paralaxe com uma grande animação e tipografia inventiva.
6. Ian James Cox
Outro portfólio destinado a fornecer inspiração, o designer freelance digital Ian James Cox criou um site de uma página de efeito de doodle inventivo baseado na fonte “Duffy Bold” e no popular plugin Scroll Path jQuery.
7. Air Jordan 2012
Especialistas em calçados A Nike criou um site cativante para a Air Jordan 2012. Construído em torno do próprio calçado, o site usa rolagem de paralaxe para levar os visitantes através da criação do treinador e dos materiais usados à medida que são montados.
8. Meu Forno De Pizza
O fanático por pizza Renato criou este site atraente para o seu negócio de festas de pizza. Este site não apenas deixa você com fome, mas o uso de elementos gráficos em toda a página adiciona um toque agradável.
9. Marty.com
Criado por Martin Ringlein, gerente de design do Twitter, este design de uma página é verdadeiramente único. Use as setas na parte inferior para colocar as apresentações de slides em movimento e ver o que Martin tem feito desde 1999. Se você está procurando inspiração para uma navegação original, verifique este site!
10. Smart Phood
Smart Phood é um projeto de pesquisa sobre como as pessoas comem. Este pager colorido em HTML5 tem um pergaminho exclusivo que lhe dá o fator 'uau'.
11. numéro10
Eu não posso imaginar quanto trabalho foi feito para criar este site de uma página. Ele usa rolagem de paralaxe e muitas transições incríveis e elementos gráficos que é improvável que você veja em qualquer outro site. Simplesmente de tirar o fôlego!
12. Saucony Kinvara 3
Uma excelente experiência interativa usando rolagem paralaxe e incríveis transições e efeitos para apresentar a jornada completa do sapato se unindo.
13. Jornada Épica do Pi
Este one-pager é tão épico quanto o próprio filme. É um impressionante site de rolagem de paralaxe HTML5 que exibe os bastidores dos melhores momentos do filme.
14. Nova Skoda Octavia
O novo site HTML5 dedicado da Skoda Octavia convida os visitantes a descobrirem através de uma experiência animada imersiva. Este impressionante pager único usa rolagem paralaxe e um tipo único de navegação que cria uma experiência envolvente.
15. Toda Última Queda
Um site informativo que analisa em profundidade a quantidade de água que uma pessoa média consome todos os dias no Reino Unido. O site usa elementos gráficos e transições para estimular a conversação sobre um assunto importante.
16. Perigo Reverendo
Estilisticamente semelhante ao Minecraft, o Reverend Danger usa uma variedade de técnicas de animação e CSS para criar uma experiência divertida para os visitantes. Esse pager único combina um controle deslizante interessante no topo, onde os visitantes podem alterar as imagens de "reverendo para perigo".
17. Festa Italiana
A Festa Italiana é outro site divertido que usa cores vivas e elementos gráficos que se movem quando você rola para baixo.
18. Ativar
Mate sua sede com este site por Ativar. Ao rolar pelo site, você recebe garrafas flutuantes clicáveis. O site tem algumas excelentes transições e efeitos por toda parte.
19. D'Angelico Guitars
As guitarras D'Angelico foram adotadas por muitos e permaneceram populares até os anos 70. Agora a lenda renasce com um impressionante pager de um HTML5 que faz um grande uso da rolagem de som e paralaxe para levá-lo através da jornada.
20. Estado do proprietário do negócio 2013
Uma visão exclusiva do conceito popular do infográfico tradicional, este site de uma página em HTML5 apresenta estatísticas de um relatório que revela fatores críticos para o sucesso de pequenas e médias empresas em 2013. Role para baixo para ver as transições e efeitos que revelam as estatísticas.
21. Marco Rosella
Um fantástico site de portfólio de uma página em HTML5 com uma interface de usuário com zoom gerida pelo SVG.
22. Jules Bassoleil
O portfólio de uma única página de Jules Bassoleil tem uma navegação incrivelmente lógica e eficaz com os gráficos saltando para você.
23. Sergio Pedercini
O web designer italiano Sergio Pedercini criou um site elegante para exibir seu portfólio. As cores brilhantes e a navegação saltitante tornam-no atraente e fácil de usar.
24. VonDutch
O uso da rolagem de paralaxe por Von Dutch, uma marca de moda, adiciona uma sensação de movimento à sua história. Ícones e imagens se movem dentro e fora do lugar enquanto você rola a página, proporcionando uma experiência fluida.
25. CoolApps
Um pager HTML5 simples, mas atraente, que usa animação para fornecer um ótimo efeito flutuante.
26. Pixelmess
A rolagem horizontal é bastante comum em sites de agências de criação, e o site da Pixelmess é um exemplo disso funcionando particularmente bem. A combinação de fontes e ilustrações retro faz você se sentir como se estivesse jogando um videogame da velha escola que é ainda mais envolvente.
27. Renault Zoe
A Renault usa uma combinação de rolagem de paralaxe, áudio e vídeo para criar uma experiência interativa e incrível para os visitantes.
28. Lei de Officeline
Este é um dos melhores sites de apresentação de produtos que eu vi recentemente. O uso do site de rolagem paralaxe para apresentar cadeiras giratórias projetadas especificamente para as mulheres.
29. Casa da Beleza All-N-1
Este pager de HTML5 responsivo apresenta um layout fluido que inclui vários elementos interativos e animações para torná-lo mais envolvente.
30. Kinderfotografie Evi Hermans
A fotógrafa infantil Evi Hermans criou este site divertido e divertido de uma página. Não são apenas as fotos lindas, mas este belo site é ainda mais interativo através do uso de animações.
Você gostaria de ter construído esses sites? Você construiu um melhor? Deixe-nos saber nos comentários.