Comment créer un site design ?

Publié le

Vous souhaitez créer un site internet design et agréable à visiter ?
Ou vous avez déjà un site et il n’est pas très beau, vous souhaitez le moderniser  ?

Un site bien pensé vous épargnera un tas de taux de rebonds que vous ne souhaitiez pas forcément..
Il vous permettra de capter votre audience autour d’un site internet agréable à visiter. Vous pouvez facilement développer le design de votre site en quelques étapes seulement !

Site internet design

Créer une maquette

La création d'une maquette permet de développer le côté artistique de votre site, et de mettre en place tous les éléments ( call-to-action, textes.. ).

En travaillant de fond en comble sur une maquette, vous développez un peu plus l'identité graphique de votre site, qui se base parfois sur des détails..

Pour améliorer la création de votre maquette, je vous conseille de :

  • Travailler sur une seule page (par exemple, la page d'accueil)
  • Développer plusieurs variantes de votre site (cela vous permettra d'établir une recherche plus poussée)
  • S'approprier des codes graphiques uniques
  • Importer 3 à 5 sites concurrentiels que vous trouvez intéressant
Maquette du site internet minisstyles.com
Maquette du site internet minisstyles.com

Avec une maquette, vous déployez une armada d'idées qui vous permettront de créer le joli site que vous imaginiez.

Structurer le contenu

Structurer l'arborescence de votre site est une chose, mais il faut également que l'on puisse comprendre facilement de quoi parle une page.

Développer une page demande une réflexion autour de la structure de votre contenu.

structure d'une page -simple comme bonjour
Hiérarchie du menu et des pages du site

Voici quelques recommandations pour améliorer l'accessibilité de votre contenu :

  • Insérer les éléments importants en haut de page
  • Structurer votre page avec des sous-titres
  • Un sommaire peut éventuellement être intéressant pour vos articles

Vous devez prendre en compte que l'internaute ne connait pas votre site et ne l'a jamais visité auparavant.
Alors il doit s'y retrouver facilement, et vous seul peut le guider ! 

En ayant une trame bien conçue et une page fidèle à la simplicité, vous saurez présenter votre univers de la manière la plus compréhensible possible.

Créer un site responsive

Quand vous imaginez votre visiteur dans un train, à 6h00 du matin :

Vous comprenez vite qu'il souhaite trouver l'information qu'il désire en un rien de temps !

Il est donc inutile de le bousculer psychologiquement avec des mises en page qui ne collent pas à sa taille d'écran..

mobile-first
Mobile First : Viser les internautes sur téléphone!

En 2021, le mobile first est devenu une réalité. Vous serez moins visible sur les résultats des moteurs de recherche si vous n'adaptez pas votre page sur téléphone.
D'ailleurs, il est indispensable de développer un design professionnel et unique sur téléphone ( et non pas seulement de réadapter simplement votre page.. ).

Pour savoir si votre site est bien adapté sur mobile, le tester sur votre appareil ne suffit pas :

Utiliser des images de qualité

Afin de proposer une page professionnelle à vos visiteurs, vous devez choisir d'intégrer des images qualitatives.

Comment ? En sélectionnant simplement vos plus belles photos et en les exportant au bon format.

D'ailleurs, il est important d'optimiser son image pour le web, mais également de la marier avec le décor de votre site.

Vous pouvez également utiliser le format .SVG pour garder une qualité optimale sur vos illustrations et votre logo.
Ce format fonctionne avec la méthode vectoriel.

Intégrer les bonnes balises

Si vous avez déjà travaillé sur WordPress, vous saurez alors qu'il est facile de créer le design d'un site (notamment en téléchargeant et en installant un thème).

Sur un CMS, il suffit d'importer et seuls les réglages restent à faire !

Mais une stratégie poussée en webdesign consiste à développer les éléments soi-même, en évitant toute forme de template.

C'est ici que vous allez développer tous les éléments :

  • HTML : Le contenu de votre site
  • CSS : La forme de votre site ( les couleurs, les mises en page )
  • JS : Les scripts ou animations sur votre site

Il est important que vos balises respectent le contenu de votre page, et le style que vous souhaitez véhiculer ne doit pas être un handicap pour la structure HTML.
Par exemple, si votre image est un décor en arrière-plan, vous devriez utiliser une attribut background-image en CSS plutôt qu'une <img> en HTML..

Éviter les fenêtres intrusive

Vous trouvez que les fenêtres surgissant sur l'écran de vos lecteurs sont agréables ?

C'est tout le contraire!

Il est important que votre site soit très facilement accessible à l'utilisateur et qu'il garde le contrôle sur l'utilisation.
L'interface de votre site doit comprendre l'information qu'il cherche rapidement, et sans l'interrompre lors de sa lecture.

D'ailleurs, Google préconise bien des règles appropriées au pop-up intrusives.

Foire aux questions

Comment designer un site qui fait plus de 100 pages ?

Si votre site internet est un one-page, alors nul besoin de développer un planning et travailler sur votre projet sur plusieurs mois…
Mais dans le cas d'un site bien construit, structuré et qui comprends plusieurs centaines de pages, alors le projet n'est plus le même.

Afin de pouvoir structurer votre travail et construire un site internet avec une stratégie réfléchie, veilliez à :

  1. Analyser et sélectionnez les pages les plus importantes de votre site ( Comme les pages parentes, et quelques pages enfants )
  2. Construire un planning et se focaliser sur une date de mise en ligne

Développer un site avec plus de 100 pages n'est pas choses facile et cela demande du temps.
Mettez donc vos objectifs à profit et en priorité lors de la construction de votre site.

Pourquoi comparer le design des sites de mes concurrents ?

Dans le cas où vous avez déjà votre site web, il sera alors plus facile de faire une refonte.
Mais dans le cas où vous n'en avez pas, alors il faudra s'armer de réflexion et établir une vraie stratégie.

Pourquoi comparer le design des sites de mes concurrents ?

  • Tout simplement pour analyser chacun de leurs codes graphiques et tirer partie des meilleures idées.
  • Cela vous permettra de créer un nouveau site web unique et basé sur des éléments que vous améliorez.
  • Vous ne réinventez pas la roue, vous tirez partie des meilleures idées en les améliorant.

 

Attention, visiter et s'inspirer des sites de vos concurrents n'est pas toujours la solution à entreprendre. Vous ne voudriez pas copier leurs erreurs?