---
# System prepended metadata

title: projet WEB

---

# projet WEB

# partie 1: definition du projet
header: logo notre-dame, accueil, collège, lycée
## accueil

9 Boulevard Sadi Carnot
95880 ENGHIEN-LES-BAINS
Tel : 01 34 12 63 78
_label éco-école 
_formation PSC1
_formation médiateurs
_fête de l'établissement

### collège 
_organisation des niveaux
    _ 1 responsable par niveau 
    _ 9 classes par niveau
    _ classes tremplins
    _ classes bilingue 
### lycée
_oraganisation des niveaux
    _ 1 responsable par niveau
    _ 8 classes de seconde
    _ 6 classes de premiere et terminale 
    
9 spécialités:
• Mathématiques
• Histoire, géographie, géopolitique 
et sciences politiques
• Humanités, littérature et philosophie
• Langues, littératures et cultures étrangères
• Physique chimie
• Sciences de la vie et de la terre
• Sciences économiques et sociales
• Numérique et sciences informatiques
• Science de l’ingénieur
_test positionnement 
_projet course en cour classe de science de l'ingenieur 

# partie 2: base de la conception

## Qu’est-ce qu’un header dans une page HTML ?
Le header est l'en-tête d'une page internet, il permet de naviguer facilement entre les pages

## Qu’est-ce qu’un footer dans une page HTML ?
Le footer d'une page est l'élément que l'on retrouve au pied de celle-ci, il contient les informatioons sur l'auetur et les copyrights  
## À quoi sert la balise nav ?
La balise nav est la balise qui permet la navigation et la creation de menus
## Quelle est la différence entre la balise span et la balise div ?
La balise span regroupe des éléments, alors que la balise div les divise

# partie 3: structures des pages HTML
![](https://i.imgur.com/o2S4LKq.png)
![](https://i.imgur.com/sO72ox3.png)
![](https://i.imgur.com/2iSKmWT.jpg)


# partie 4: ajout des feuilles de styles 

# partie 5: démo 

lien:https://www.loom.com/share/1077ef256d2e46f7af5b8284d7233933


script:
bonjour ja vais vous presenter mon projet qui avait pour objectif de mettre en place un site presentant l'établissement notre dame de la providence a enhien les bains. Pour se faire j'ai essayer de respecter au maximum mes maquettes realiser ulterieurement.
On retrouve ainsi une page d'accueil commosé d'un menu reliant mes 3 pages entre elles grace a des liens hypertext . Ce menu est horizontale afin de rendre la mise en page plus ergonomique.
J'ai choisis des tons bleus comme ligne directrice mais aussi des ton orangés afin de definir une zone de surbrillance dans le menu pour respecter les couleurs du logo de l'etablissement . On peut voir aussi que l'arriere plan de l'acceuil est composé de deux couleurs differentes(inspiration site m.pourcher.fr)
Lorsque l'on se rend sur la page du college on observe que la zone dédiée au changement de page passe a l'orange et que le texte passe de blanc à la meme couleur que le menu.
La page est composé d'un titre encadré ainsi que du même menu que la page precedente.On retrouve les resultats du brevet 2021. Une image de l'établissement.Ainsiqu'une liste a puces qui a pour but d'apporter des informations sur l'organisation des niveaux du collège .
La page du lycée possede la meme configuration que celle du college. On retrouve deux listes a puces que j'ai reussi a separe grace a une balise br que j'ai trouver grace a l'aide du site stackoverflow.Ainsi qu'une photo de l'établissement.
Les principales difficultés que j'ai rencontrées portaient plus sur la creativité et ainsi la partie CSS, le choix des couleurs et la disposition des balises j'ai donc realiser de nombreux esais avec differentes couleurs et dispositions pour obtenir un resultat qui me convienne et doc resoudre ce probleme
