C'est l'été ! 
Site Web Stade de foot de Brest : Différence entre versions
(→Étapes de votre projet) |
(→Objectifs) |
||
| Ligne 6 : | Ligne 6 : | ||
===Objectifs=== | ===Objectifs=== | ||
| − | Objectifs du Projet | + | '''Objectifs du Projet''' |
Le projet de site web sur le Stade Brestois vise à : | Le projet de site web sur le Stade Brestois vise à : | ||
| Ligne 20 : | Ligne 20 : | ||
Utiliser HTML, CSS structurer et styliser les contenus du site. | Utiliser HTML, CSS structurer et styliser les contenus du site. | ||
| − | Objectifs Pédagogiques | + | '''Objectifs Pédagogiques''' |
À l’issue de ce projet, les participant·e·s seront capables de : | À l’issue de ce projet, les participant·e·s seront capables de : | ||
| Ligne 32 : | Ligne 32 : | ||
Travailler en autonomie sur un projet de site web et respecter une arborescence organisée des fichiers et ressources. | Travailler en autonomie sur un projet de site web et respecter une arborescence organisée des fichiers et ressources. | ||
| − | Technologies Utilisées | + | '''Technologies Utilisées''' |
HTML5 : Structure de base du site. | HTML5 : Structure de base du site. | ||
Version du 25 mars 2025 à 16:44
Sommaire
Auteur
Yann présente : Le site web de stade de foot de Brest
Projet
Courte description de votre Projet initial
Objectifs
Objectifs du Projet
Le projet de site web sur le Stade Brestois vise à :
Présenter l'histoire et l'actualité du Stade Brestois de manière interactive et visuellement attrayante.
Concevoir une interface ergonomique permettant une navigation fluide et intuitive.
Offrir aux visiteurs des informations actualisées sur les matchs, les résultats, les joueurs et les événements liés au club.
Mettre en place une galerie multimédia avec photos et vidéos pour enrichir l'expérience utilisateur.
Utiliser HTML, CSS structurer et styliser les contenus du site.
Objectifs Pédagogiques
À l’issue de ce projet, les participant·e·s seront capables de :
Structurer un site web en utilisant HTML5 de manière sémantique.
Styliser et personnaliser un site avec CSS3 en respectant les bonnes pratiques du design web.
Gérer des menus déroulants et des sliders d’images afin de dynamiser l’affichage des contenus.
Travailler en autonomie sur un projet de site web et respecter une arborescence organisée des fichiers et ressources.
Technologies Utilisées
HTML5 : Structure de base du site.
CSS3 : Mise en page et stylisation.
Font Library : Intégration de polices spécifiques pour l’identité visuelle.
Fonctionnalités Principales du Site
Page d'accueil : Présentation du Stade Brestois avec un slider mettant en avant les actualités principales.
Menu de navigation : Accès rapide aux différentes sections (historique, matchs, joueurs, événements, galerie).
Historique du club : Informations sur la création et l'évolution du Stade Brestois.
Matchs et résultats : Mise à jour des matchs à venir et des résultats récents.
Effectif et joueurs : Présentation des joueurs actuels, historiques et de l’équipe féminine.
Événements : Agenda des événements futurs et archives des événements passés.
Galerie multimédia : Photos, vidéos et liens vers les réseaux sociaux du club.
Étapes de votre projet
1ère Etapes:
Nous allons tout d'abord créer notre dossier html, pour cela nous allons ouvrir Visual Studio Code et taper nos première ligne de code:
<!DOCTYPE html>
<html lang="fr">
La première ligne signifie que le langage de la page sera en HTML
La deuxième est pour la langue, on signifie bien FR pour français pour qu'il prenne en compte les accents
Vous pouvez enregistrer le ficher une première fois et le renommer "index"
Nous allons ensuite s'occuper de la balise <head>
L'élément <head> contient les métadonnées (informations générales) du document, comme le titre, les liens et les scripts.
Compétences
Noter ici les compétences dont vous avez eu besoin
date
Préciser la date de votre projet
Ressources
- Liens vers des ressources en lien avec votre projet
- Votre présentation finale (celle que vous allez présenter au jury)
Aide technique
matériel et outils pédagogique Logiciels : VSCode, Inkscape Ressource internet: GITHUB
matériel et outils utilisés
PC
Photos
Différentes photos de votre projet
