Les sites Web d'une page sont populaires et populaires - cela ne fait aucun doute. Mais ils ne sont pas pour tout le monde ou pour toutes les entreprises. Il est facile d'en vouloir car ils sont populaires; et si cela est fait correctement, le vôtre pourrait être un succès. Mais assurez-vous que votre projet est qualifié en premier.

Un bon candidat pour un site Web d'une page n'est pas trop lourd en contenu. Vous ne disposez que d'une page pour faire passer votre message, et vous ne pouvez lancer que de nombreuses animations et astuces avant qu'elles ne deviennent obsolètes.

De plus, la plupart des sites Web d'une page ne sont pas conventionnels. Essayer d'ajuster beaucoup de contenu sur une seule page sans paraître encombré est assez difficile.

Les utilisations potentielles varient, mais certains des candidats les plus populaires pour les sites Web d'une page sont les portefeuilles personnels et les sites Web pour les entreprises qui ne vendent que quelques produits ou services.

Si vous vous qualifiez, assurez-vous que votre site Web a atteint sa cible. Il y a toujours certaines choses à suivre lors de la création de tout site Web, mais les points ci-dessous sont particulièrement importants pour les sites Web d'une seule page.

1. Restez concentré

Rendez tout aussi simple que possible pour le public. Les chances sont, si vous envisagez un site Web d'une seule page, vous n'avez probablement pas une tonne de contenu. C'est très bien. Nous sommes parfois tentés d'ajouter beaucoup de peluches à nos sites Web. Les sites Web à page unique ne requièrent aucun bourrage parce que leur seul objectif est d’arriver au point. Si vous êtes un designer réunissant un portfolio, présentez votre meilleur travail; Ne vous laissez pas distraire par des projets médiocres ou par votre entreprise de t-shirts.

Dénudez votre site Web de n'importe quel fluff, et mettez-vous au travail. Bien qu'il s'agisse d'une bonne stratégie pour n'importe quel site Web, la plupart des sites Web multi-pages peuvent présenter un aspect superflu, car les utilisateurs savent généralement où trouver les informations qu'ils souhaitent. Avec un pager, vous obtenez un coup, et si les informations que quelqu'un recherche ne sont pas là, vous les perdrez.


Il ne fait aucun doute que ce site de commerce électronique se vend.


Ce portefeuille va droit au but. Un joli design minimaliste.

2. Donnez une hiérarchie à la mise en page

En plus de maintenir l’attention des visiteurs, un site Web d’une seule page est censé présenter votre produit ou service. Si vous pensez aux sites Web d'une page que vous rencontrez, ils ont probablement un objectif particulier, que ce soit pour présenter le travail de conception d'une agence ou susciter un intérêt pour un événement à venir.

Un bon design et une mise en page ciblée peuvent aider à définir l'objectif de votre site Web. En tant que concepteur, vous avez le pouvoir de diriger les yeux du visiteur là où vous le souhaitez. Les gens remarquent naturellement les grandes choses et les petites choses, alors utilisez-les à votre avantage. Les choses importantes ne doivent pas être les plus petites ou les dernières sur la page.

Ces paragraphes d'introduction aux polices de grande taille sont devenus si populaires sur les portfolios des créateurs parce qu'ils atteignent rapidement leur objectif et sont attrayants pour les personnes à la recherche d'un concepteur. La dernière chose que vous voudrez probablement voir, c'est de quelle école ils ont obtenu leur diplôme. Mais vous voulez savoir dans quoi ils se spécialisent et quel type de travail ils font.

Encore une fois, vous avez peu d’occasions de faire passer votre message, alors faites le bien. Si vous trouvez que vous avez trop de contenu pour pouvoir faire cela, alors envisagez d’utiliser un site Web de plusieurs pages.


Bien que ce site Web présente plusieurs points différents, même dans cette capture d'écran, nous pouvons dire ce qui est le plus important.


Nous pouvons dire ce que fait cette société, mais la hiérarchie visuelle pourrait être meilleure.

3. Effacer la navigation

Certains sites Web d'une page sont des pages statiques dont la navigation amène le visiteur à des sites Web externes. Par exemple, un musicien peut avoir une option de navigation sur son site Web intitulée "Vidéos" qui vous amène à son compte YouTube. Absolument rien ne va pas avec cela, et cela rend même les choses faciles (surtout pour les non-codeurs). La seule chose est que les visiteurs doivent savoir quand ils sont dirigés vers une page externe.

Si votre site Web d'une page doit présenter un produit et que votre lien d'achat envoie les clients vers une plateforme de paiement externe sans le leur dire, vous risquez de perdre des ventes.

Votre but est de garder tout simple. La redirection des utilisateurs vers des sites Web externes sans avertissement peut être source de confusion. Ils peuvent supposer que le lien est cassé ou incorrect. Pensez à utiliser des icônes (beaucoup d’entre elles sont disponibles) ou des en-têtes pour informer les visiteurs de leur destination.


Voici ce qu'il ne faut pas faire. Les liens en haut de la page vous mènent hors du site sans avertissement. Cela m'a vraiment déçu.


La conception et le codage de ce site sont très inhabituels. Néanmoins, les liens vers les pages externes se distinguent par les cercles verts et sont étiquetés comme tels.

4. Go design fou

Maintenant, nous arrivons à la partie amusante: utiliser un site Web d'une seule page pour montrer. Vous ne voulez pas que le site soit ennuyeux ou répétitif, alors allez-y. Amenez le design au niveau suivant et sortez des sentiers battus. Un design peu orthodoxe est parfait pour attirer l'attention sur votre produit et le rendre mémorable.

Les téléavertisseurs deviennent synonymes de design, car vous pouvez en faire plus avec le plus grand format. Vous n'êtes pas obligé d'utiliser le même arrière-plan partout; vous le changez à travers les sections. Faire défiler des sites Web d’une page revient souvent à feuilleter un magazine ou une présentation de diapositives bien assemblée. Exploitez les possibilités.

Améliorez la conception, que ce soit en utilisant de grandes images couvrant toute la fenêtre du navigateur ou en créant un arrière-plan illustré. Vous obtiendrez des points bonus et vous pourriez vous retrouver dans des vitrines de conception Web.


Ce design est à couper le souffle, quelque chose comme une affiche. Et le reste du site ne déçoit pas.


La propreté de cette conception (et du code) est incroyable. Cela vous fait arrêter et regarder.

5. Allez fou de code

Tout comme avec le design, vous voulez également montrer vos compétences en codage. Les sites Web d'une page sont censés être en interaction avec. L'expérience utilisateur est critique, alors faites attention aux détails. Le code peut amener votre site Web au niveau suivant.

Certaines choses à prendre en compte sont les couleurs et le comportement des liens (en particulier le sélecteur de vol stationnaire); l'apparence et le comportement des formulaires (par exemple, adapter le formulaire au design et utiliser des validateurs AJAX et JavaScript); messages de soumission et d'erreur (utilisés avec les formulaires et certains AJAX); et la grille et le placement du contenu (ainsi que le comportement du contenu dans la fenêtre du navigateur). Tous ces éléments doivent correspondre à la conception.


Un moyen simple de mettre du code pour travailler sur un site Web d'une seule page.


Je peux être biaisé parce que j'aime le tour où le contenu se charge sur le défilement, mais l'attention portée aux détails dans le code est incroyable.

6. Faites-le bouger

En plus de prendre en charge les détails de codage, vous pouvez utiliser le code pour créer du mouvement et de l’excitation sur la page. Encore une fois, évitez d'être ennuyeux. Donnez à votre page un sens de la vie et du mouvement; donnez l'impression qu'il bouge avec les visiteurs. Ajoutez des animations amusantes ou des transitions pour faire ressortir la page.

Des langages tels que jQuery et AJAX sont devenus la norme pour créer un mouvement sur un site Web. Que vous fassiez fondre le contenu de différents côtés ou que vous fassiez un diaporama sur l'arrière-plan, assurez-vous que le public reste engagé.


Ce fond est une animation. Je n'ai aucune idée de ce que le site Web est, mais il semble propre.


Les transitions sur ce site sont excellentes. J'aime celui-ci!

Quelles sont les autres choses nécessaires pour créer un site Web d'une page?