Code Monkey home page Code Monkey logo

projet1_openclassrooms's Introduction

#Projet 1 Formation openClassRooms Septembre 2018


##Intégrez la maquette du site d'une agence web


###énoncé :

Vous venez d'être embauché(e) par une agence Web première mission : vous occuper de la refonte du site de l'agence.

Le site doit tenir sur une page avec un menu qui reste visible, en haut de la page, meme lorsque l'on se déplace dans la page. Les différentes sections attendues sont :

Un premier écran d'accueil de bienvenue, très visuel

La liste des services offerts par l'agence

Des exemples de projets déjà réalisés

Une carte avec un formulaire de contact (on ne vous demande pas de faire marcher le formulaire, juste de l'afficher).

Le site sera réalisé en HTML et CSS (sans framework tel que Bootstrap).

###Définir le contenu d'une page web à partir d'une maquette

  • L'ensemble du contenu défini par la maquette est présent
  • Le contenu texte est pertinent et grammaticalement correct
  • L'aspect visuel correspond à la maquette sur écran d'ordinateur
  • La maquette est adaptée de manière pertinente sur un terminal mobile
  • Les sliders et onglets ne sont pas nécessairement fonctionnels. JavaScript n'est pas requis pour ce projet.

###Coder la structure d'une page web en HTML

  • La page HTML passe la validation w3c HTML sans erreur
  • Les balises HTML sont définies avec la sémantique HTML 5 pertinente
  • Les icônes sont crées avec un outil pertinent, type font-awesome

###Coder la présentation d'une page web en

  • Le code CSS passe la validation w3c CSS
  • Le code CSS est écrit dans un ou plusieurs fichier CSS
  • Aucun code CSS n'est appliqué via un attribut style dans une balise HTML
  • La zone avec le menu reste visible, en haut de la page, même lorsque l'on se déplace dans la page

###Gérer la responsivité avec les Media Queries

  • Le viewport est configuré dans l'en-tête de la page HTML
  • (Au moins) Un breakpoint pertinent est défini
  • Des règles CSS @media et/ou des feuilles de styles dédiées identifiées par un attribut mediasont utilisées
  • Aucun Framework (type Bootstrap) n'est utilisé pour ce projet

###Présenter une réalisation de manière professionnelle

  • La soutenance est préparée
  • La tenue et l'attitude sont appropriées
  • Le support de présentation est soigné, respecte la structure imposée et le temps imparti
  • Le temps de présentation est respecté
  • Les réponses aux questions sont pertinentes

###Compétences à valider

  • Gérer la responsivité avec les Media Queries
  • Coder la présentation d'une page web en CSS
  • Présenter une réalisation de manière professionnelle
  • Définir le contenu d'une page web à partir d'une maquette
  • Coder la structure d'une page web en HTML

projet1_openclassrooms's People

Contributors

anais0210 avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.