Seo web mobile-accessibilite-parisweb
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Seo web mobile-accessibilite-parisweb

on

  • 1,031 views

 

Statistics

Views

Total Views
1,031
Views on SlideShare
689
Embed Views
342

Actions

Likes
0
Downloads
6
Comments
2

3 Embeds 342

http://www.paris-web.fr 333
http://lanyrd.com 8
http://webcache.googleusercontent.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • SEO, Web mobile et accessibilité : Trinité du développement Web inclusif
    ParisWeb 2011
    Paris — 14 octobre 2011

    (En mode présentation, utiliser les flèches ou la barre d'espacement)

    Partagez!

    2011. Déposé sous license Creative Commons BY-NC-SA.

    Attribution
    NonCommercial
    ShareAlike 2.5 Canada

    Au pays des caribous...

    Conférencier

    Denis Boudreau

    11 années d'expérience en accessibilité du Web
    Président, Coopérative AccessibilitéWeb
    Co-rédacteur, standards SGQRI 008
    Expert invité, W3C
    WCAG Working Group
    Education and Outreach Working Group
    WCAG Evaluation Methodology TaskForce
    HTML5 Accessibility TaskForce

    a11y : un concept difficile à atteindre ?

    Quelle est votre propre expérience ? // Quels sont les défis ?

    Pour vendre l'accessibilité au sein des organisations ?
    Pour réaliser l'accessibilité au sein de l'industrie du Web ?

    Revoir l'approche face à l'accessibilité ?

    Une époque favorable au changememt

    Revoir le plan de match de l'accessibilité ?
    Certaines pratiques ont meilleure presse
    Convertir à défaut de convaincre

    Quelques signes annonciateurs...

    Image de deux tweets : 1) L'accessiblité, pour donner des résultats, doit s'inscrire dans une logique progressive d'amélioration continue. 2) Le plus grand signe de maturité en accessibilité, c'est pouvoir reconnaître que les standards n'ont pas à être monolithiques.

    KISS, dans une perspective d'accessibilité

    Et si KISS était un simple retour à l'intention ?

    Quelle est l'intention derrière l'accessibilité?
    Oublier les obligations : viser des résultats!
    Ne plus être paralysé par l'ampleur de la tâche

    KISS: Keeping Information Semantically Structured?

    Tendre vers un objectif d'inclusion

    Franchir la distance, une étape à la fois

    Progressivement
    Pragmatiquement
    Réalistement

    L'accessibilité n'est pas à propos de ce que veulent les législateurs. C'est à propos d'incarner l'inclusion et de répondre aux besoins des utilisateurs finaux.

    Trinité du développement Web inclusif

    Repenser sa stratégie de développement Web

    Analyse des pratiques SEO / Web mobile
    Établir un parallèle entre les pratiques
    Vendre l'accessibilité, indirectement
    Justifier les efforts d'inclusion autrement

    Retour sur ParisWeb 2010

    Chain breaking.

    RAPPEL / Prioriser les problèmes les plus fréquents

    Toujours d'actualité en 2011 :
    Équivalents textuels
    Navigation au clavier
    Structure des contenus
    Utilisation des couleurs
    Exploitation des formulaires

    Base de connaissances AccessibilitéWeb : Les règles 2.0
    http://certif.accessibiliteweb.com/accueil/base-de-connaissances/

    Accessibilité et Web mobile

    W3C Recoomendation: Mobile Web Best Practices 1.0 - Basic Guidelines.

    Mobile Web Best Practices 1.0

    60 pratiques exemplaires déclinées en 5 thèmes
    Comportement d'ensemble
    Navigation et liens
    Mise en pages et contenu
    Définition de la page
    Entrée de l'utilisateur

    Mobile Web Best Practices 1.0 - Basic Guidelines
    http://www.w3.org/TR/mobile-bp/

    From WCAG 2.0 to MWBP (W3C Note)
    http://www.w3.org/TR/mwbp-wcag/wcag20-mwbp.html

    De WCAG 2.0 à MWBP 1.0

    Capture d'écran - Meilleures pratiques du Web mobile.

    Établir un pont entre WCAG 2.0 et MWBP 1.0

    Directement liés aux critères de WCAG 2.0
    Éléments MWBP Critères Niveau Détail du critère WCAG
    Non-text Alts 1.1.1 A Contenu non-textuel
    Fonts 1.3.1 A Information et relations
    Style Sheets Use 1.3.1 A Information et relations
    Use of Color 1.4.1 A Utilisation de la couleur
    Tab Order 2.4.3 A Parcours du focus
    Auto-Refresh 3.2.5 AAA Changement sur demande
    Link Target ID 2.4.9 AAA Fonction du lien

    Plus 17 autres critères applicables (AA et AAA)

    Accessibilité et SEO

    Cube Rubick avec logos Google sur certaines faces.

    Les moteurs de recherche, dont Google...

    Ne comprennent que le texte
    N'utilisent jamais de périphériques
    Se fient à la structure du contenu
    Sont friands de vrais en-têtes de section
    Détestent les rafraîchissements automatiques
    Apprécient les navigations efficaces
    Dépendent de liens significatifs hors contexte

    À nouveau, des parallèles intéressants à établir entre l'accessibilité et les critères de succès de WCAG 2.0!

    SEO et équivalents textuels

    Amas de petites tuiles de carton, arborant chacune une lettre de l'alphabet.

    Au-delà des contenus textuels, point de salut!

    Critères Détail du critère WCAG Niveau
    1.1.1 Contenu non textuel A
    1.2.1 Contenu seulement audio ou vidéo A
    1.2.2 Sous-titres (pré-enregistrés) A
    1.2.3 Audio-description ou équivalent A
    1.2.4 Sous-titres (en direct) AA
    1.2.5 Audio-description (pré-enregistrée) AA
    1.4.5 Texte sous forme d'images AA
    1.2.6 à 1.2.9 Critères supplémentaires AAA

    SEO et navigation au clavier

    Trappe à souris avec un morceau de fromage.

    Pas de navigation possible au-delà du clavier

    Critères Détail du critère WCAG Niveau
    2.1.1 Clavier A
    2.1.2 Pas de piège au clavier A
    2.4.3 Parcours du focus A
    2.4.7 Visibilité du focus AA
    2.1.3 Critère supplémentaire AAA

    SEO et structure des contenus

    Représentation schématique d'une arborescence de contenus.

    Tables des matières et organisation de page

    Critères Détail du critère WCAG Niveau
    1.3.1 Information et relations A
    2.4.2 Titre de pages A
    2.4.6 En-têtes et étiquettes AA
    2.4.10 Critère supplémentaire AAA

    SEO, rafraîchissements et délais

    Deux flèches en boucle symbolisant un refraîchissement accompagné d'un chronomètre.

    Boucles infinies et barrières à l'information

    Critères Détail du critère WCAG Niveau
    2.2.1 Réglage du délai A
    2.2.2 Mettre en pause, arrêter, masquer A
    2.2.3 Critère supplémentaire AAA

    SEO et navigation efficace

    Série de symboles représentant des éléments de navigation.

    Mécanismes cohérents et structure sémantique

    Critères Détail du critère WCAG Niveau
    2.4.1 Contourner des blocs A
    2.4.2 Titre de page A
    2.4.3 Parcours du focus A
    2.4.4 Fonction du lien (selon le contexte) A
    2.4.5 Accès multiples AA
    2.4.6 En-têtes et étiquettes AA
    2.4.7 Visibilité du focus AA
    2.4.8 Critère supplémentaire AAA

    SEO et hyperliens significatifs

    Série de sphères inter reliées.

    Détermination de la réputation

    Critère de succès Détail du critère WCAG Niveau
    2.4.4 Fonction du lien (selon le contexte) A
    2.4.9 Critère supplémentaire AAA

    Synthèse

    Une combinaison gagnante à plusieurs niveaux

    Critères à considérer WCAG WMBP SEO
    Équivalents textuels √ √ √
    Navigation au clavier √ √ √
    Structure des contenus √ √ √
    Rafraîchissements et délais √ - √
    Navigation efficace √ - √
    Hyperliens significatifs √ √ √
    Utilisation des couleurs √ √ -
    Formulaires √ √ -

    SEO and Accessibility Overlap
    http://www.communis.co.uk/blog/2009-08-06-seo-and-accessibility-overlap

    La « qualité Web », au-delà des pratiques

    Mieux vendre l'accessibilité l'inclusion

    S'appuyer sur d'autres pratiques
    Élargir le spectre et amplifier la valeur
    Proposer un plan réaliste qui assurera des résultats
    Obtenir un appui engagé de la direction
    Transformer la perception de l'accessibilité
    S'engager dans une démarche mesurable

    Faire tomber les barrières une à une

    L'accessibilité dans une démarche globale de qualité

    Reconnaître l'aspect progressif de la démarche
    Renoncer à l'envie de tout faire d'un seul coup
    Répartir le travail entre les différents intervenants
    Prioriser les terrains d'interventions de chacun
    Adapter la chaîne de production au plan de match
    Se donner de vrais moyens d'atteindre ses objectifs

    Entrevoir les sites et applications Web comme des produits en quête constante d'amélioration et faire tomber les barrières, une à la fois.

    En conclusion, un souhait

    Don't stop believing.

    Merci de votre attention!

    Denis Boudreau,
    Président

    Coopérative AccessibilitéWeb
    1751 rue Richardson, bureau 6111
    Montréal (Québec), Canada H3K 1G6
    Sans frais : +1 (877) 315-5550

    Courriel : info@accessibiliteweb.com
    Web : www.accessibiliteweb.com
    Blogue : www.accessiblogue.com
    Twitter : @AccessibiliteWb / @dboudreau

    Permalien (fichier HTML/CSS/JS)
    http://www.accessibiliteweb.com/presentations/2011/parisweb/

    Spkr8 - Commentaires, suggestions ?
    http://spkr8.com/t/8722
    Are you sure you want to
    Your message goes here
    Processing…
  • Version accessible de la présentation : http://www.accessibiliteweb.com/presentations/2011/parisweb/
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Seo web mobile-accessibilite-parisweb Presentation Transcript

  • 1. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...1 of 25 11-10-27 11:21 PM
  • 2. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...2 of 25 11-10-27 11:21 PM
  • 3. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...3 of 25 11-10-27 11:21 PM
  • 4. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...4 of 25 11-10-27 11:21 PM
  • 5. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...5 of 25 11-10-27 11:21 PM
  • 6. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...6 of 25 11-10-27 11:21 PM
  • 7. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...7 of 25 11-10-27 11:21 PM
  • 8. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...8 of 25 11-10-27 11:21 PM
  • 9. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...9 of 25 11-10-27 11:21 PM
  • 10. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...10 of 25 11-10-27 11:21 PM
  • 11. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...11 of 25 11-10-27 11:21 PM
  • 12. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...12 of 25 11-10-27 11:21 PM
  • 13. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...13 of 25 11-10-27 11:21 PM
  • 14. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...14 of 25 11-10-27 11:21 PM
  • 15. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...15 of 25 11-10-27 11:21 PM
  • 16. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...16 of 25 11-10-27 11:21 PM
  • 17. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...17 of 25 11-10-27 11:21 PM
  • 18. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...18 of 25 11-10-27 11:21 PM
  • 19. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...19 of 25 11-10-27 11:21 PM
  • 20. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...20 of 25 11-10-27 11:21 PM
  • 21. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...21 of 25 11-10-27 11:21 PM
  • 22. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...22 of 25 11-10-27 11:21 PM
  • 23. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...23 of 25 11-10-27 11:21 PM
  • 24. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...24 of 25 11-10-27 11:21 PM
  • 25. SEO, Web mobile et accessibilité : Trinité du développement Web inclu... file:///Users/webconforme/Documents/Work/CSAW/@Administratif/C...25 of 25 11-10-27 11:21 PM