fix: add missing alternative image for accessibilite

src/features/cartographie/components/lieux-mediation-numerique-details/lieux-mediation-numerique-details-print.component.html

@@ -125,9 +125,9 @@ <h1 class="d-none d-print-block h4 fw-bold">{{ lieuMediationNumerique.nom }}</h1
         class="w-25"
         *ngIf="brandConfiguration.logoAvecTexte; else brandLogo"
         [src]="brandConfiguration.logoAvecTexte"
-        alt="" />
+        alt="Logo secondaire" />
       <ng-template #brandLogo>
-        <img class="w-25" *ngIf="brandConfiguration.logo" [src]="brandConfiguration.logo" alt="" />
+        <img class="w-25" *ngIf="brandConfiguration.logo" [src]="brandConfiguration.logo" alt="Logo principal" />
       </ng-template>
       <div *ngIf="orientationSheetForm?.prescripteur as prescripteur" class="ms-auto border-start border-1">
         <b>Orientation Réalisée par :</b>

src/features/cartographie/components/lieux-mediation-numerique-list/lieux-mediation-numerique-list-print/lieux-mediation-numerique-list-print.component.html

@@ -34,7 +34,11 @@ <h2 class="h3 mb-3 pb-1 border-bottom border-dark border-2">
     <tr>&nbsp;</tr>
     <tr>
       <td class="border-top border-dark border-2 w-100 pt-2">
-        <img [src]="brandConfiguration.logoAvecTexte ?? brandConfiguration.logo" height="50px" class="pt-2" alt="" />
+        <img
+          [src]="brandConfiguration.logoAvecTexte ?? brandConfiguration.logo"
+          height="50px"
+          class="pt-2"
+          alt="logo principal" />
       </td>
     </tr>
   </tfoot>

src/features/cartographie/layouts/cartographie/cartographie.layout.html

@@ -184,7 +184,11 @@ <h3 class="card-title text-primary">
           <a
             class="btn orientation-btn bg-white mb-3 p-3 rounded-0 d-flex align-items-center"
             href="mailto:[email protected]">
-            <img src="/assets/img/logo/cartographie-nationale-brand.png" height="45" class="me-3" alt="" />
+            <img
+              src="/assets/img/logo/cartographie-nationale-brand.png"
+              height="45"
+              class="me-3"
+              alt="Logo Cartographie nationale" />
             <span class="orientation-btn-label my-auto text-start lh-sm">
               Contactez l'équipe de la Cartographie nationale des lieux d'inclusion numérique
             </span>

src/features/cartographie/pages/lieux-mediation-numerique-details/lieux-mediation-numerique-details.page.html

@@ -41,9 +41,17 @@ <h2 class="bg-primary">
         (click)="onCloseNoLieuFound()"></button>
     </div>
     <div class="text-center p-3">
-      <img *ngIf="brandConfiguration.logo; else brandLogo" class="mb-5 img-fluid" [src]="brandConfiguration.logo" alt="" />
+      <img
+        *ngIf="brandConfiguration.logo; else brandLogo"
+        class="mb-5 img-fluid"
+        [src]="brandConfiguration.logo"
+        alt="Logo principal" />
       <ng-template #brandLogo>
-        <img *ngIf="brandConfiguration.logoAvecTexte" class="mb-5 w-50" [src]="brandConfiguration.logoAvecTexte" alt="" />
+        <img
+          *ngIf="brandConfiguration.logoAvecTexte"
+          class="mb-5 w-50"
+          [src]="brandConfiguration.logoAvecTexte"
+          alt="Logo secondaire" />
       </ng-template>
       <h3 class="mb-5 fw-bold">
         Ce lieu

src/features/coordinateurs/components/conseiller-details-modal/conseiller-details-modal.component.html

@@ -52,7 +52,10 @@
         <div class="bg-light p-3">
           <div class="text-muted-dark mb-1 text-uppercase">Lieu d'activité principal</div>
           <div class="d-flex">
-            <img class="me-2" [src]="assetsConfiguration.path + '/img/coordinateurs/CnFS.svg'" alt="" />
+            <img
+              class="me-2"
+              [src]="assetsConfiguration.path + '/img/coordinateurs/CnFS.svg'"
+              alt="Logo conseiller numerique" />
             <div class="small">
               <b>{{ conseiller.lieuActivitePrincipal.nom }}</b>
               <br />

src/features/coordinateurs/pages/coordinateur-details/coordinateur-details.page.html

@@ -8,7 +8,7 @@
         <div class="d-flex">
           <img
             [src]="assetsConfiguration.path + '/img/coordinateurs/' + coordinateur.perimetre + '.svg'"
-            alt=""
+            alt="Image Coordinateur principal"
             style="height: 56px"
             class="me-3 my-auto" />
           <div class="flex-grow-1 align-self-center">
@@ -40,7 +40,7 @@ <h1 class="h2 fw-bold mb-0">{{ coordinateur.nom }}</h1>
             <div class="text-primary mb-2">
               <img
                 [src]="assetsConfiguration.path + '/img/coordinateurs/' + coordinateur.dispositif + '.svg'"
-                alt=""
+                alt="Image coordinateur secondaire"
                 style="height: 24px"
                 class="me-1" />
               Coordonne

src/features/coordinateurs/pages/coordinateur-list/coordinateurs-list.page.html

@@ -22,7 +22,9 @@ <h1 id="coordinateurs" class="visually-hidden">Liste des coordinateurs</h1>
           [class.active]="(coordinateurSelected$ | async) === coordinateur.id">
           <div class="row">
             <div style="width: 38px" class="col-auto p-0 m-auto text-center">
-              <img [src]="assetsConfiguration.path + '/img/coordinateurs/' + coordinateur.perimetre + '.svg'" alt="" />
+              <img
+                [src]="assetsConfiguration.path + '/img/coordinateurs/' + coordinateur.perimetre + '.svg'"
+                alt="Image Coordinateur principal" />
             </div>
             <div class="col">
               <b class="text-primary">

src/features/orientation/layouts/orientation/orientation.layout.html

@@ -53,7 +53,7 @@ <h2 class="h5 text-center text-secondary fw-bold my-3 mt-auto">
                 <div class="w-100 mb-auto position-relative">
                   <img
                     [src]="assetsConfiguration.path + '/img/orientation/' + brandConfiguration.illustration"
-                    alt=""
+                    alt="Carte illustration"
                     class="d-lg-block d-none" />
                   <div class="d-lg-block d-none position-absolute w-100" style="top: 17%">
                     <div>

src/features/orientation/pages/demarrer/demarrer.page.html

@@ -8,14 +8,14 @@
       [src]="brandConfiguration.logo"
       class="my-3"
       style="max-width: 100%; max-height: 100px"
-      alt="" />
+      alt="Logo principal" />
     <ng-template #brandLogo>
       <img
         *ngIf="brandConfiguration.logoAvecTexte"
         [src]="brandConfiguration.logoAvecTexte"
         class="my-5"
         style="max-width: 100%; max-height: 100px"
-        alt="" />
+        alt="Logo secondaire" />
     </ng-template>
     <ng-container *ngIf="!hasActiveFilter; else: restart">
       <h1 class="h2 fw-bold">

src/features/presentation/components/carousel/carousel.component.html

@@ -23,7 +23,7 @@ <h2 class="mt-5 fw-bold text-secondary text-center">Les avantages de cet outil :
       <div class="col-xl-6 col-9 my-5" @carouselAnimation>
         <div class="row">
           <div class="col-md-6 my-auto d-flex justify-content-end align-items-center">
-            <img src="{{ slides.imageUrl }}" class="img-fluid" alt="" width="70%" />
+            <img src="{{ slides.imageUrl }}" class="img-fluid" alt="'Slide ' + slides.titre" width="70%" />
           </div>
           <div class="col-md-6 my-auto" *ngIf="slides.titre !== 'Standardisation'">
             <h3 class="h5 text-secondary fw-bold">{{ slides.titre }}</h3>
@@ -36,7 +36,7 @@ <h3 class="h5 text-secondary fw-bold">{{ slides.titre }}</h3>
               target="_blank"
               rel="noopener noreferrer">
               <span class="visually-hidden">Accéder à DORA</span>
-              <img class="my-3" height="100px" src="/assets/img/presentation/dora-logo.svg" alt="" />
+              <img class="my-3" height="100px" src="/assets/img/presentation/dora-logo.svg" alt="Logo Dora" />
             </a>
             <button
               *ngIf="slides.titre === 'Orientation'"

src/features/presentation/components/integrateurs/integrateurs.component.html

@@ -3,7 +3,10 @@
     <div class="card h-100 rounded-0" style="min-height: 45vh">
       <div class="row g-0 h-100">
         <div class="col d-flex justify-content-center align-items-center p-4" [ngClass]="integrateur.bgPrimary">
-          <img src="/assets/img/presentation/{{ integrateur.bgImage }}" class="w-100" alt="" />
+          <img
+            src="/assets/img/presentation/{{ integrateur.bgImage }}"
+            class="w-100"
+            alt="'Integrateur ' + integrateur.titre" />
         </div>
         <div class="col text-start p-4">
           <span class="badge card-badge-title ms-3 my-2">{{ integrateur.titre }}</span>

src/features/presentation/components/webinaire/webinaire.component.html

@@ -1,7 +1,7 @@
 <div class="row row-cols-1 row-cols-md-3 g-4 justify-content-center">
   <div class="col" *ngFor="let webinaire of webinairePresentation">
     <div class="card h-100 rounded-0">
-      <img src="/assets/img/presentation/webinaire/{{ webinaire.image }}" class="w-100" alt="" />
+      <img src="/assets/img/presentation/webinaire/{{ webinaire.image }}" class="w-100" alt="'Webinaire ' + webinaire.titre" />
       <div class="card-body h-100 d-flex p-4 flex-column">
         <div class="d-flex">
           <i class="ri ri-timer-fill" style="color: #459c99"></i>

src/features/presentation/pages/presentation/presentation.page.html

@@ -5,7 +5,7 @@
     <div class="container">
       <div class="row">
         <div class="col-md-6 my-auto p-5">
-          <img src="/assets/img/presentation/personnages_sur_carte.svg" class="img-fluid" alt="" />
+          <img src="/assets/img/presentation/personnages_sur_carte.svg" class="img-fluid" alt="Image header presentation" />
         </div>
         <div class="col-md-6 my-auto">
           <h1 class="fw-bold text-secondary mb-4">Qu'est-ce que la cartographie nationale des lieux d'inclusion numérique ?</h1>
@@ -38,7 +38,7 @@ <h2 class="my-5 text-black text-center">
       <span class="fw-bold">mettre à jour</span>
       vos données ?
     </h2>
-    <img src="/assets/img/presentation/multipuces.svg" class="img-fluid" style="max-width: 30%" alt="" />
+    <img src="/assets/img/presentation/multipuces.svg" class="img-fluid" style="max-width: 30%" alt="Image référencement" />
     <div class="my-5">
       <a
         class="btn btn-primary rounded-0"

src/root/layouts/application-root/application-root-layout.component.html

@@ -16,8 +16,11 @@
   <footer id="footer" slot="footer" class="container-fluid p-4 bg-dark d-print-none">
     <div class="row justify-content-between">
       <div class="col-lg-auto d-none d-sm-block">
-        <img src="/assets/img/footer/footer-mark.svg" class="img-fluid me-4" alt="" />
-        <img src="/assets/img/footer/footer-anct-logo.svg" class="img-fluid" alt="" />
+        <img src="/assets/img/footer/footer-mark.svg" class="img-fluid me-4" alt="La République française" />
+        <img
+          src="/assets/img/footer/footer-anct-logo.svg"
+          class="img-fluid"
+          alt="L'agence nationale de la cohésion des territoires" />
       </div>
       <div class="d-block d-sm-none">
         <small class="text-white">Avec le soutien de :</small>