Conseils
Un système de notation par étoiles permet aux utilisateurs d’évaluer facilement quelque chose.
À faire
- Utiliser une question claire pour que les utilisateurs sachent ce qu’on leur demande d’évaluer.
À ne pas faire
- Masquer les étiquettes de texte.
Vous devrez inclure gnb-star-rating-1.0.0.js pour utiliser cette composant.
Évaluation par étoiles
Quelle note attribuez-vous à cette page?
HTML
<!-- Évaluation par étoiles -->
<fieldset id="gnb-star-rating">
<legend class="sr-only">Évaluation par étoiles</legend>
<input value="1" id="star1" type="radio" name="rating" class="sr-only">
<label for="star1">
<span class="sr-only">1 sur 5</span>
<i class="fa-solid fa-star"></i>
</label>
<input value="2" id="star2" type="radio" name="rating" class="sr-only">
<label for="star2">
<span class="sr-only">2 sur 5</span>
<i class="fa-solid fa-star"></i>
</label>
<input value="3" id="star3" type="radio" name="rating" class="sr-only">
<label for="star3">
<span class="sr-only">3 sur 5</span>
<i class="fa-solid fa-star"></i>
</label>
<input value="4" id="star4" type="radio" name="rating" class="sr-only">
<label for="star4">
<span class="sr-only">4 sur 5</span>
<i class="fa-solid fa-star"></i>
</label>
<input value="5" id="star5" type="radio" name="rating" class="sr-only">
<label for="star5">
<span class="sr-only">5 sur 5</span>
<i class="fa-solid fa-star"></i>
</label>
<output></output>
</fieldset>