Mélusine Rey

Page de destination d'un produit

Projet landing page
Exercice : créer la page d'accueil d'un produit

Contexte

Cet exercice a été réalisé dans le cadre des cours de freeCodeCamp (curriculum "Responsive Web Design"). Le site et les instructions étant en Anglais, j'ai travaillé en Anglais également.

Il nous était demandé de créer une page de vente de produit incluant :

  • une barre de navigation fixe avec un logo et au moins 3 éléments
  • une vidéo intégrée
  • un formulaire, comportant au moins un champ "email" et un bouton de validation qui renvoie vers une autre page.
Nous devions utiliser au moins une flexbox (boîte flexible) et un @media query (qui permet d'adapter l'affichage en fonction de la taille de l'écran). J'ai reproduit la même chose que sur le modèle donné avec les instructions.

Vous pouvez consulter les instructions complètes directement sur freeCodeCamp.


Procédé

Pour cet exercice j'ai utilisé du HTML et du CSS. J'ai également utilisé plusieurs flexboxes et des icônes Font-Awesome.

Vous pouvez cliquer sur l'image pour voir la page ou visualiser le code sur ce CodePen.