Objectifs pédagogiques
A l'issue de cette formation, vous serez capable de :
- Réaliser la maquette graphique du site permettant au client de visualiser l'interface fonctionnelle et graphique de la plateforme Web
- Réaliser ensuite l'intégration de la maquette graphique en utilisant du code informatique qui sera interprété par les navigateurs
- Réaliser les animations, évènements et les différentes interactions avec l'interface utilisateur
- Optimiser le référencement naturel du site
- Veiller à ce que ce dernier s'adapte à tous les appareils et toutes résolutions (smartphones, tablettes, desktop).
Compétences attestées par la certification
Bloc 1 - Développement Front End de sites et applications Web (RNCP37805BC01)
- Utiliser les langages de balisage HTML et CSS (avec et sans framework) pour intégrer les maquettes graphiques en utilisant un éditeur de code
- Produire l'encodage en tenant compte des différentes contraintes imposées par les différentes résolutions d'écrans et les navigateurs afin d'obtenir un affichage optimisé pour smartphones, tablettes et desktop
- Considérer la diversité des publics, notamment en situation de handicap, afin d'améliorer l'expérience utilisateur, en mobilisant les différentes normes d'accessibilité (ex : RGAA)
- Travailler sur une logique d'intégration réutilisable, organisée et synthétique, à des fins de lisibilité et de performances, en utilisant un système de "classes" génériques et fonctionnelles
- Travailler le référencement naturel d'un site Internet tout au long de sa construction pour optimiser son positionnement en appliquant les recommandations pour les différents moteurs de recherche (hiérarchisation des contenus, sémantique, poids des pages...)
- Enrichir l'interface de l'application ou du site Internet en utilisant le langage JavaScript afin d'apporter à la partie Front End de l'interactivité et des animations
- Valider les saisies utilisateurs dans les formulaires afin de vérifier l'échange de données entre l'utilisateur et le serveur à l'aide de méthodes de validation adaptées (ex : expressions régulières)
- Développer des fonctionnalités mettant en jeu des requêtes asynchrones avec le serveur afin d'apporter de la fluidité et de l'interactivité sans rechargement de page en utilisant des API
- Optimiser les temps de développement en utilisant des ressources externes (librairies JavaScript) pour résoudre des problématiques de développement complexes.
Lien pour visualiser le détail du Titre enregistré au RNCP : https://www.francecompetences.fr/recherche/rncp/37805/
Niveau requis
Bonne connaissance de l'outil informatique, appétence pour le digital et le graphisme.
Public concerné
Graphistes, designers Web, intégrateurs, développeurs.
Programme
Déroulé du cursus
HTML 5, CSS 3, Responsive - Création de pages Web
- Référence M2i : HTM-FND
- Durée : 3 jours
- Objectifs pédagogiques :
- Décrire la structuration d'une page HTML 5
- Ajouter des styles CSS aux éléments d'une page
- Utiliser les blocs et les tableaux
- Créer des formulaires avec Web Forms 2
- Tester les nouveautés HTML 5 et CSS 3
- Exploiter les "media queries" pour s'adapter aux tailles d'écran
- Expliquer la philosophie des framemorks HTML / CSS pour le développement responsive
WordPress - Initiation - Création et gestion d'un site Web
- Référence M2i : WOR-PRES
- Durée : 3 jours
- Objectifs pédagogiques :
- Créer un blog ou un site Web professionnel avec WordPress
- Gérer les contenus
- Sélectionner et installer un thème
- Faire la mise en page avec Gutenberg et Elementor
- Créer et gérer des modèles de page avec Gutenberg
- Personnaliser l'en-tête et le pied de page avec le FSE (Full Site Editing) et Elementor Pro
- Ajouter des plug-ins et des widgets
- Gérer un hébergement de site Internet
Adobe XD - Design d'interface - Prototypages, mockups, wireframes
- Référence M2i : XD-UXUI
- Durée : 2 jours
- Objectifs pédagogiques :
- Identifier les bonnes pratiques de conception d'interfaces
- Créer des interfaces interactives de sites Web et d'applications mobiles
- Réaliser des parcours de navigation répondant aux besoins des utilisateurs
- Partager et tester des prototypes pour réaliser des interfaces fonctionnelles
UI Design et ergonomie - Le design d'interface centré utilisateur
- Référence M2i : UID-ERGO
- Durée : 2 jours
- Objectifs pédagogiques :
- Identifier les enjeux du design d'interface utilisateur
- Appliquer les règles du Design System
- Créer des interfaces de sites Web, d'applications et de logiciels
- Maintenir une cohérence graphique
- Trouver l'harmonie d'une interface
- Créer un dialogue interface / utilisateur
- Rendre une interface compréhensible
- Concevoir des prototypes d'interface
- Intégrer les notions de base de l'ergonomie des interfaces
- Identifier clairement les clés de la réussite
- Appliquer l'UX Design à la conception d'interfaces
- Adopter des démarches de conception itératives
- Organiser la récolte et l'analyse de données
- Améliorer la qualité des applications et des sites Web
- Estimer les implications dans le marketing
UX Design - Les clés de la réussite pour votre projet digital
- Référence M2i : COMV-UXD
- Durée : 2 jours
- Objectifs pédagogiques :
- Identifier les enjeux du design d'expérience utilisateur
- Utiliser les méthodes centrées utilisateur
- Identifier de façon claire les clés de la réussite
- Appliquer l'UX Design à la conception d'interfaces
- Adopter des démarches de conception itératives
- Organiser la récolte et l'analyse de données
- Améliorer la qualité des applications et des sites Web
- Mesurer les implications dans le marketing
- Identifier les intérêts de l'usage de l'IA dans les différentes étapes du UX Design
Algorithmique et programmation structurée
- Référence M2i : PRG-IN
- Durée : 3 jours
- Objectifs pédagogiques :
- Enumérer les connaissances nécessaires à l'apprentissage d'un langage de développement
- Reconnaître les structures de base de la programmation (boucles, conditions)
- Identifier les grands paradigmes de programmation (procédural, objet)
- Distinguer la notion d'objet et les concepts associés
- Identifier les variables et le typage des données
- Utiliser les algorithmes de tri face à des problématiques identifiées
JavaScript et jQuery pour les designers
- Référence M2i : JVS-DES
- Durée : 2 jours
- Objectifs pédagogiques :
- Définir les bases de JavaScript et du DOM
- Juger de l'intérêt de jQuery pour la programmation Cross-browser
- Gérer les évènements et les manipulations dynamiques avec jQuery
- Réaliser des appels synchrones (Ajax) avec jQuery
- Utiliser des plug-ins jQuery
Les fondamentaux de l'accessibilité numérique
- Référence M2i : ACCNUM-FND
- Durée : 1 jour
- Objectifs pédagogiques :
- Reconnaître les problèmes rencontrés par les personnes handicapées lorsqu'elles naviguent sur Internet
- Identifier les enjeux de l'accessibilité numérique
- Vous repérer dans l'environnement normatif national et international
- Intégrer l'accessibilité à votre projet
Préparation et passage du CCP (bloc 1) "Développement Front End de sites et applications Web" (3 jours)
Passage du CCP :
- Le candidat réalise l'intégration complète du site Internet ou de l'application en utilisant les dernières versions des langages de balisage HTML et CSS
- Il développe en utilisant le JavaScript les animations et différentes interactions utilisateur demandées dans le cahier des charges
- Il réalise le déploiement du site Internet ou de l'application sur le serveur
- Le candidat présente le résultat de son travail, le code source et argumente son travail effectué concernant le référencement naturel et le respect des normes d'accessibilité (critères RGAA) auprès des membres du jury composé de professionnels
- Eléments fournis :
- Les maquettes à intégrer
- Le cahier des charges
- Les éléments graphiques non optimisés à intégrer
- Un espace sur le serveur pour le déploiement
- Eléments attendus :
- Déploiement complet et fonctionnel du site Internet ou de l'application sur le serveur
- Pour valider un bloc, l'évaluation des acquis doit être supérieure à 50%
- Le jury de certification se réunit dans les 3 mois maximum après le jury d'évaluation
- Le candidat recevra un certificat de bloc en cas de réussite
Le contenu de ce programme peut faire l'objet d'adaptation selon les niveaux, prérequis et besoins des apprenants.
Modalités d’évaluation des acquis
- En cours de formation, par des productions
- Et, en fin de formation, par le passage du Titre professionnel "Développeur Web - Bloc 1"
Accessibilité de la formation
Le groupe M2i s'engage pour faciliter l'accessibilité de ses formations. Les détails de l'accueil des personnes en situation de handicap sont consultables sur la page Accueil et Handicap.
Modalités et délais d’accès à la formation
Les formations M2i sont disponibles selon les modalités proposées sur la page programme. Les inscriptions sont possibles jusqu'à 48 heures ouvrées avant le début de la formation. Dans le cas d'une formation financée par le CPF, ce délai est porté à 11 jours ouvrés.