Como projetar o site Perfect Page Single
Projetos de página única podem ser uma excelente técnica para lidar com sites menores, mesmo aqueles que você pode achar que nunca poderiam ser feitos sem várias páginas. Há muitos bons motivos para usar um site de uma única página, desde a facilidade de manutenção até as necessidades reduzidas de largura de banda.
Se você estiver lidando com um site mais curto, que normalmente teria um punhado de páginas, considere usar uma única página e veja se isso tornará o projeto mais fácil e mais fácil de usar. Continue lendo para obter mais informações sobre os benefícios, quando (e quando não) usá-los e algumas práticas recomendadas que você deve seguir.
Os benefícios do design de página única
Obviamente, os projetos de página única não são ideais para todos os projetos. Mas há uma série de razões para usá-las se elas forem possíveis.
Eles são intuitivos para usar
Por padrão, tudo o que um usuário precisa saber para navegar em um único site de página é como rolar. Você pode incluir setas ou outras pistas de navegação, mas, com raras exceções, simplesmente a rolagem trará seus visitantes de uma seção para outra.
Você nunca terá que se preocupar com os visitantes ficarem presos em várias camadas de navegação, procurando o que precisam. O uso de um cabeçalho ou de outros links de navegação costuma ser útil se houver várias seções na página, mas, mesmo sem elas, o site é utilizável.
Pode ser mais rápido e mais fácil de manter
Embora este não seja um dado, um site de página única bem codificado provavelmente será mais rápido para codificar do que um site de várias páginas. O processo de design pode, às vezes, levar menos tempo, embora isso dependa da complexidade da página única.
Um site de uma única página também pode impor certas restrições de design que aceleram o processo quando você tem um layout básico em mente. Mais do que um site de várias páginas, um site de uma única página precisa ter seções que funcionem perfeitamente juntas. Esse tipo de restrição pode realmente acelerar o desenvolvimento da página, uma vez que você definiu claramente o que pode e não pode fazer.
A manutenção pode ser mais fácil também. Quando você só tem uma única página para lidar, a manutenção é mais simples, desde que seu código esteja bem escrito para começar.
Você é forçado a simplificar
Este constrói o ponto anterior. Quando você só tem uma única página para trabalhar, você precisa simplificar as coisas para os componentes mais essenciais. Não há mais páginas e páginas de propaganda de marketing inútil. Você tem que chegar ao ponto imediatamente.
Melhor potencial de SEO
Os links de entrada de qualidade são uma parte importante do desempenho de um site nos mecanismos de pesquisa. Embora os mecanismos de pesquisa não sejam necessariamente a maior fonte de tráfego para muitos sites, eles ainda são geralmente importantes.
Por ter apenas uma página, você só tem uma página vinculada. Isso pode aumentar a importância do site, tanto quanto os motores de busca vão.
Contar histórias pode aumentar a ação
Os sites de uma única página costumam usar um ângulo de narrativa de que os sites de várias páginas não são tão bons quanto. Isso pode aumentar as conversões e inspirar os visitantes a agir.
As pessoas estão acostumadas a seguir histórias, tanto on-line quanto off, então isso tem benefícios óbvios de experiência do usuário. Nós temos lido e ouvido histórias desde que éramos crianças, então é algo que vem naturalmente para nós.
Mais fácil de organizar
Não há mais listas intermináveis de páginas e subpáginas para organizar. Não é mais necessário saber se essa página ou essa página deve ser pai ou filho. Não há mais menus de navegação e submenus. Está tudo em uma página. E se você decidir incluir links de navegação, ou simplesmente permitir que os usuários rolem, cabe a você e se você acha que isso irá adicionar à experiência do usuário ou não. Isso não é uma opção quando um site tem várias páginas.
Largura de banda reduzida
Embora isso não seja mais um problema no final da hospedagem, considere quantos usuários estão acessando seu site usando dispositivos móveis nos dias de hoje. Diminuir a quantidade de largura de banda do seu site é apreciado por usuários com planos de dados limitados.
Eliminar sites para dispositivos móveis
Design responsivo, é claro, não se limita a sites de uma única página. Mas quanto mais complexo é um site, mais difícil é fazê-lo funcionar bem em uma tela menor, mesmo com um design responsivo. Um site de página única é, por necessidade, não complexo. Tornar o design responsivo geralmente é mais fácil. Navegação simplificada e alterações semelhantes também facilitam um design que funciona bem em telas pequenas.
Parallax ou não paralaxe?
Dependendo do seu ponto de vista, a rolagem paralaxe é a melhor coisa que já aconteceu na internet, ou um flagelo excessivo e confuso em nossos navegadores. Mas, independentemente de onde você esteja, não parece que vai desaparecer tão cedo.
Pessoalmente, sinto que há um tempo e um lugar para rolagem de paralaxe. Alguns sites de uma página podem realmente se beneficiar do efeito, enquanto outros aparecem como enigmáticos, ou pior: difíceis de usar. A chave é decidir se o efeito de rolagem paralaxe que você deseja usar é algo que realmente melhorará a usabilidade do site, ou se você quiser usá-lo apenas porque ele ficará legal.
Outra coisa a considerar se você decidir usar a rolagem parallax é usar JavaScript ou uma técnica CSS simples para fazer isso. Veja a seção de recursos para mais sobre ambas as opções.
Quando usar um site de uma única página e quando não
Embora haja muitos benefícios para sites de uma única página, eles não são uma solução perfeita, de tamanho único. Há muitas ocasiões em que você não deve usar um design de uma página, enquanto há muitas outras vezes em que um site de uma página faz muito mais sentido do que um site de várias páginas.
Se você estiver configurando um site com apenas algumas páginas, o site de uma única página poderá ser perfeito. Condensar tudo em uma única página pode dar ao site geral uma aparência mais moderna e, se for claro sobre o conteúdo de qualquer maneira, um único site de página pode dar a aparência de ter mais conteúdo.
Outro exemplo comum do site de uma página é o site de pré-lançamento. Estes são, mais frequentemente do que não, uma única página, muitas vezes com um formulário para uma inscrição no boletim informativo. Na maioria dos casos, as informações fornecidas ao público durante o pré-lançamento podem ser facilmente organizadas em uma única página, portanto, faz sentido considerar esse estilo primeiro ao projetar essas páginas.
Os sites de comércio eletrônico de produtos únicos são outro local onde os sites de página única podem ser ótimos. Se você está vendendo apenas um produto, seja um produto físico ou digital, por que se preocupar com várias páginas? Um site de página simples e simples pode ser uma ferramenta de vendas muito melhor.
Você pode pensar que um site de comércio eletrônico mais complexo não é adequado para um site de uma única página, mas ainda pode ser. Concedido, eu evitá-lo para sites que têm mais de uma dúzia de produtos, mas uma simples loja on-line pode ser facilmente realizada em uma única página, com janelas modais para carregar detalhes do produto e o processo de checkout.
Quando não usar um site de uma única página é bastante simples: sites que são grandes, complexos ou que, por padrão, precisam ter grandes quantidades de informações não são adequados para um único site de página. Nesses casos, você está muito melhor com uma estrutura de site mais tradicional.
Sites híbridos
Embora existam muitos sites de uma única página por aí, também há muitos sites de tipos híbridos. Eles dão a impressão de uma única página, mas usando ajax, janelas modais e afins, eles realmente contêm várias páginas de conteúdo.
O site Dang & Blast é um ótimo exemplo disso.
Estas podem ser uma ótima solução se você não consegue obter tudo para caber em uma única página.
Alguns sites classificam como "trapacear" quando se trata da página única. Eles têm uma única página para o seu site principal, mas depois têm um blog em outro domínio (às vezes um site hospedado no Tumblr ou no WordPress.com). Não há nada de errado com isso, e pode ser uma maneira de manter sua mensagem em seu site principal focada, sem abrir mão dos benefícios de ter um blog.
Práticas recomendadas para sites de página única
A maioria dos princípios do bom design ainda é aplicável em sites de uma única página, como eles são com qualquer bom design do site. Mas há algumas coisas adicionais que você precisa ter em mente, algumas das quais já foram mencionadas acima.
Mantenha simples
Tentar criar um design que seja complexo demais para o conteúdo que você está tentando apresentar não está favorecendo você ou seus usuários. Em vez disso, simplifique tanto o seu design quanto o seu conteúdo, enquanto ainda apresenta o que você precisa.
Links de navegação ainda são úteis
Só porque os usuários podem navegar pelo seu site, isso não significa que seja a maneira mais fácil de fazer isso. Isto é especialmente verdadeiro se você tiver uma página longa com muitas seções. A menos que exista uma boa razão para não incluí-los, adicionar links de navegação a seções específicas torna seu site mais fácil de usar.
Divida seu conteúdo
Uma única página não significa que tudo tem que ser uma longa seção. Na verdade, não deveria ser. Divida seu conteúdo em partes e seções lógicas para que os usuários possam encontrar melhor o que estão procurando.
Faça algo com todo esse background
Sites de página única tendem a ter grandes origens. Concedido, às vezes esses fundos são deixados simples ou com um padrão de repetição; mas outros sites de uma página aproveitam todo esse espaço para fazer algo criativo. Isso também pode ajudar a dividir seu conteúdo, como já mencionado. Seu plano de fundo não precisa ser uma única imagem. Pode ser uma série de imagens, se isso se adequar melhor ao seu conteúdo.
Recursos para seus sites de uma única página
Existem centenas de recursos, incluindo modelos, para sites com uma única página; mas aqui vamos nos concentrar naqueles que se destacam.
Rolagem Parallax CSS pura : Este artigo de Keith Clark explica como criar uma técnica de rolagem paralaxe usando apenas CSS. Esta é uma ótima opção se você não quiser usar JavaScript (ou não sabe como).
Skrollr : “Parallax rolando para o resto de nós”. É uma biblioteca independente que funciona com dispositivos móveis e computadores. Não é necessário jQuery, apenas JavaScript antigo.
Stellar.js : Stellar.js é outro fácil de usar biblioteca de rolagem parallax. Ele oferece muitas opções de configuração e suporte ao iOS.
Wireframes de site de uma página : Este conjunto de wireframes para designs de página única pode ser um ótimo ponto de partida se você não tiver certeza de como estruturar seu site. Eles estão livres para baixar. Há um segundo conjunto que você pode baixar Aqui .
Uma página amor : One Page Love é a principal galeria de sites de uma página, com mais de 5000 sites de exemplo, e adicionando mais o tempo todo. Eles também apresentam vários modelos e outros recursos.
Inicie o Bootstrap : Start Bootstrap tem uma grande seleção de temas Bootstrap gratuitos de uma página. Existem temas para agências, freelancers, portfólios, páginas de destino e muito mais.
Modelos de uma página de amor : Além de sua extensa galeria, One Page Love também oferece modelos gratuitos e premium.
One Page Mania : One Page Mania oferece uma galeria de sites e modelos exclusivos que você pode baixar ou comprar.
Conclusão
Projetos de página única podem ser uma excelente opção para muitos tipos diferentes de sites. Embora eles não sejam o melhor e o final do design de sites pequenos, eles valem a pena serem considerados em muitos projetos. Considere as razões para usar uma única página e, em seguida, considere as razões para não e decida a partir daí.