gcch/haiku-atelier-2024
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
haiku-atelier-2024/docs/TODO.md
gcch de73fc619a init
2025-06-19 16:10:12 +02:00

3 KiB
Executable file
Raw Blame History

  • PAGE PANIER
    • [-] Bouton « Réinitialiser » pour les Articles
    • [-] Bouton « Réinitialiser » pour les Adresses
    • Sauvegarder la dernière adresse validée dans le LocalStorage
  • VITE
    • Récupérer les liens des fichiers JS depuis le manifeste dans les fichiers PHP
  • Menu Mobile
    • Reprendre pour suivre la maquette initiale
  • PayPal à faire
  • Styles pour les focus à faire
    • Boutons
    • Champs
  • Utiliser un polyfill pour BroadcastChannel
  • PAGE SHOP
    • Faire apparaître le menu des catégories de Produits quand on scroll vers le haut
  • PAGE PANIER
  • MÉTHODES DE LIVRAISON
    • Proposer la livraison à domicile en Belgique et en France pour le coût unique de 8 euros, quel que soit le montant de la commande
  • PAGE PRODUIT
    • Retirer les flèches de défilement.
    • Réduire l'image en focus pour que l'on perçoive les images précédentes/suivantes.
  • PIED DE PAGE
    • Réduire la hauteur.
  • TOUTES LES PAGES
    • Trouver la source des bordures superflues.

Bouton « Retour en haut »

Un bouton « Retour en haut » permet pour un Utilisateur de rapidement revenir au sommet d'une page fournie en contenu.

Ne pas proposer ce bouton pour des pages faibles en contenus. Hoa Loranger recommende ainsi d'utiliser le seuil de plus de quatre pages de contenu (une page correspond à ce qui traversé avec l'appui sur la touche Espace dans le navigateur).

Apparence et contenu

  • Un lien <a> vers une ancre située en haut de la page (par exemple #en-tete) OU un bouton utilisant JavaScript pour revenir en haut.
  • Cet élément doit en envelopper deux autres :
    • une icône sous forme de balises <img> ou <svg> avec un attribut aria-hidden="true" ;
    • un texte « Retour en haut » qui peut être visuellement caché mais toujours accessible par les lecteurs d'écrans via une classe .visuellement-cache.
  • Le bouton apparaît au sommet du reste du contenu.
  • On peut idéalement ajouter une impression de profondeur avec l'utilisation d'ombres.

Comportement

  • Le bouton apparaît en bas à droite de l'écran une fois que l'Utilisateur a défilé plus d'une page.

  • Il disparaît en-deça de ce seuil.

    • Le bouton reçoit alors l'attribut aria-hidden="true" et tabindex="-1" pour éviter que l'Utilisateur tab dessus par erreur.

  • Quand il reçoit le focus, cela doit être visuellement indiqué.

  • Il est idéalement le dernier élément dans la tabbing sequence.

  • Le clic sur le bouton renvoie l'Utilisateur au sommet de la page, avec ou sans défilement doux.

  • Considérations pour les Utilisateurs avec lecteurs d'écran :

    • Le renvoie au sommet de la page doit s'accompagner à un focus sur le premier élément pour le recevoir (par exemple un bouton).

Liens