Accessibility Assistant

Assistant d'accessibilité :
Guide d'installation et d'utilisation de Shopify

1. Comment installer

Comment installer l'application depuis la boutique d'applications Shopify

a. Rendez-vous sur la boutique d’applications Shopify.

b. Recherchez l’application « Assistant d’accessibilité ».

c. Cliquez sur l’application.

d. Cliquez sur « Ajouter une application ». Vous serez invité à vous connecter à votre boutique Shopify si vous ne l’avez pas déjà fait.

e. Après la connexion, Shopify affichera l’écran de demande d’autorisation de l’application.

f. Cliquez sur Installer l’application.
g. Une fois l’application installée, vous serez redirigé vers sa page de configuration dans votre interface d’administration Shopify.
h. Suivez le guide d’utilisation pour le configurer pour votre magasin.

2. Activez l'Assistant d'accessibilité dans votre thème Shopify

a. Connectez-vous à votre interface d’administration Shopify.

b. Accédez à la boutique en ligne > Thèmes.

c. Trouvez le thème que vous souhaitez modifier et cliquez sur Personnaliser.

d. Dans l’éditeur de thème, cliquez sur l’icône Intégrations d’applications.

e. Trouvez l’Assistant d’accessibilité.

f. Activez-le.

shopify-app-embed

g. Cliquez sur Enregistrer en haut à droite.

3. Aperçu

L’Assistant d’accessibilité est conçu pour rendre les sites web accessibles à tous, y compris aux personnes ayant des déficiences visuelles, auditives, motrices ou cognitives. Notre mission est d’allier innovation et responsabilité sociale afin que chaque entreprise puisse offrir une expérience en ligne inclusive.

4. Sélectionnez votre forfait et vos offres

Choisissez votre forfait mensuel :

Commencez par choisir l’abonnement mensuel qui vous convient. Chaque abonnement propose différentes fonctionnalités et options de personnalisation. L’abonnement choisi déterminera les fonctionnalités accessibles dans le widget. De plus, profitez d’un essai gratuit de 5 jours pour découvrir toutes les fonctionnalités et optimiser l’accessibilité de votre boutique.

Choisissez votre forfait annuel :

Choisissez l’abonnement annuel qui correspond le mieux à vos besoins. Chaque abonnement propose diverses fonctionnalités et options de personnalisation. L’abonnement choisi déterminera les fonctionnalités disponibles dans le widget. De plus, profitez d’une année gratuite pour découvrir toutes les fonctionnalités et optimiser l’accessibilité de votre boutique.

Startup

Essai gratuit de 7 jours

$ 3.75  /Mensuel

44,99 $ / an.

Économisez 2,89 $ par rapport à un abonnement mensuel !

  • icône Impressions illimitées et visibilité du widget sans restriction

Croissance

Essai gratuit de 7 jours

$ 5.92  /Mensuelle

$70.99 / Année.

Save $12.89 vs Monthly!

  • icône Impressions illimitées et visibilité du widget sans restriction

Établi

Essai gratuit de 7 jours

$ 15.00  /Mensuel

$179.99 / Année.

Économisez 35,89 $ par rapport au paiement mensuel !

  • icône Impressions illimitées et visibilité du widget sans restriction

Startup

Essai gratuit de 7 jours

$ 3.99  /Mensuel
  • icône Impressions illimitées et visibilité du widget sans restriction

Croissance

Essai gratuit de 7 jours

$ 6.99  /Mensuel
  • icône Impressions illimitées et visibilité du widget sans restriction

Établi

Essai gratuit de 7 jours

$ 19.99  /Mensuel
  • icône Impressions illimitées et visibilité du widget sans restriction

5. Comment activer/désactiver le widget

Les clients auront la possibilité d’utiliser le plugin pour accéder aux fonctionnalités avancées. Grâce à ce plugin, ils pourront activer ou désactiver les fonctionnalités et accéder à l’application sur leur système.

1. Comment activer/désactiver le widget

Les clients peuvent gérer la visibilité du widget directement depuis les paramètres du widget en l’activant ou en le désactivant.

2. Comment activer le widget d'accessibilité et ajouter un lien de pied de page

a. Accédez à votre administration Shopify.
b. Accédez à Boutique en ligne → Personnaliser pour ouvrir le personnalisateur de thème.
c. Allez sur App Embeds.er.

d. Recherchez et activez l’Assistant d’accessibilité.

e. Ensuite, accédez aux paramètres de l’application et activez l‘option « Voulez-vous l’ajouter comme lien ? » dans les paramètres du widget.

Comment ajouter un lien d’accessibilité à votre pied de page :

a. Accédez à la boutique en ligne → Navigation.

b. Sélectionnez le menu Pied de page.

c. Cliquez sur Ajouter un élément de menu.

d. Dans le champ Nom, saisissez : Assistant d’accessibilité
e. Dans le champ Lien, collez ce code :

f. Cliquez sur Ajouter, puis sur le menu Enregistrer.

6. Choisir le design

L’option « Choisir un design » permet aux marchands de sélectionner parmi une variété de styles de design pour notre widget, afin de l’adapter à leurs préférences et besoins spécifiques.

7. Personnaliser la position

La fonctionnalité « Personnaliser la position » permet aux marchands d’adapter précisément le placement de notre widget, garantissant ainsi une parfaite intégration à la mise en page et à la vision de conception de leur site.

  • Position sur ordinateur : Les clients peuvent définir la position du widget sur ordinateur.
    (En haut à gauche, en haut à droite, au milieu à gauche, au milieu à droite, en bas à gauche, en bas à droite).
  • Position mobile : Les clients peuvent définir la position du widget sur mobile
    (En haut à gauche, en haut à droite, au milieu à gauche, au milieu à droite, en bas à gauche, en bas à droite).
  • Marge intérieure du widget flottant : ceci ne fonctionnera que lorsque la position est définie sur
    « Bas gauche » ou « Bas droit ».
  • Taille du widget flottant : Personnalisez la taille du widget d’accessibilité selon vos préférences.

8. Caractéristiques

Utilisez les paramètres du menu pour activer ou désactiver les fonctionnalités.

Navigation et saisie

  • Navigation au clavier
  • Mettre en surbrillance les liens
  • Info-bulle Alt de l’image
  • Alignement
  • Ajuster les couleurs d’arrière-plan
  • Liens utiles
  • Navigation vocale
  • Clavier virtuel

Affichage et commandes multimédias

  • Curseur
  • Polices lisibles
  • Arrêter l’animation
  • Masquer l’image/la vidéo
  • Sons muets
  • Surligner le survol
  • Parler et taper
  • Désactiver le son du widget

Personnalisation du contenu

  • Modes de saturation
  • Masque de mise au point
  • Espacement des mots
  • Discours texte
  • Mise à l’échelle du contenu
  • Mettre l’accent sur la mise au point
  • Options daltoniennes
  • Désactiver le rapport de problème
  • Masquer la déclaration

Visual Enhancements

  • Contraste
  • Texte plus gros
  • Surlignage du titre
  • Optimiseur de texte
  • Espacement des lettres
  • Hauteur de ligne
  • Ajuster les couleurs du texte
  • Ajuster les couleurs du titre
  • Masquer GIF
  • Mode lecture
  • Gros curseur noir
  • Options de profil
  • Désactiver la marque
  • Variable de langue

Déclaration

Les clients peuvent modifier le contenu du relevé ou ajouter un lien vers la page du relevé en activant ou en désactivant l’option de lien vers le relevé dans les paramètres du menu.

9. Variable de langue

La fonctionnalité de langue variable permet à votre widget de s’adapter automatiquement à la langue sélectionnée sur votre site web. Une fois activée, le widget détecte et affiche la langue active du site, garantissant ainsi une expérience utilisateur fluide et cohérente, quelle que soit la langue utilisée. Cette fonctionnalité est particulièrement utile si votre boutique propose déjà un sélecteur de langue, car elle améliore l’accessibilité et assure que le contenu du widget s’affiche toujours dans la langue préférée de l’utilisateur, sans configuration supplémentaire.

Le client peut activer ou désactiver cette fonctionnalité dans les paramètres du menu.

10. Tri linguistique

La fonctionnalité de tri des langues vous permet de personnaliser l’ordre d’affichage des langues sur votre page Langues et dans le widget. Utilisez simplement les flèches haut et bas à côté de chaque langue pour les réorganiser selon vos préférences. Une fois l’ordre validé, cliquez sur « Enregistrer le classement » pour appliquer les modifications. Les langues apparaîtront alors dans le même ordre sur votre boutique en ligne et dans le widget, offrant ainsi une expérience utilisateur cohérente.

shopify-gif

11. Modification des fonctionnalités spécifiques à la langue

Lorsque vous cliquez sur l’icône Modifier, vous serez redirigé vers une page où vous pourrez personnaliser les noms des fonctionnalités pour une langue spécifique.

On this page:

  • Vous pouvez mettre à jour les libellés des fonctionnalités d’accessibilité (par exemple, Navigation au clavier, Grand curseur, Guide de lecture) dans la langue sélectionnée.
  • Ces noms personnalisés apparaîtront dans le widget d’accessibilité pour les utilisateurs consultant le site dans cette langue.
  • Cela garantit que tous les noms de fonctionnalités sont traduits ou adaptés à vos préférences, rendant ainsi le widget plus convivial et cohérent pour votre public.

12. Facilité d'accès pour modifier la couleur de fond/de police

Enfin, accédez aux paramètres pour modifier les couleurs d’arrière-plan et de police. Cette étape vous permet de personnaliser l’apparence du widget, afin qu’il corresponde au style de votre marque ou qu’il améliore la lisibilité pour les utilisateurs. Choisissez vos couleurs préférées et appliquez-les pour rendre le widget visuellement attrayant et accessible.

13. Personnalisation des icônes et des couleurs des widgets

Choisir l'icône du widget

  • Vous pouvez choisir parmi un ensemble d’icônes d’accessibilité prédéfinies pour votre widget flottant.
  • L’icône choisie représentera le widget d’accessibilité sur votre site.

Couleur de l'icône du widget flottant

  • Couleur extérieure : Personnalisez la couleur de la bordure ou du cercle extérieur de l’icône du widget en sélectionnant une couleur ou en saisissant un code hexadécimal (par exemple, #683996).
  • Couleur intérieure : Personnalisez l’arrière-plan ou la zone intérieure de l’icône du widget à l’aide d’un sélecteur de couleurs ou d’un code hexadécimal (par exemple, #F2F7FA).

14. Analyse de l'utilisation des fonctionnalités

Sur la page Tableau de bord, vous pouvez suivre la manière dont votre public interagit avec le widget d’accessibilité.

  • Indicateurs clés : Visualisez en un coup d’œil le nombre total d’ouvertures de widgets, d’événements cliqués et d’interactions.
  • Fonctionnalités les plus utilisées : découvrez quelles fonctionnalités d’accessibilité (par exemple, texte plus grand, hauteur de ligne, saturation élevée, liens utiles) sont les plus utilisées par vos visiteurs.
  • User Interaction Insights: Detailed breakdown of how often each feature is accessed, helping you understand which tools are most valuable to your audience.

15. Headless widget options

a. Accédez à la section Paramètres sans interface graphique.

b. Dans la boîte d’options du widget sans interface graphique, vous verrez un extrait de script comme celui-ci :

c. Cliquez sur le bouton Copier pour copier le script.
d. Ajoutez le script à votre interface. Collez le script dans votre fichier de mise en page HTML principal.