Bannière principale d’un site événementiel : rendre le premier écran utile
La bannière principale est la première section d’une page événementielle, mais elle ne représente pas tout le parcours d’inscription. Une personne qui arrive pour la première fois doit comprendre de quel événement il s’agit, quand et où il a lieu, et ce que fera le bouton principal. Rédigez cette réponse à partir des faits validés avant de choisir la photo ou la mise en page.
La rédaction de Boletolibre
Publié
1. Valider les faits avant d’écrire le titre
Nommez l’événement avec des mots compréhensibles pour une nouvelle personne. Ajoutez une phrase sur l’expérience ou le public, puis la date validée, l’heure de début avec fuseau horaire et le lieu ou le format en ligne. Pour une série, précisez l’édition ou la date représentée par cette page ; un slogan permanent ne remplace pas le programme actuel. Désignez une personne responsable de chaque fait susceptible de changer.
Télécharger la fiche modifiable de rédaction et de publication (Markdown, en anglais)
2. Hiérarchiser le premier écran
Faites du nom de l’événement le titre principal. Placez la date et le lieu concrets à proximité, puis expliquez brièvement pourquoi participer. Un slogan décoratif peut appuyer cette explication, mais pas la remplacer. Gardez les informations indispensables en texte de page, plutôt que seulement dans une affiche. Comparez leur ordre sur ordinateur et sur téléphone avec la fiche avant d’approuver la maquette.
3. Relier l’action principale à sa vraie destination
Choisissez une action principale selon l’état actuel de l’événement. « Choisir des billets » doit mener au bon événement ou au choix de la date ; « Rejoindre la liste d’intérêt » doit ouvrir un vrai formulaire, pas une caisse. Une deuxième action, par exemple consulter le programme ou l’accès, doit porter un libellé différent. Notez le texte du bouton, l’URL cible, le responsable et la date du test. Le W3C explique que le but d’un lien doit être compréhensible par son texte ou son contexte déterminable par programme.[1]
4. Tester la page publiée, pas seulement la maquette
Ouvrez la page publique sur téléphone et grand écran. Vérifiez la lisibilité de la date, du lieu et du bouton, le cadrage de l’image et le retour à la ligne sans défilement horizontal. Si des mots se superposent à une photo, contrôlez leur contraste dans le cadrage réel ; le W3C décrit le contraste insuffisant sur une image de fond comme un échec d’accessibilité. Suivez le bouton au clavier et en tant que nouvelle personne, puis vérifiez que la destination affiche le même événement et l’état actuel des ventes. Recommencez après tout changement de date, de lieu ou de lien billets.[2][3]
Sources et lectures complémentaires
- Understanding Link Purpose (In Context)W3C Web Accessibility Initiative · Consulté
- Understanding ReflowW3C Web Accessibility Initiative · Consulté
- Failure F83: Background images without sufficient text contrastW3C Web Accessibility Initiative · Consulté