Culture Web : Front-end
Comprenez enfin ce qui s'affiche dans le navigateur : HTML, CSS, JavaScript et Bootstrap, sans devenir développeur.
Module 1 sur 8 du parcours Devenir Freelance Webmaster ™, disponible seul ou dans un pack.
Avez-vous déjà été bloqué sur des questions comme :
- Que veut dire ce code quand j'ouvre l'inspecteur de mon navigateur ?
- Pourquoi ce bloc ne se place pas là où je veux ?
- Comment modifier une couleur ou une police sans casser toute la page ?
- Comment vérifier que ce qu'une IA ou un développeur m'a livré est propre ?
- C'est quoi la différence entre HTML, CSS et JavaScript ?
- Pourquoi mon site ne s'affiche pas pareil sur mobile ?
Vous n’êtes pas seul !
Beaucoup de webmasters construisent des sites sans jamais avoir compris ce qu’il y a dessous. Résultat : dès qu’un détail coince, ils sont bloqués.
La bonne nouvelle, c’est que les bases du front-end s’apprennent en quelques jours, à condition de les voir dans l’ordre et avec des exemples concrets.
Culture Web : Front-end en 4 points
- Pour qui : Créateurs de sites (webmasters, freelances, agences) qui utilisent WordPress ou un constructeur de pages sans avoir jamais appris les bases du code.
- Temps d'application : 2 semaines, à raison d'une heure par jour
- Cas pratiques : Chaque notion est montrée dans le navigateur et dans l'éditeur de code, puis appliquée dans une mission de fin.
- Objectif : Lire et modifier du HTML, du CSS et du JavaScript simple en comprenant ce que vous faites, et relire le travail des autres.
Le programme complet de la formation
Introduction
- Ce que vous allez vraiment savoir faire à la fin, et pourquoi ce n'est pas « apprendre à coder ».
Les bases
- Ce qui se passe entre le clic et la page affichée, en une image que vous n'oublierez plus.
- HTML, CSS, JS et les frameworks : qui fait quoi, et lequel vous n'aurez jamais besoin d'écrire vous-même.
Outils à installer sur votre ordinateur
- Les deux outils gratuits qui suffisent pour tout le reste de la formation.
- L'astuce Visual Studio Code qui fait gagner une minute par fichier (la plupart des webmasters l'ignorent).
HTML
- Le squelette commun à toutes les pages du web, à écrire les yeux fermés.
- La balise que personne ne voit mais que Google lit en premier.
- Textes, listes, liens, images, tableaux, formulaires : chaque brique en une vidéo courte.
- Comment lire le code source de n'importe quel site pour comprendre comment il est fait.
- Un quiz pour vérifier que c'est acquis.
CSS
- Les trois façons d'ajouter du CSS, et la seule que vous devriez utiliser.
- Sélecteurs, unités, polices : le vocabulaire pour relire une feuille de style sans sueur froide.
- Le Box Model expliqué une bonne fois, celui qui explique 80 % des « ça dépasse » et « c'est pas aligné ».
- Flexbox et Grid : les deux outils de mise en page qui ont remplacé tout le reste.
- Pourquoi
!importantest presque toujours un aveu, et quoi faire à la place. - Comment faire écrire votre CSS par une IA, et savoir quand elle se trompe.
JS
- Variables, conditions, boucles, fonctions : la grammaire de JavaScript sans jargon.
- Les événements, ou comment une page réagit à ce que fait le visiteur.
- Les erreurs JavaScript les plus courantes, et comment les repérer en dix secondes dans le navigateur.
- Appeler une API et lire du JSON : ce que vos clients vous demanderont un jour sans savoir que c'est ça.
- Comment utiliser ChatGPT pour comprendre un code que vous n'avez pas écrit (et répondre à un besoin client sans développeur).
- Les codes JavaScript connus à copier-coller, qui dépannent sur presque tous les sites.
Bootstrap
- Pourquoi un framework CSS existe, et ce qu'il vous évite d'écrire.
- La grille Bootstrap, responsive dès le départ, sans une ligne de media query.
- Composants, utilitaires, icônes : monter une page propre en une heure.
- Comment surcharger Bootstrap sans tout casser.
Mission de fin
- Une mission concrète, comme un vrai client la demanderait, avec un exemple corrigé.
- La possibilité de demander un avis sur votre rendu.
A propos de votre formateur
Je m’appelle Johann ROCHE et je vais être votre formateur pour les prochaines semaines.
J’ai réalisé mon premier site en 1998 par passion, puis suivi un cursus Web dont 7 ans en Agence web et 7 ans en tant que Freelance.
En 1999, la conseillère d’orientation m’a demandé :
“Tu veux faire quoi plus tard ?”
J’ai répondu “Webmaster” !
A l’époque elle ne savait même pas ce que c’était. Pour ma part cela faisait déjà quelques années que je bidouillais des sites la nuit sur mon ordinateur et que je partageais mes découvertes avec d’autres passionnés.
Plus tard dans mon cursus j’ai travaillé sur tous les types de projet web (de la petite page d’attente à 150€ au gros projet sur mesure à plus de 30 000 €).
J’ai eu plusieurs rôles : stagiaire, apprenti, intégrateur, développeur, technico-commercial, chef de projet, responsable technique, formateur, indépendant… et plus récemment WebEntrepreneur.
Aujourd’hui, j’ai simplement envie de partager mon expérience de ce métier et de le synthétiser dans des formations. C’est la suite logique de ma carrière.
Quelques dates clés résumant mon parcours
1998
2001
2005
2007
2010
2013
2014
2015
2016
2017
2018
2019
2020
2021
2023
2024
Témoignages des élèves des formations WebAndFree
Objectifs avec cette formation :
Lire le code d'une page et comprendre ce que fait chaque partie.
Modifier une mise en forme sans casser le reste du site.
Repérer un code mal fait, qu'il vienne d'un prestataire ou d'une IA.
Parler le même langage que les développeurs avec qui vous travaillez.
Rejoindre la formation
Culture Web : Front-end
- Chapitre 1 - Introduction
- Chapitre 2 - Les bases
- Chapitre 3 - Outils à installer sur votre ordinateur
- Chapitre 4 - HTML
- Chapitre 5 - CSS
- Chapitre 6 - JS
- Chapitre 7 - Bootstrap
- Chapitre 8 - Mission de fin
- Un espace de questions sous chaque leçon
199 €
- Droit de rétractation 14 jours
Satisfait ou Remboursé
Récapitulatif
Voilà, ce à quoi vous aurez accès, si vous rejoignez la formation maintenant :
- Accès immédiat et à vie aux 8 chapitres et 87 leçons de la formation sur l'espace membre
- Accès à vie à toutes les mises à jour de la formation ainsi que les différents bonus qui viendront s'ajouter
- Le groupe Facebook WebAndFree pour échanger avec les autres webmasters
- Garantie de 14 jours : remboursement à 100% quelle que soit votre raison dans les 14 jours suivant votre paiement.
- Un espace de questions sous chaque leçon
Que se passe-t-il après votre paiement ?
Une fois le paiement réalisé vous allez recevoir un email pour accéder à la formation.
Vous pourrez immédiatement commencer à suivre les cours.
- Vous allez recevoir l'accès à la formation complète.
- Chaque leçon a son espace de questions
- La formation est améliorée au fur et à mesure des retours des nouveaux élèves
- Vous aurez accès à vie à la formation, et donc aux futurs contenus ajoutés.
Et si vous n'êtes pas satisfait ?
C’est simple ! Je vous rembourse à 100% dans les 14 jours, sur simple email de votre part.
Questions fréquentes
Aucun. La formation démarre de zéro. Il faut juste être à l’aise avec un ordinateur.
87 leçons, en vidéos courtes. Comptez deux semaines à une heure par jour pour la suivre et faire la mission de fin.
Non. Tous les outils utilisés sont gratuits.
La formation est disponible sur un espace privé accessible à vie depuis n’importe quel appareil (ordinateur, tablette, smartphone).
Chaque module est composé de vidéos courtes, de textes pour accompagner les vidéos et de liens vers les outils utilisés.
Oui, sans problème. Vous avancez à votre rythme, l’accès n’a pas de limite de temps.
Oui. C’est l’un des huit modules de la formation Devenir Freelance Webmaster, vendu ici à l’unité. Si vous avez déjà rejoint Devenir Freelance Webmaster, vous y avez déjà accès dans votre espace membre.