Ce cours décompose les formulaires HTML en éléments faciles à comprendre. Dans les prochains modules, vous découvrirez comment fonctionne un formulaire HTML et comment l'utiliser efficacement dans vos projets. Pour parcourir les modules, utilisez le volet de menu situé à côté du logo Learn Forms (Apprendre à utiliser les formulaires).
Vous allez apprendre à créer un formulaire HTML de base, à utiliser des éléments de formulaire HTML, à définir le style des formulaires, à aider les utilisateurs à saisir à nouveau des données, à s'assurer que le formulaire est accessible et sécurisé, à tester vos formulaires et à des types de formulaires spécifiques.
Chaque module propose de nombreuses démonstrations interactives et des auto-évaluations vous permettant de tester vos connaissances.
Ce cours s'adresse aux développeurs HTML débutants comme avancés. Les premiers modules vous aident à créer des formulaires HTML, les autres modules fournissent plus de détails. Vous pouvez parcourir la série du début à la fin pour mieux comprendre les formulaires HTML, ou choisir un module spécifique qui vous intéresse.
Prérequis
Avant de commencer ce cours, vous devez connaître le langage HTML. Pour ceux qui débutent dans le développement Web, consultez le cours Introduction to HTML de MDN pour tout savoir sur la rédaction de balisages.
Démonstrations
Nous utilisons CodePen pour la plupart des démos.
En regardant les démonstrations, vous vous demandez peut-être d'où viennent les styles. Nous utilisons une feuille de style générale incluse dans toutes les démonstrations, de sorte que seuls les styles pertinents y sont affichés. Dans CodePen, vous pouvez sélectionner les fichiers CSS inclus dans "Paramètres".
Commandes et champs de formulaire
Une commande de formulaire est un élément qui permet une interaction avec l'utilisateur, et la saisie ou la sélection de données : <input>, <select>, <textarea> ou <button>.
Parfois, le champ de formulaire est utilisé pour faire référence à des commandes de formulaire, en particulier des éléments de saisie de texte: <input> et <textarea>.
Objectifs de l'atelier
Obtenir des données des utilisateurs à l'aide de formulaires
Découvrez les principes de base de l'utilisation d'un formulaire sur le Web dans cette présentation de l'élément de formulaire.
Aider les utilisateurs à saisir des données dans des formulaires
Présentation des différents éléments disponibles pour créer votre formulaire.
Éviter aux utilisateurs de saisir à nouveau des données dans les formulaires
Aidez les utilisateurs à remplir les formulaires plus facilement.
Aider les utilisateurs à saisir les bonnes données dans les formulaires
Découvrez comment valider vos formulaires sur l'interface.
Tester vos formulaires
Découvrez comment tester et analyser vos formulaires.
Principes de base de la conception
Découvrez comment créer des formulaires faciles à utiliser.
Accessibilité
Créer des formulaires inclusifs
Internationalisation et localisation
Préparez-vous aux formats de données internationaux et découvrez comment planifier la localisation de votre formulaire.
Sécurité et confidentialité
Découvrez comment sécuriser vos formulaires et préserver la confidentialité des données de vos utilisateurs.
Saisie automatique
En savoir plus sur la saisie automatique et l'attribut de saisie semi-automatique
Tester l'usabilité des formulaires
Découvrez comment effectuer des tests d'usabilité et vous assurer que votre formulaire fonctionne bien pour tous vos utilisateurs.
Tester des formulaires sur différents appareils et plates-formes
Assurez-vous que votre formulaire fonctionne avec différents appareils, navigateurs, plates-formes et contextes.
Collecte de données
Découvrez comment mesurer et analyser les données de votre formulaire.
Éléments du formulaire en détail
Découvrez en détail les éléments de formulaire, les cas dans lesquels les utiliser et leur fonctionnement.
Informations détaillées sur les champs des formulaires
Découvrez les différents champs de formulaire que vous pouvez utiliser et comment choisir le bon élément de formulaire.
Informations détaillées sur les attributs des formulaires
Découvrez tout ce qu'il faut savoir sur les attributs de formulaire: modifier la disposition des claviers à l'écran, activer la validation intégrée, etc.
Appliquer un style à des formulaires
Appliquez des styles aux formulaires à l'aide de CSS, tout en vous assurant qu'ils restent utilisables et lisibles par tous.
Appliquer un style aux commandes de formulaire
Découvrez comment implémenter des commandes de formulaire avec CSS.
JavaScript
Découvrez comment utiliser JavaScript pour améliorer vos formulaires.
Modes de paiement
Améliorez les taux de conversion en créant de meilleurs modes de paiement.
Formulaires d'adresse
Aidez les utilisateurs à remplir les formulaires d'adresse rapidement et facilement.
Conclusion et prochaines étapes
Autres ressources pour vous aider à passer aux étapes suivantes.
Alors, êtes-vous prêt à découvrir les formulaires ? C'est parti !