Booki ✈️🏝

Troisième projet du parcours Intégrateur-web chez OpenClassrooms. L'objectif est d'intégrer la maquette d'un site de planification de vacances nommé "Booki" (voir l'image ci-dessous)

Spécifications fonctionnelles

● Les usagers pourront rechercher des hébergements dans la ville de leur choix. Le champ de recherche est un champ de saisie. La partie recherche ne doit pas être fonctionnelle.

● Chaque carte d’hébergement ou d’activité devra être cliquable dans son intégralité. Pour l’instant, les liens sont vides. On peut utiliser un attribut href=”#” pour simuler la présence d’un lien.

● Les filtres doivent changer d’apparence au survol. Par contre, ils ne doivent pas être fonctionnels.

● Les textes “Hébergements” et “Activités”, situés dans l’en-tête, sont des liens. Ils doivent mener respectivement vers la section “Hébergements à Marseille” et “Activités à Marseille”.

Spécifications techniques

● Deux maquettes ont été réalisées : l’une desktop et l’autre mobile. Le site devra être également adapté aux formats tablette.

● Il faut d’abord réaliser l’intégration en desktop first, puis les tablettes et enfin les téléphones. Plusieurs formats et tailles d’images ont été exportés. Il faudra choisir le format le plus adapté par rapport à la résolution et au temps de chargement.

● Les icônes proviennent de la bibliothèque Font Awesome.

● Les couleurs de la charte sont le bleu (#0065FC), une version plus claire de ce bleu (#DEEBFF) et le gris pour le fond (#F2F2F2).

● La police du site est Raleway.

● Utiliser les pixels et les pourcentages plutôt que les REM et les EM.

● Utiliser Flexbox plutôt que Grid.

● Aucun framework CSS ne doit être utilisé

● Utiliser des balises sémantiques.

● Le code doit être valide aux validateurs W3C HTML et CSS.

● La maquette doit être compatible avec les dernières versions de Google Chrome et de Mozilla Firefox.

Venez visiter mon site https://rose-pauline.github.io/Booki/