site one page motion line

Réalisation d’un site one page (MotionLine)

L’année 2017 a commencé sur des chapeaux de roue pour l’agence ! Et nous avons déjà plusieurs beaux projets de sites web en chantier… Aujourd’hui on vous raconte une création de site vitrine type site one page.

Ce format de site est de plus en plus prisé par les entreprises et les agences de communication. Il convient particulièrement adapté aux projets à fort contenu graphique, et présente souvent un rendu très attractif. Il comporte cependant quelques inconvénients inhérents à sa structure même. On voit ça en détail dans notre exemple.

Rappelons que pour nos sites web, nous utilisons le CMS (Content Management System) WordPress.

 

➡️ A lire aussi sur le sujet : Comment (se) créer un site internet professionnel

 

1. La création d’un site one page

Le « one page design » consiste à présenter l’intégralité des informations sur une seule page. Son design se veut esthétique et épuré pour ne pas surcharger la page et rester dans un esprit sobre. En pratique la navigation se fait en scrollant horizontalement ou verticalement, ou bien à l’aide d’ancres (liens internes à la page) judicieusement placées dans le texte.

L’avantage premier est d’aller à l’essentiel ; à savoir le message, les prestations offertes, l’équipe, les références éventuelles, etc. En outre, de nombreux effets graphiques intéressants type parallaxe peuvent être mis en place et déclenchés au scroll. L’impact visuel est très réussi généralement.

Toutefois, en plus du fait qu’il ne s’adapte pas à toutes les activités, le site one page présente quelques inconvénients.

 

site one page motion line bannière header site

 

Les inconvénients majeurs :

  1. Le temps de chargement de la page peut être allongé (tous les contenus sont chargés en même temps). Or l’internaute n’est pas patient… On veillera donc notamment à optimiser au maximum le poids des images.
  2. Pas facile de faire évoluer un tel site ; tout l’équilibre visuel de la page peut être modifié en cas d’ajout de nouvelles informations. En pratique il sera souvent plus simple d’envisager plutôt la création de pages annexes.
  3. Le référencement d’un site one page est compliqué puisqu’on ne peut pas se baser sur des mots-clés ou des expressions cibles. Il faudra structurer intelligemment les contenus de la page et renseigner les méta-données en profondeur.

En pratique aujourd’hui, on voit de plus en plus de sites avec une page d’accueil structurée en « one page design », et des pages annexes permettant de travailler le contenu et le référencement. C’est d’ailleurs de cette façon qu’est construit notre propre site.

L’exemple qui suit explique les objectifs et l’organisation d’un site one page dans le milieu du graphisme.

 

➡️ A lire aussi sur le sujet : Les 20 meilleurs plugins pour WP

 

2. Motion Line c’est quoi ?

Motion Line représente un collectif de graphistes de talent désireux de montrer aux professionnels de la communication leur savoir-faire autour de la création d’images et/ou de films en 3D. Dans des domaines tels que l’imagerie promotionnelle, l’architecture, le packaging, le film d’animation ou le motion graphic, entre autres. Notre objectif premier restait de présenter en un coup d’œil leurs différents univers graphiques, le one page design s’avérait ici tout à fait pertinent.

Mais au-delà du seul site web, Motion Line c’est avant tout une création de marque, avec tous les éléments de communication associés (logo, charte graphique, baseline…). Pour mettre en valeur les différents visuels des artistes, nous avons opté pour un design très pur où prédomine le blanc, avec du rouge en touches. Un logo moderne et stylisé reprend les premières lettres de Motion et de Line.

 

one page design

 

Le site de type « vitrine » montre un éventail de leurs travaux (graphismes et vidéos) organisés en portfolio. Une navigation simple permet en quelques secondes de parcourir l’essentiel des informations. À savoir : brève présentation de l’activité, travaux déjà réalisés, équipe, prestations, outils maîtrisés, et pour finir les clients. Les textes sont tout aussi épurés et sobres. Et un formulaire de contact apparaît en bas de page.

Pour travailler sur le référencement, nous avons ensuite donné un titre pertinent à chacune des images du portfolio et des vidéos. De plus, des liens redirigent vers les réseaux sociaux Facebook et YouTube. Ces derniers reprennent les principales œuvres du site.

➡️ A lire pour aller plus loin : Une refonte de site internet type « vitrine »

 

Valérie Bernard
Fondatrice de Gimme Social Web & Le Chemin des Boss

🌟 J’accompagne en priorité les femmes en reconversion qui se lancent dans l’entrepreneuriat. Je les aide à construire leur stratégie digitale et à faire décoller leur nouvelle activité de manière alignée et authentique. Mais vous pouvez aussi me contacter si vous avez de la moustache 😊

 

 

  GSW - Agence Digitale à Paris - Une expertise large et des services personnalisés pour donner aux petites marques et aux jeunes entreprises les moyens de briller sur le web

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Retour en haut