Chargement...

Formulaires HTML

Le responsive adaptait les largeurs. Les formulaires ouvrent un nouveau chapitre : le visiteur tape et envoie. Le conteneur est form.

Pourquoi les formulaires comptent

Les pages statiques montrent ; les formulaires collectent. Sans form, le navigateur ne sait pas quels contrôles forment un envoi.

Réponse directe

1) form avec action et method. 2) contrôles avec name. 3) label for = id. 4) bouton submit. Le balisage d’abord.

📊 Form parts at a glance

Part	Job	Beginner tip
form	Groups controls for one submission	Keep related fields inside one form
action	URL or path that receives the data	Practice paths are fine while learning
method	How the browser sends the payload	get puts data in the URL; post uses the request body
input (+ others)	Collects a value from the user	Always set name for submitted keys
label	Names the field for people and assistive tech	for must match the control id
submit	Triggers sending the form	Prefer type="submit" on buttons

Squelette minimal de formulaire

Commencez par le conteneur et deux attributs. Un chemin d’exercice suffit pour apprendre.

Minimal form skeleton

html

<form action="/subscribe" method="post">
<!-- fields go here -->
</form>

Lire le squelette

form est la limite d’envoi
action = chemin de réception
post = corps
get = URL
404 sans vrai serveur est ok en apprenant

Champ étiqueté plus envoi

Au moins un champ et un moyen d’envoyer. for doit matcher id ; mettez name.

Subscribe form with label

html

<form action="/subscribe" method="post">
<label for="email">Email</label>
<input id="email" name="email" type="email" required>
<button type="submit">Subscribe</button>
</form>

Lire la démo d’abonnement

for et id relient
name clé du payload
type=email indice navigateur
button type=submit envoie

GET vs POST

get pour une recherche partageable ; post quand les données ne doivent pas rester dans la barre d’adresse.

Pratique — petit formulaire d’abonnement

form en post avec action d’exercice
input email étiqueté avec name
button type=submit
vérifier le rendu
sortir l’input un instant

Erreurs fréquentes

inputs hors form
name manquant
bouton sans type=submit
label/for décalés
confondre action et method

Résumé

form regroupe les contrôles pour un envoi
action + method décrivent la cible et le style
label et name rendent le champ envoyable
ensuite : attributs de formulaire

🧠 Testez Vos Connaissances

Prêt à Commencer

Testez Vos Connaissances

Mettez-vous au défi avec ce quiz interactif et voyez à quel point vous comprenez le sujet

❓

Questions

🎯

70%

Pour Réussir

♾️

∞

Temps

🔄

∞

Tentatives

📝 Instructions

Lisez chaque question attentivement
Sélectionnez la meilleure réponse pour chaque question
Vous pouvez refaire le quiz autant de fois que vous le souhaitez
Votre progression sera affichée en haut