Comment le CCM19 répond-il aux exigences des WCAG ?
Orientation claire
Structure logique et intuitive
L'ordre des onglets clairement défini et les points de focalisation bien identifiables permettent une navigation sans effort, de sorte que les utilisateurs ne perdent jamais le nord.
Compatibilité avec les lecteurs d'écran
Optimisé pour l'utilisation de lecteurs d'écran
Le bandeau de cookies CCM19 prend en charge tous les lecteurs d'écran courants ainsi que les normes ARIA nécessaires pour garantir une navigation fluide et sans obstacles.
Navigation au clavier
Commande confortable par clavier
Toutes les fonctions et zones de la bannière Cookie sont entièrement et facilement accessibles au clavier, même sans souris, pour une expérience utilisateur sans barrières.
Présentation optimisée des couleurs
Conception à fort contraste selon les WCAG
Le CCM19 répond aux exigences de contraste des WCAG (au moins 4,5:1), de sorte que les textes et les boutons sont parfaitement lisibles pour les personnes malvoyantes.
Mise à l'échelle flexible
Affichage personnalisable
La bannière de cookie reste entièrement utilisable même si elle est agrandie jusqu'à 200 %, sans que le contenu ne soit perdu - parfait pour les utilisateurs ayant des problèmes de vue.
Langage compréhensible
Contenu clair et simple
Tous les textes de la bannière de cookies sont rédigés de manière simple et compréhensible, afin que les utilisateurs puissent saisir les informations sans problème, quelles que soient leurs connaissances préalables.
CCM19 aide déjà 210.554 sites web à se conformer au DSGVO, TDDDG & Co.
Conforme à la LFSB grâce à la mise en œuvre des directives WCAG
WCAG comme base de la conformité BFSG
La bannière de cookie CCM19 a été développée de manière à répondre aux exigences de la loi sur le renforcement de l'accessibilité (BFSG) en prenant en compte de manière conséquente les directives internationales WCAG. Vous répondez ainsi de manière simple et fiable aux exigences légales en matière d'accessibilité.
Facile à intégrer et directement utilisable
Grâce à l'assistant d'installation intuitif, vous intégrez sans problème la bannière de cookie CCM19 dans votre site Web - sans aucun obstacle technique supplémentaire. Vous vous assurez ainsi que votre site web est conçu sans barrières selon les WCAG et qu'il est en même temps conforme à la LFSP.
Soutien ciblé pour la sécurité juridique
CCM19 vous accompagne activement dans la mise en œuvre de votre bannière de cookie sans barrière et conforme aux WCAG, afin que vous puissiez répondre aux exigences de la BFSG en toute sécurité juridique - sans effort supplémentaire.
Conformité WCAG et sécurité juridique - gestion du consentement avec le CCM19
Le CCM19 vous permet également de gérer le consentement de manière globale, ce qui inclut entre autres :
Créer la transparence des consentements
Avec le CCM19 Consent Management, vous documentez de manière fiable et transparente le consentement de vos utilisateurs - de manière clairement structurée et compréhensible à tout moment. Vous restez ainsi durablement en conformité avec la loi au sens du RGPD et des directives WCAG.
Vérification régulière de la conformité au RGPD
Un scanner automatique vérifie régulièrement si votre site web continue de répondre aux exigences actuelles du RGPD. Vous garantissez ainsi une sécurité juridique continue.
Gérer tous les paramètres de manière claire
CCM19 regroupe toutes les fonctions de gestion des consentements en un seul endroit. Cela permet de gagner du temps, de réduire la complexité et de veiller à ce que votre site Web réponde toujours aux exigences actuelles en matière de protection des données et d'accessibilité.
Autres avantages du CCM19
Vitesse de chargement optimale
La bannière de cookie CCM19 est légère et optimisée en termes de performance, de sorte que votre site web se charge à la vitesse de l'éclair. Vos visiteurs bénéficient ainsi d'une expérience utilisateur sans faille.
Support professionnel
Notre équipe d'assistance expérimentée est à votre disposition pour répondre à toutes vos questions sur la bannière de cookie par téléphone, e-mail et chat - compétente, aimable et rapidement joignable.
Conforme au RGPD et à la LFSP
La bannière de cookie CCM19 répond à tout moment aux exigences légales actuelles selon le RGPD et la LFSP. Vous informez ainsi toujours vos utilisateurs de manière transparente et conforme à la loi.
Caractéristiques pour une bannière de cookie accessible
Conformité WCAG avec le CCM19 : aperçu de tous les critères remplis
Le tableau suivant vous permet de voir en un coup d'œil comment la bannière de cookie CCM19 répond concrètement aux exigences des directives d'accessibilité aux contenus web (WCAG 2.1).
Les critères non pertinents sont marqués en conséquence.
| Section WCAG | Description | Pertinence pour le CCM19 |
|---|---|---|
| 1.1 Alternatives textuelles | ||
| 1.1.1 Contenu non textuel | Tous les contenus non textuels ont une alternative textuelle : - Tous les champs de saisie ont un label ou aria-label - Tous les éléments purement décoratifs sont marqués de manière à être ignorés par les lecteurs d'écran (aria-hidden="true") - Tout ce qui ne peut pas être représenté sous forme de texte a au moins une brève description de ce qui est à voir ou à entendre. | ✅ |
| 1.2 Médias basés sur le temps | ||
| 1.2.1 Audio-only/Video-only (Prerecorded) | Audio : il existe une présentation alternative du contenu audio pour les sourds. Vidéo : Il existe une piste audio descriptive ou une représentation alternative pour les aveugles. | Non pertinent |
| 1.2.2 Captions (Prerecorded) | Les vidéos ont des sous-titres. | Non pertinent |
| 1.2.3 Description audio ou alternative média (Prerecorded) | Les vidéos contiennent une bande son descriptive ou une présentation textuelle alternative. | Sans objet |
| 1.2.4 Captions (en direct) | Il existe des sous-titres en direct pour les vidéos en direct avec son. | Non pertinent |
| 1.2.5 Description audio (Prerecorded) | Il y a une description audio pour le contenu vidéo. | Non pertinent |
| 1.2.6 Sign Language (Prerecorded) | Facultatif : il existe des vidéos en langage des signes pour le contenu audio. | Non pertinent |
| 1.3 Adaptable | ||
| 1.3.1 Infos et relations | Les informations, structures et relations résultant de la mise en page sont reconnaissables par programme (par exemple via des attributs for, aria-labelledby, aria-controls) ou disponibles sous forme de texte. | ✅ |
| 1.3.2 Séquence significative | La séquence de lecture pertinente est reconnaissable pour les lecteurs d'écran. | ✅ |
| 1.3.3 Caractères sensoriels | Les instructions ne s'appuient pas uniquement sur l'apparence (forme, position, couleur). | ✅ |
| 1.3.4 Orientation | Pas de restriction fixe sur le format portrait ou paysage, sauf nécessité absolue et justifiée. | ✅ |
| 1.3.5 Identify Input Purpose | L'objectif des champs de saisie peut être identifié par programme (par exemple avec type et l'attribut autocomplete). | ✅ |
| 1.3.6 Identify Purpose (facultatif, niveau AAA) | L'objectif de tous les éléments UI, icônes et régions peut être identifié de manière programmatique. | ✅ |
| 1.4 Distinguable | ||
| 1.4.1 Utilisation de la couleur | La couleur ne doit jamais être la seule caractéristique permettant de transmettre une information. Les alternatives sont par exemple les différences de luminosité ou les formes. | ✅ |
| 1.4.2 Contrôle audio | Pour l'audio qui se joue automatiquement pendant plus de 3 secondes, il y a une fonction de pause, d'arrêt ou de réglage du volume. | non pertinent |
| 1.4.3 Contrast (minimum) | Le contraste minimal pour le texte (courant) est de 4.5:1. Pour les gros caractères (titres et autres, à partir de 18pt ou 14pt en gras) : 3:1 Les inputs/boutons désactivés, les logos et les éléments purement décoratifs n'ont pas d'exigence de contraste. | ✅ |
| 1.4.4 Redimensionner le texte | Le texte peut être agrandi jusqu'à 200 % sans perte de fonction. | ✅ |
| 1.4.5 Images de texte | Les images qui contiennent du texte sont évitées, sauf si c'est absolument nécessaire ou si le texte est généré à partir d'une entrée utilisateur. | ✅ |
| 1.4.6 Contrast (Enhanced) (facultatif, niveau AAA) | Le rapport de contraste est de 7:1 pour le texte (courant) et de 4,5:1 pour les gros caractères. | ✅ |
| 1.4.7 Low or No Background Audio (audio de fond faible ou inexistant) | (est rempli) | non pertinent |
| 1.4.8 Visual Presentation (facultatif, niveau AAA) | Réglable pour que le texte soit affiché comme suit : - Couleur de premier plan et d'arrière-plan au choix - pas plus de 80 caractères par ligne - pas de justification - espacement des lignes au moins 1,5 - espacement des paragraphes 1,5x plus grand que l'espacement des lignes - le texte peut être agrandi jusqu'à 200% sans avoir à défiler horizontalement (sur les écrans courants en plein écran) | ✅ |
| 1.4.9 Images du texte (pas d'exception) (facultatif, niveau AAA) | voir 1.4.5 | ✅ |
| 1.4.10 Reflow | La page est responsive → Tous les contenus sont accessibles quelle que soit la taille de l'écran et aucun défilement en deux dimensions (vertical+horizontal) n'est nécessaire... pour les contenus défilant verticalement pour une largeur de 320 pixels CSS pour les contenus défilant horizontalement pour une hauteur de 256 pixels CSS sauf si c'est absolument et justifié nécessaire pour les choses présentées en 2 dimensions. | ✅ |
| 1.4.11 Non-text Contrast | Les éléments UI (inputs, boutons, etc.) ont un rapport de contraste d'au moins 3:1, sauf s'ils sont désactivés ou si l'input standard du navigateur est utilisé. Les graphiques qui sont importants pour le contenu ont également un contraste minimum de 3:1. | ✅ |
| 1.4.12 Espacement du texte | Si les formatages de texte suivants sont forcés par le navigateur, la page continue à fonctionner sans problème : - hauteur de ligne de 1,5 - espacement des paragraphes : 2 x Fontsize - espacement des lettres : 0,12 x Fontsize - espacement des mots : 0,16 x Fontsize | ✅ |
| 1.4.13 Content on Hover or Focus | Lorsque du contenu est ajouté/supprimé par survol/focalisation d'un élément (superpositions, popovers), alors : - ceux-ci peuvent être fermés (dismissibles), sauf s'ils ne recouvrent jamais rien d'autre ou communiquent une erreur de saisie, - le curseur peut être déplacé sur le popover sans qu'il disparaisse, - le contenu reste visible jusqu'à ce qu'il soit fermé, que le focus soit retiré ou que l'information ne soit plus valide. | ✅ |
| 2.1 Clavier accessible | ||
| 2.1.1 Clavier | Toutes les fonctionnalités sont accessibles et contrôlables avec le clavier (sauf impossible pour l'interface existante, par exemple signature manuscrite avec la souris). La fonctionnalité ne dépend pas d'une vitesse de frappe particulière. | ✅ |
| 2.1.2 No Keyboard Trap | Le focus du clavier n'est pas enfermé. Si une fonction en a tout de même besoin et que cela n'est pas possible avec les touches normales (tabulation, etc.), la manière de sortir le focus est possible avec le clavier et est décrite sur la page. | ✅ |
| 2.1.3 Clavier (No Exception) (optionnel, niveau AAA) | voir 2.1.1 | ✅ |
| 2.1.4 Raccourcis clavier de caractères | S'il y a des raccourcis clavier qui n'utilisent que des touches normales (imprimables) sans modificateurs (Ctrl, Alt, ...), ils sont soit : - désactivables, - convertibles en Ctrl, Alt, ... + la touche, - ou seulement actifs pendant que l'élément concerné a le focus. | ✅ |
| 2.2 Temps suffisant | ||
| 2.2.1 Timing Adjustable (optionnel, niveau AAA) | S'il y a des limites de temps (<20h), elles sont soit désactivables, soit ajustables au moins jusqu'à 10x, ou peuvent être prolongées. | ✅ |
| 2.2.2 Pause, Stop, Hide | Les contenus clignotants, se déplaçant automatiquement ou défilant pendant plus de 5s peuvent être mis en pause, arrêtés ou cachés. Les contenus qui s'actualisent automatiquement et qui sont affichés en parallèle avec d'autres peuvent être mis en pause, arrêtés ou cachés, ou la fréquence de mise à jour peut être réglée. | ✅ |
| 2.2.3 Pas de timing | Pas de limite de temps ou de dépendance vis-à-vis du temps de réaction de l'utilisateur. | ✅ |
| 2.2.4 Interruptions (optionnel, niveau AAA) | Les interruptions peuvent être retardées ou supprimées par l'utilisateur, sauf pour les messages d'urgence. | ✅ |
| 2.2.5 Re-authentification (facultatif, niveau AAA) | Si la session expire, l'utilisateur peut reprendre l'activité sans perdre de données. | ✅ |
| 2.2.6 Timeouts (facultatif, niveau AAA) | Les utilisateurs sont avertis et informés du délai d'expiration lorsque l'inactivité peut entraîner une perte de données, sauf si les données sont conservées pendant plus de 20 h. | ✅ |
| 2.3 Seizures et réactions physiques | ||
| 2.3.1 Trois flashs ou seuil inférieur | Rien ne scintille plus de 3 fois par seconde sur plus de 300x200 px ensemble. | ✅ |
| 2.3.2 Three Flashes (optionnel, niveau AAA) | Rien ne scintille plus de 3x par seconde. | ✅ |
| 2.3.3 Animation from Interactions (facultatif, niveau AAA) | Toutes les animations de mouvement non nécessaires peuvent être désactivées. Animations de mouvement : Mouvements et changements de taille, pas seulement changement de couleur ou masquage. | ✅ |
| 2.4 Navigable | ||
| 2.4.1 Blocs de contournement | Les blocs qui se répètent sur plusieurs pages (en-tête, navigation, etc.) peuvent être ignorés grâce à un mécanisme pour les lecteurs d'écran - par exemple via des liens de navigation, des ARIA landmarks, des sections avec des titres ou des menus escamotables. | ✅ |
| 2.4.2 Page Titled | La page a un titre significatif. | ✅ |
| 2.4.3 Ordre des focus | L'ordre de focalisation des onglets est judicieux. | ✅ |
| 2.4.4 But du lien (In Context) | Le but d'un lien est reconnaissable à partir du texte du lien (ou au maximum avec le texte environnant ou les titres de tableaux). | ✅ |
| 2.4.5 Multiple Ways | Il existe plus d'une manière d'atteindre une page (exception : par exemple dans les assistants ou les pages de confirmation de commande). Réalisable avec des "liens vers des pages connexes", une table des matières, un plan du site ou une fonction de recherche. | ✅ |
| 2.4.6 Headings et labels | Il existe des en-têtes et des labels descriptifs. | ✅ |
| 2.4.7 Focus visible | Le focus du clavier est toujours visible lors du balayage. | ✅ |
| 2.4.8 Location (facultatif, niveau AAA) | La position actuelle dans le site web (par exemple via des fils d'Ariane) est reconnaissable. | ✅ |
| 2.4.9 But du lien (Link Only) (facultatif, niveau AAA) | L'objectif d'un lien est toujours reconnaissable à partir du texte du lien, sauf s'il est ambigu, même pour les personnes sans handicap. | ✅ |
| 2.4.10 Section Headings (facultatif, niveau AAA) | Les en-têtes de section sont utilisés pour organiser le contenu. | ✅ |
| 2.5 Modalités d'entrée | ||
| 2.5.1 Gestes de pointage | Toutes les interactions avec des gestes de déplacement, pour lesquelles le point de départ et le point d'arrivée ne sont pas les seuls à être importants ou qui nécessitent plusieurs doigts, peuvent également être effectuées avec un geste plus simple ou des clics de souris. | ✅ |
| 2.5.2 Annulation de pointeur | Une action ne se termine pas au mousedown, mais seulement lorsque la souris est relâchée sur l'élément et peut être interrompue ou annulée. | ✅ |
| 2.5.3 Label dans le nom | Le label ARIA contient le texte visible du label/bouton. | ✅ |
| 2.5.4 Motion Actuation | Toutes les fonctions déclenchées par déplacement/secousse/rotation de l'appareil peuvent être contrôlées alternativement dans l'IU et la réaction aux mouvements peut être désactivée. | non pertinent |
| 2.5.5 Target Size (optionnel, niveau AAA) | Les éléments cliquables ont une taille minimale de 44 × 44 pixels CSS ou il existe une alternative de taille correspondante - à l'exception des liens dans le texte courant. | ✅ |
| 2.5.6 Concurrent Input Mechanisms (facultatif, niveau AAA) | Le site Web ne limite pas inutilement les méthodes d'entrée. Le tactile, la souris et le clavier fonctionnent aussi bien l'un que l'autre, et il est possible de passer de l'un à l'autre sans problème. | ✅ |
| 3.1 Lisible | ||
| 3.1.1 Langue de la page | La langue principale de la page est reconnaissable par programme. | ✅ |
| 3.1.2 Language of Parts | Les changements de langue dans les différentes sections ou mots sont identifiés de manière programmatique. Exceptions : Mots techniques, noms propres et autres. | ✅ |
| 3.1.3 Unusual Words (facultatif, niveau AAA) | Pour les mots inhabituels, il existe un mécanisme avec une explication(<dl>,<dfn >, glossaire ou autre). | ✅ |
| 3.1.4 Abbreviations (facultatif, niveau AAA) | Pour les abréviations, il existe un mécanisme avec la forme écrite en toutes lettres ou la signification. | ✅ |
| 3.1.5 Reading Level (facultatif, niveau AAA) | Pour une langue plus compliquée que le niveau Hauptschule, il existe des textes explicatifs ou une alternative plus simple. | ✅ |
| 3.1.6 Prononciation (facultatif, niveau AAA) | Si la prononciation d'un mot dépend du contexte ou si le sens n'est pas clair sans prononciation, la prononciation est identifiable. | ✅ |
| 3.2 Predictable | ||
| 3.2.1 On Focus | Le seul fait de mettre le focus sur un élément ne déclenche pas de changement de page ou d'intervention similaire à grande échelle sur la page. | ✅ |
| 3.2.2 On Input | Seule la modification de la valeur d'un élément Input ne déclenche pas de changement de page ou de focus - sauf si l'utilisateur a été informé au préalable. | ✅ |
| 3.2.3 Navigation cohérente | La navigation est cohérente sur le site web. L'ordre des éléments de menu reste le même, sauf si l'utilisateur le modifie intentionnellement. | ✅ |
| 3.2.4 Consistent Identification | Les éléments ayant la même fonction sont nommés et reconnaissables de manière cohérente. | ✅ |
| 3.2.5 Changement à la demande (facultatif, niveau AAA) | Les changements de page et les interventions similaires à grande échelle (ainsi que les déplacements de focus) ne sont déclenchés que sur demande de l'utilisateur ou peuvent être désactivés. | ✅ |
| 3.3 Assistance à l'entrée | ||
| 3.3.1 Identification des erreurs | En cas d'erreur de saisie, le champ de saisie contenant l'erreur est identifié et le problème est décrit. | ✅ |
| 3.3.2 Labels ou instructions | Des labels ou des instructions aident à la saisie. | ✅ |
| 3.3.3 Suggestion d'erreur | En cas d'erreurs détectées, des corrections sont suggérées (si cela est possible en toute sécurité). | ✅ |
| 3.3.4 Error Prevention (Legal, Financial, Data) | Les saisies pertinentes sur le plan juridique ou financier peuvent être annulées ou sont vérifiées. | ✅ |
| 3.3.5 Help (facultatif, niveau AAA) | Une aide contextuelle est disponible. | ✅ |
| 3.3.6 Error Prevention (All) (facultatif, niveau AAA) | Pour toutes les saisies de l'utilisateur, soit la saisie est annulable, soit elle est vérifiée quant aux erreurs (avec possibilité de correction), soit il y a une confirmation avec révision des modifications. | ✅ |
| 4.1 Compatible | ||
| 4.1.1 Parsing | Le HTML est valide, les ID sont uniques. | ✅ |
| 4.1.2 Nom, rôle, valeur | Pour les éléments de forme non standard, le nom/label et le rôle/fonction sont reconnaissables par programme. Les états et les propriétés ARIA sont définis. | ✅ |
| 4.1.3 Messages d'état | Les messages d'état en direct peuvent être reconnus comme tels de manière programmatique. | ✅ |
Questions fréquemment posées
Nous avons éveillé votre intérêt ?
Vous souhaitez vous aussi rendre votre site web accessible et vous avez besoin d'une bannière de cookie conforme à la LFSP et au RGPD, mais vous avez encore des questions sur la rédaction du contrat ou sur les capacités techniques du système ? Pas de problème - nous vous aiderons volontiers ! Il vous suffit de remplir tous les champs marqués d'un astérisque (*) et nous vous contacterons dans les plus brefs délais. Nous nous réjouissons de votre demande !
Si vous avez des questions, vous pouvez bien sûr nous joindre par téléphone, par e-mail ou via notre formulaire de contact.
Tél : +49 228 536 637 26
E-mail : info@ccm19.de