Le numérique au service de l’emploi · 13 Handi-Pacte – Sensibilisation Accessibilité – Rennes - avril 2017 LOI n° 2016 -1321 du 7 octobre 2016 pour une République numérique

Le numérique au service de l’emploi des personnes handicapées

CLUB DES CORRESPONDANTS HANDICAP

05/04/2017

Contacts

Anne

LAULHERE-VIGNEAU Cheffe de projet

[email protected]

www.Handi-Pacte-bretagne.fr

Adeo Conseil

12-14, rue R. Giraudineau - 94300 Vincennes

01.43.98.42.01

Samuel SAUVAGE Chef de projet

[email protected]


Adeo Conseil


01.43.98.42.01

tel:33143984201

https://www.google.fr/maps/place/ADEO+Conseil/@48.8458673,2.4356532,15z/data=!4m5!3m4!1s0x0:0x43d5e4583fb44ac9!8m2!3d48.8458673!4d2.4356532

http://www.handipacte-bretagne.fr/

tel:33143984201



Franck Letrouvé Expert certifié en accessibilité numérique

Membre du Groupe de Travail Accessibilité de l’association BrailleNet depuis 2004

----------------------------------------------------- [email protected]

www.pixfl.com

@franckletrouve

06 62 56 14 44

Nantes - Paris

1- Accueil et cadre de la rencontre

Mot d’accueil de Rennes Métropole

Tour de table des participant(e)s

Actualités du Handi-Pacte

Réussite du Carrefour régional des mobilités

Evolutions du catalogue des interventions

Avancées de Mobilitest

Diverses rencontres à prévoir avant l’été

Un nouveau départ en septembre

Entrée en matière

L’accessibilité numérique : enjeux et cas pratiques

L’accessibilité du Web : enjeux et cas pratiques

10h00-

10h30

10h30-

12h30

14h00-

16h00

Pause déjeuner 12h30-

14h00

16h00-

16h30 Restitution / consolidation / programmation

2 - Ordre du jour

le 5 avril 2017

<

Handi-Pacte - Rennes

Sensibilisation Accessibilité numérique

QU’EST-CE QUE L’ACCESSIBILITÉ NUMÉRIQUE ?

8 Handi-Pacte – Sensibilisation Accessibilité – Rennes - avril 2017

Accessibilité numérique ?


▌ L’accessibilité, un concept universel


De l’Internet pour tous, y compris pour : > les personnes handicapées,

> les seniors,

> les néophytes.

De l’Internet partout : > quelle que soit sa vitesse et son mode de

connexion.

De l’Internet adapté à toutes les interfaces : > navigateur texte ou graphique,

> téléphone mobile, PDA, TV,

> aides techniques.


▌

Angleterre 1995

Disability Discrimination Act

Irlande 1999

Disablity Act

Allemagne Juillet 2002

Décret sur l’accessibilité numérique (Obligation en 2005)

Italie Janvier 2004

Loi sur l’accessibilité numérique

Espagne Décembre 2003

Sites publics accessibles et

élargissement aux sites privés

USA 1998

Section 508 Extension aux sites web commerciaux et

privés (Juillet 2003)

Europe Juin 2002

Résolution du parlement européen pour la mise en place d’une marque de e-accessibilité conforme aux standards de l’accessibilité

France Février 2005

Loi pour l’égalité des droits et des chances, la participation et

la citoyenneté des personnes handicapées

La législation de l’accessibilité numérique dans le monde



▌

Une référence

internationale Le Web World Wide Consortium (créée en 1994),

organisme de régulation de l’Internet

(452 membres en mars 2017),

émet des recommandations

pour la prise en compte du handicap :

les WCAGs 2.0

Angleterre

Des cadres législatifs et des

référentiels nationaux

Des méthodologies

d’implémentation

Une méthodologie et un

label de qualité

en Europe

Depuis septembre 2006 :

une méthodologie unifiée UWEM 1.0 (Unified Web Evaluation Methodology)

&

un label de qualité européen EURACERT

En France

Référentiel Accessibilité ATICA > ADAE > DGME > DINSIC

(Direction interministérielle des

systèmes d'information et de

communication de l'Etat)

RGAA 3

Espagne

Pays-Bas

France

Belgique

Les termes à connaitre



▌

Loi pour l'égalité des droits et des chances, la participation et la citoyenneté des personnes handicapées

(loi n°2005-102 votée le 11 février 2005)

Selon la loi française, les sites Internet, Intranet et

Extranet des services publics doivent :

> appliquer les recommandations internationales liées à l'accessibilité en se basant sur le référentiel RGAA de la DGME,

> achever cette mise en conformité d'ici à 3 ans,

> former les personnels impliqués dans ces projets.

DINSIC

Direction Interministérielle du

Numérique et du Système

d’Information et de Communication

du gouvernement

RGAA

Référentiel

Général

d’Accessibilité

pour les Administrations

DGME

Direction

Générale

de la Modernisation

de l’Etat

Article 47 : « Les services de communication publique en ligne des services de l'État, des collectivités territoriales et des établissements publics qui en dépendent doivent être accessibles aux personnes handicapées. »

Le décret n°2009-546 du 14 mai 2009

fixe le cadre du référentiel d’accessibilité des services de communication publique en ligne.

L’arrêté du 21 octobre 2009

met en vigueur le référentiel d’accessibilité des services de communication publique en ligne.

L’arrêté du 29 avril 2015

approuve la version 3.0 du RGAA.

Article 24 :

« Les employeurs prennent […] les mesures

appropriées pour permettre aux travailleurs [...]

d’accéder à un emploi ou de conserver un emploi »

Le web public doit donc être accessible

depuis mai 2011 et

mai 2012 pour les collectivités.

La législation de l’accessibilité numérique en France



▌

LOI n° 2016-1321 du 7 octobre 2016 pour une République numérique

L’article 106 de la loi pour une République numérique complète et précise l’article 47 de la loi de 2005.

Sur ce point, le nouvel article propose plusieurs avancées.

Ainsi, il :

• inscrit dans la loi elle-même un régime de sanction,

• en étend la loi à certains types d’acteurs privés ou aux organismes délégataires de mission de service public,

• oblige à la publication des plans de mise en accessibilité à l’image des Agendas d’Accessibilité Programmée (Ad’AP) pour

le bâti.

• donne accès à des subventions du fonds national d’accompagnement de l’accessibilité universelle, alimenté par les

sanctions financières de l’accessibilité du cadre bâti et des transports.

L'article 106 de la loi pour une République numérique


https://www.legifrance.gouv.fr/eli/loi/2016/10/7/ECFI1524250L/jo/article_106

HANDICAP &

INTERNET


▌

Dans le monde,

500 millions de personnes handicapées dans le monde

En Europe,

10 à 15% de personnes handicapées en Europe soit 80 à 120 millions de citoyens européens

En France,

> Près de 12 millions de personnes atteintes d’un handicap *

> 12,8 millions de personnes âgées au total

> + 25% de personnes handicapées en 10 ans

> 8% d’internautes français handicapés

> Près de 1,7 million de déficients visuels dont près de 60 000 personnes non-voyantes

> 61 % des déficients visuels sont des personnes âgées de plus de 60 ans

Les chiffres concernant le handicap en France varient selon la définition donnée à ce terme et la source des données. Les chiffres les plus couramment utilisés sont ceux issus de l’enquête Handicap, incapacités, dépendance (HID) réalisée par l’Insee, entre 1998 et 2001.

Handicap : « Toute limitation d’activité ou restriction de participation à la vie en

société subie dans son environnement par une personne en raison d’une altération

substantielle, durable ou définitive d’une ou plusieurs fonctions physiques,

sensorielles, mentales, cognitives ou psychiques, d’un polyhandicap ou d’un trouble

de santé invalidant. » (Loi de février 2005)

1

2

3

Quelques chiffres sur le handicap dans le monde, en Europe et en France

Handicap et Internet


▌

Serge

65 ans, Ingénieur conseil en restauration

Tétraplégique

(Granville)

Ronan

40 ans, salarié SEMITAN, transports publics de l’agglomération nantaise

Malvoyant

(Nantes)

David

34 ans, membre de l’association CLISSAA - Voir et Agir

Non-voyant

(Nantes)

1

2

3

Tous les handicaps et toutes les générations



▌

Sa capacité motrice est limitée

Serge n’utilise pas de souris pour naviguer sur Internet.

Il pilote sa machine au clavier ou à la voix.

Il dispose sur son ordinateur :

- d’une dictée vocale,

- d’un dispositif de pointage manuel (clavier mécanique et

contacteurs magnétiques),

- de touches incurvées pour faciliter la navigation au

clavier.

Serge est tétraplégique

Il est retraité

Les aides techniques de Serge



▌

Repose-bras thermoformé

Clavier adapté




▌

Attelle en peau de cheval Stylet avec contacteur magnétique




▌ Les aides techniques de Serge



▌

Sa vision est peu périphérique

Ronan distingue mal les formes et les couleurs qui lui sont proposées à l’écran.


- d’une loupe logicielle (ZoomText) qui grossit à volonté les éléments affichés à l’écran. Les informations ainsi affichées peuvent également être vocalisées,

- de touches de clavier grossies et incurvées pour faciliter la lecture et la position de ses doigts.

Ronan est malvoyant

Il est salarié de la SEMITAN – Société de transport en commun

de l’agglomération nantaise

Les aides techniques de Ronan



▌

Un clavier avec des touches à

affichage grossi…

… et en creux pour la

position des doigts

Les aides techniques de Ronan



▌

David est non-voyant

Bac +4 et à la recherche d’un emploi

Son bagage informatique est solide

David échange des mails, utilise un traitement de texte et

administre le site Internet de l’association dont il est

membre (www.clissaa.asso.fr).


- d'un logiciel de revue d’écran (Jaws) qui vocalise toutes

les actions exécutées par son ordinateur,

- d’une plage tactile braille qui “dicte à ses doigts” les

informations affichées à l’écran,

- d’un clavier ordinaire qui lui permet de transmettre

l’information à sa machine.

Les aides techniques de David



▌

> Le logiciel de revue d’écran (Jaws) est couplé à :

- une plage tactile braille,

- une synthèse vocale.

> David n’utilise pas la souris mais les touches de son clavier pour piloter son ordinateur.

Clavier ordinaire & plage tactile braille




▌

> La plage tactile sert à recevoir l’information. > Ces équipements permettent à David d’accéder aux données que nous voyons à l’écran.




▌

Avec un site internet accessible,

il est possible de :

> moduler la taille des caractères,

> personnaliser l’affichage,

> naviguer sans souris,

> naviguer sans écran...

Avec un site internet accessible :

> les moteurs sont plus efficaces,

> la navigation est plus claire,

> l’information mieux structurée…

Un site Internet portable, accessible est conçu suivant des

normes qui rendent son interface et ses contenus accessibles à

tous.

Accessibilité pour certains

&

confort pour tous !

En résumé


L'ACTION DU

FIPHFP

L’action du FIPHFP en faveur de l’accessibilité numérique

Le FIPHFP prend en charge, déduction faite des autres financements, le montant de l’aménagement/adaptation de poste, dans la limite d’un plafond de 10 000 € pour 3 ans.

Il finance uniquement les surcoûts du poste de travail lié à la compensation du handicap de l’agent et concernant notamment les aménagements suivants :

Mobiliers, équipements non standards

Outils bureautiques et/ou techniques déficience visuelle : logiciels braille, clavier braille, plage braille, télé agrandisseur, zoom text…

Outils bureautiques et/ou techniques déficience auditive : téléphonie adaptée,…

Outils bureautiques et/ou techniques autres déficiences

Le FIPHFP souhaite accompagner les employeurs publics dans la mise en accessibilité de leurs sites web et/ou applicatifs métiers internet, internes et externes, par une prise en charge financière.

Les employeurs sont invités à réaliser une inspection destinée à :

Soit leur délivrer un label type « AccessiWeb » ou « e-accessible » délivré par la DINSIC*

Soit publier une déclaration de conformité sur leur site web, suite à un audit interne selon les règles du référentiel RGAA.

*Direction Interministérielle du Numérique et du Système d’Information et de Communication du

gouvernement


Le FIPHFP intervient uniquement pour les sites et applicatifs web antérieurs au 29 avril 2015, date d’entrée en vigueur du référentiel RGAA.

Les logiciels distribués par des éditeurs n’entrent pas dans le champ des aides de pré-audit et d’accessibilité.


Le FIPHFP propose 3 nouveaux financements :

OBJECTIF :

Pour mieux comprendre

Pour s’évaluer

Pour se lancer

Sensibilisation ou formation à l’accessibilité numérique

Mise en accessibilité de sites ou applications,

avec un niveau de complexité :

Formation diplômante, qualifiante ou certifiante sur l’accessibilité numérique

des agents uniquement

Pré-diagnostic de sites ou

applications, à destination :

NATURE DE L’AIDE : PLAFOND :

1 000€ / j (max 10j/an)

1 600 €

10 000 € /an (max 3 ans)

325 €

725 €

2 600 €

4 000 €

simple

moyen

élevé

Audit initial

Accompagnements

Audit de validation

5 000 €

6 000 €

2 200 €

3 000 €

4 000 € 1 600 €

des agents et du public


Pause déjeuner !

ALORS,

COMMENT FAIRE ?


Un même site pour tous

De l’innovation et de nouveaux services

Une démarche Qualité

Un choix citoyen

Le respect de la loi

Un axe fort et global de communication

Une image de marque valorisée

Plus d’internautes

1

2

3

4

5

6

7

8

Un site internet accessible c’est donc :


▌

Lapeyre a imaginé l’enseigne Vita Confort et

ouvert une boutique dédiée à l’accessibilité.

Le concept ? Sensibiliser l’ensemble des

générations à l’importance de l’accessibilité et

concevoir un intérieur pour tous.

Dans la continuité de ces engagements

environnementaux, sociétaux et sociaux,

Lapeyre a fait le choix important d’investir

dans l’accessibilité numérique, afin qu’un plus

grand nombre de visiteurs puisse avoir accès à

ses informations et à ses produits, dans un but

égalitaire d’accès à internet.

L’accessibilité pour Lapeyre, c’est donc :

• un axe de communication globale,

• une image de marque valorisée,

• plus d’internautes.

LAPEYRE (www.vita-confort.fr)

Ils le font


▌

Le développement de l’administration

électronique est l’un des principaux leviers de

l’amélioration de la qualité des services

publics et de la modernisation des

collectivités.

Conformément à l’article 47 de la loi du 11

février 2005 pour l’égalité des droits et des

chances, la ville de Saint-Nazaire, pour la

refonte de son site internet en 2013, a

volontairement mis l'accent sur la prise en

compte de l'accessibilité numérique.

L’accessibilité pour la ville de Saint-Nazaire,

c’est donc :

• un même site pour tous,

• un choix citoyen,

• le respect de la loi,

• un axe de communication globale,

• une image de marque valorisée.

VILLE DE SAINT-NAZAIRE (www.mairie-saintnazaire.fr)

Ils le font


▌

La CNIEG, Caisse nationale des industries

électriques et gazières est un organisme de

Sécurité sociale de droit privé sous la tutelle

de l’Etat qui assure la gestion du régime spécial

d’assurance vieillesse, invalidité, décès,

accidents du travail et maladies professionnelles

d’EDF, Engie, RTE, Enedis….

La CNiEG fait de l’accessibilité numérique, un

pré-requis fonctionnel et technique de la

refonte de son site internet. Cette volonté est

révélatrice de la volonté de la CNIEG de placer

tous les utilisateurs au centre de la démarche

digitale pour en faire un levier de

communication interne et externe.

L’accessibilité pour la CNIEG, c’est donc :

• de l’innovation et de nouveaux services,

• une démarche Qualité,

• le respect de la loi,

• une image de marque valorisée.

CNIEG (www.cnieg.fr)

Ils le font


Technique

Ergonomie

Utilisation

Accessibilité numérique

Alors, comment faire ?


▌

Toutes les équipes

Formation

Pérenniser la démarche accessible



▌

Un surcoût de l'ordre de 30% du budget initial est à prévoir si l'on "rustine" a posteriori

Cet investissement chute pour être quasiment nul si l’accessibilité est intégrée en amont et

partagée par tous les acteurs du projet : c'est le principe de l'ascenseur !

3 points traitement ont un impact sur le budget :

• le traitement des PDF,

• le traitement des vidéos,

• la prise en charge des interfaces "riches" (Flash, scripts…).

L’accessibilité c’est cher ?



▌

De la rédaction du cahier des charges

jusqu’à la formation des contributeurs,

tous les acteurs d’un projet Web sont en charge de sa

qualité et de son rendement accessible !

L’accessibilité, un concept transverse qui impacte toute la chaine de décision digitale



▌

Spécifications

techniques et

fonctionnelles

Graphisme

Ergonomie

Intégration

des gabarits

HTML

Développement

Back & Front

Tests

et

Recette

CMS

Définition du CMS

! Formation !

CMS

Déclaration de

conformité

RGAA

L’accessibilité, un concept transverse qui impacte toute la chaine de décision digitale



▌ La découverte d’une interface en 3 temps : VTC


Voir Toucher Cliquer


▌ La découverte d’une interface en 3 temps : VTC


Voir Toucher Cliquer

Graphisme Développement Intégration HTML


▌

Ergonomie Technique

Graphiste

Utilisation

Utilisateur final Développeur

3 axes de prise en compte de l’accessibilité numérique



Technique

Ergonomie

Utilisation

Accessibilité numérique



▌

Toutes les équipes

Formation

Pérenniser la démarche accessible



▌

Barre AIS / IE

- Barres Web Developer / Firefox

- Accessibar / Firefox

- Navigateur Lynx

Des outils de contrôle manuel



▌ Des outils de contrôle automatique



▌ Comment aider Serge ?


« Sur plein de sites, les pubs se mettent en

route toutes seules et je ne sais pas comment

les arrêter. Ça fait du bruit et ça fait peur au

chien ! »

« Quand la page se recharge toute seule, je

perds le fil de ma lecture. »

1

2

3

Éviter les pages trop longues sans liens de navigation interne (ancres, haut de page…), Signaler à l’utilisateur l’ouverture de nouvelles fenêtres,

Permettre de contrôler facilement

les animations.


▌ Éviter les pages trop longues



▌ Attention aux menus à coulisse !





▌

Ronan

Un « senior »

« J’ai du mal à lire certains titres longs et

écrits en majuscules. Je distingue également

mal ce qui est écrit en italique. »

« Pour moi, dans le corps de la page, un lien

hypertexte doit être souligné et changer de

forme quand je passe dessus avec la souris.»

Privilégier le texte HTML par rapport aux textes présentés sous forme d’image,

Assurer la qualité des contrastes lorsqu’elle doit mettre des images informatives en ligne,

Éviter l’utilisation abondante

des majuscules et des italiques peu lisibles.

1

2

3

Comment aider Ronan ?



▌ Contrôler les contrastes



▌ Comment aider Ronan ?



▌ Tester en niveaux de gris



▌ Ne donner pas l’information uniquement par la couleur












▌

Ne donner pas l’information uniquement par la couleur



▌

Ne donner pas l’information uniquement par la couleur









▌

Envoyer

Valoriser la performance du clic



▌ Navigation et localisation



▌

Produire des alternatives accessibles pour l’ensemble des éléments graphiques informatifs (animés ou non),

Signaler à l’utilisateur l’ouverture de nouvelles fenêtres,

Définir des intitulés de liens hypertextes pertinents.

« Tout le site est construit avec des images, je

n’y vois rien ! Si au moins, ils mettaient des

alternatives sur les visuels !!! »

« Un site en Flash ? Sans une bonne alternative,

pour moi, ça ne sert à rien ! »

1

2

3

Comment aider David ?



▌

Pour consulter le programme de Matinales XXL, cliquez ici

Pour consulter le programme de Matinales XXL, cliquez ici

Pour consulter le programme de Matinales XXL, visiter le site de Com & Medias

Pour consulter le programme de Matinales XXL, visiter le site de Com & Medias

Utiliser des intitulés de liens pertinents







▌ Valider la dictée







▌ Un exemple d’alternative appropriée pour les images complexes





▌

Il faut proposer des boutons de contrôle (arrêt, lancer) au sein de l’objet

Proposer le contrôle sur un objet multimédia



▌

Cette transcription textuelle doit être disponible :

• soit directement sur la même page à proximité de la vidéo,

• soit sur une autre page, disponible depuis un lien à proximité de la vidéo.

Prévoir un moyen d'accès à la transcription textuelle de chaque vidéo



▌

L’audiodescription est l’équivalent des sous-titres pour les personnes aveugles ou malvoyantes. Elle

restitue sous forme de voix off les informations qui ne sont véhiculées que par l’image.

Prévoir un moyen d'activer l'audiodescription


Le mur des surprises Le mur des actions

Conclusions

Contacts

Anne

LAULHERE-VIGNEAU Cheffe de projet

[email protected]


Adeo Conseil


01.43.98.42.01

Samuel SAUVAGE Chef de projet

[email protected]


Adeo Conseil


01.43.98.42.01

tel:33143984201



tel:33143984201



Franck Letrouvé Expert certifié en accessibilité numérique

Membre du Groupe de Travail Accessibilité de l’association BrailleNet depuis 2004

----------------------------------------------------- [email protected]

www.pixfl.com

@franckletrouve

06 62 56 14 44

Nantes - Paris

<

Documents

Le numérique au service de l’emploi · 13 Handi-Pacte – Sensibilisation Accessibilité – Rennes - avril 2017 LOI n° 2016 -1321 du 7 octobre 2016 pour une République numérique