fix a11y

client/src/components/AppHeader.tsx

@@ -25,7 +25,7 @@ const AppHeader = () => {
     <header className="sticky top-0 z-100 w-full shadow-sm shadow-slate-900">
       <div className="min-h-80 flex items-center justify-between bg-grey-dark p-2">
         <div className="app-header__logo flex items-center gap-3">
-          <img src={logo} alt="logo" className="h-14" />
+          <img src={logo} alt="Logo du site" className="h-14" />
           <span className="w-0 transition-all duration-500 sm:w-full flex-shrink overflow-hidden text-red font-bold text-4xl">Groupomania</span>
         </div>
         <div className="right">

client/src/components/Image.tsx

@@ -39,7 +39,7 @@ const Image = ({ src, alt, className, onError }: { src: string; alt?: string; cl
       )}
       <img
         src={(error && onError === undefined) ? 'https://via.placeholder.com/150' : src}
-        alt={alt}
+        alt={(error && onError === undefined) ? 'Image absente' : alt}
         onError={handleError}
         className={className}
         onClick={onClick}

client/src/components/Like.tsx

@@ -24,9 +24,10 @@ const Like = ({ messageId, isLiked }: { messageId: string; isLiked: boolean }) =
     <button
       className="absolute -bottom-10 right-0 mb-2 rounded-full bg-grey-dark shadow-lg shadow-slate-900 cursor-pointer"
       onClick={like}
-      value="like"
+      name="like"
     >
       <FaThumbsUp className={'fill-red-light text-xl  w-10 h-10 p-2.5' + (isLiked ? ' fill-red' : '')} />
+      <span className="sr-only">Aimer</span>
     </button>
   );
 };

client/src/components/NewMessage.tsx

@@ -61,6 +61,9 @@ const NewMessage = () => {
           id="content"
           name="content"
         />
+        <label htmlFor="content" className="sr-only">
+          Message
+        </label>
         <button
           type="submit"
           className="rounded-md border border-red bg-red py-2 px-4 text-sm font-medium text-white hover:bg-white hover:text-red focus:outline-none focus:ring-2 focus:ring-red focus:ring-offset-2"

client/src/components/ScrollToBottom.tsx

@@ -38,11 +38,12 @@ const ScrollToBottom = ({ children, className = '' }: { children: ReactNode; cla
       <button
         onClick={() => node?.scrollIntoView({ behavior: 'smooth' })}
         className={'absolute right-3 ' + (show ? 'animate-show bottom-3 block' : 'animate-hide hidden bottom-0 -mb-10')}
-        value="Scroll to bottom"
+        name="bottom"
       >
         <span className="popup-btn block cursor-pointer rounded-full shadow-lg shadow-slate-900 bg-grey-dark hover:bg-grey-light transition-all">
           <FaChevronDown className="fill-grey-light hover:fill-grey-dark transition-all text-xl w-10 h-10 p-2.5" />
         </span>
+        <span className='sr-only'>Descendre en bas de la page</span>
       </button>
     </>
   );