Développement web – Niveau débutant

Objectif : acquérir les connaissances essentielles pour comprendre comment fonctionnent les sites internet.

• Comprendre la différence entre Internet et le Web.
• Identifier le rôle du navigateur et du serveur.
• Distinguer une page, un site et une application web.
• Découvrir les principales technologies du Web.
• Comprendre le rôle du HTML, du CSS et de JavaScript.
• Identifier les différentes étapes de création d’un site.

Objectif : concevoir une première maquette visuelle avant de commencer le codage.

• Comprendre les principes essentiels du Web Design.
• Découvrir les notions de hiérarchie visuelle et d’expérience utilisateur.
• Organiser les contenus d’une page.
• Choisir des couleurs, des polices et des éléments graphiques cohérents.
• Créer une première maquette avec Canva.
• Présenter et améliorer la maquette réalisée.

Objectif : créer et structurer une première page web.

• Installer et prendre en main Visual Studio Code.
• Créer les fichiers et dossiers du projet.
• Comprendre la structure d’un document HTML.
• Utiliser les principales balises HTML.
• Ajouter des titres, textes, images et liens.
• Transformer une maquette Canva en structure HTML.
• Construire une première page simple.
• Vérifier les connaissances grâce à un quiz.

Objectif : améliorer la présentation et l’organisation visuelle d’une page web.

• Comprendre le rôle du CSS.
• Relier une feuille de style à une page HTML.
• Utiliser les sélecteurs et les principales propriétés.
• Modifier les couleurs, les polices et les espacements.
• Organiser les éléments dans la page.
• Adapter l’affichage aux différentes tailles d’écran.
• Mettre en forme la page créée dans le module précédent.

Objectif : découvrir JavaScript et ajouter une première interaction à une page.

• Comprendre le rôle de JavaScript dans un site web.
• Relier un fichier JavaScript à une page HTML.
• Identifier les événements déclenchés par l’utilisateur.
• Modifier un élément de la page.
• Créer une interaction simple.
• Ajouter une fonctionnalité au projet réalisé.

Objectif : mobiliser les compétences acquises pour transformer une maquette en page fonctionnelle.

• Préparer les fichiers du projet.
• Transformer une maquette en structure HTML.
• Appliquer une mise en forme avec CSS.
• Adapter la page aux différents écrans.
• Ajouter une interaction avec JavaScript.
• Tester et corriger la réalisation.
• Présenter le projet finalisé.

Objectif : mieux comprendre les débouchés et identifier les possibilités de poursuite.

• Découvrir les principaux métiers du Web.
• Distinguer développement front-end, back-end et full-stack.
• Identifier le rôle du Web Designer et de l’UX/UI Designer.
• Repérer les compétences attendues dans le secteur.
• Découvrir les parcours de formation possibles.
• Définir les prochaines étapes de son apprentissage.

• Quiz de vérification des connaissances.
• Exercices pratiques au fil des modules.
• Création d’une maquette avec Canva.
• Construction progressive d’une page web.
• Ajout d’une fonctionnalité interactive.
• Réalisation et présentation d’un mini-projet final.

• Utilisation de Canva pour la conception de la maquette.
• Prise en main de Visual Studio Code.
• Création de fichiers HTML, CSS et JavaScript.
• Prévisualisation et test du projet dans un navigateur.
• Exercices de codage progressifs.
• Transformation d’une maquette en page web.

• Concevoir ou sélectionner une maquette simple.
• Structurer la page avec HTML.
• Appliquer la mise en forme avec CSS.
• Adapter l’affichage aux différentes tailles d’écran.
• Ajouter une interaction avec JavaScript.
• Tester et corriger les éventuels problèmes.
• Présenter la réalisation et expliquer les choix effectués.