Utilisation de la balise HTML <input type="radio">

Si vous créez un formulaire HTML et que vous voulez présenter à l'utilisateur plusieurs options, mais qu'il ne peut sélectionner qu'une seule option, alors la balise que vous devez utiliser est .

L'élément <input type="radio"> en HTML est utilisé pour créer des boutons radio sur une page Web. Les boutons radio sont généralement utilisés lorsque vous voulez limiter un utilisateur à une seule sélection parmi un ensemble d'options prédéfinies. C'est une pratique courante lors de la création de formulaires où vous voulez que l'utilisateur fasse un choix spécifique, comme choisir le sexe, accepter les conditions de service ou sélectionner une option de paiement.

Exemple de l'utilisation de <input type="radio">

Voici un exemple simple d'utilisation de cette balise dans un formulaire :

<form>
  <input type="radio" id="male" name="gender" value="male">
  <label for="male">Male</label><br>
  <input type="radio" id="female" name="gender" value="female">
  <label for="female">Female</label><br>
  <input type="radio" id="other" name="gender" value="other">
  <label for="other">Other</label>
</form>

Dans cet exemple, nous avons trois boutons radio pour sélectionner le sexe. Notez que tous les boutons partagent le même attribut name, cela fait en sorte qu'un seul bouton puisse être sélectionné à la fois.

Bonnes pratiques

Lorsque vous utilisez des boutons radio, il est recommandé d'inclure une balise <label> pour chaque bouton. Cela améliore l'accessibilité de votre site Web en permettant aux lecteurs d'écran de lire la description de chaque bouton.

En outre, veillez à bien grouper vos boutons radio en utilisant le même attribut name pour tous les boutons du même groupe. C'est ce qui permet de n'autoriser qu'une seule sélection.

Pour résumer, lors de la conception de formulaires HTML nécessitant de présenter plusieurs options mais n'autorisant qu'une seule sélection, la balise <input type="radio"> est la meilleure balise à utiliser.