Salut, et bienvenue quand nous revenons en arrière et nous parlons de la conception pour
l'accessibilité une fois de plus.
Alors, comme je vous ai dit de plus en plus de
choses cool et soignées, je ressens parfois le besoin de vous maîtriser et
de vous rappeler les bases de la conception de votre page.
Et une partie de ces bases est que je veux vous rappeler que le contenu de votre
page doit être dans votre HTML.
Ce que je veux dire par là, c'est qu'il peut être vraiment tentant d'ajouter du contenu via des couleurs
, des images, etc., des choses que les gens ne peuvent pas percevoir, mais
vous n'y pensez pas nécessairement quand, en
tant qu'utilisateur visuel, vous l'amenez en quelque sorte.
Donc, ce que je veux que vous fassiez en concevant vos pages, en testant, en
reconcevant, en testant et en redessinant, c'est que vous vous souvenez de ce que nous appelons les lignes directrices
Nous voulons que vos pages soient perceptibles, exploitables, compréhensibles et robustes.
Et le
vrai genre de correspondance perceptible et compréhensible avec ce que vous faites avec votre CSS.
Donc, pour
que les choses soient perceptibles, je veux juste que vous vous souveniez de quelques choses.
Tout d'abord, n'oubliez pas de fournir des alternatives de texte pour vos images.
Vos images ne doivent pas transmettre l'information de leur propre chef.
Assurez-vous de fournir des légendes et des transcriptions pour la vidéo et le son.
Maintenant, tout le monde n'a pas accès à des outils pour vous fournir cela
gratuitement, mais où vous travaillez ou où vous allez à l'école peut vous aider.
Assurez-vous d'utiliser le balisage sémantique correct afin
que le contenu puisse être présenté de différentes manières.
Je veux que tu utilises cette balise de navigation.
Je veux que vous utilisiez la balise figure au lieu de la balise image.
Ce qui a tendance à se produire, c'est que les gens ont du code
qu'ils ont déjà écrit et qu'ils veulent être un peu paresseux et ne pas avoir à changer leur HTML,
parce que quand ils le font, ils doivent changer leur CSS.
Allez-y et faites ce changement.
Ça en vaudra vraiment la peine.
Facilitez la
connexion des utilisateurs, la visualisation de leur contenu, en utilisant un très bon contraste de couleurs.
Vous seriez très surpris de réaliser combien de personnes sont incapables d'accéder à l'
information sur le Web parce qu'elles ne peuvent vraiment pas voir ce que vous avez mis là-haut.
Ensuite, parlons de ce que cela signifie pour votre page d'être opérationnelle.
Ce que je veux dire par là, c'est que toutes les fonctionnalités qui entrent dans votre page
devraient être disponibles à partir du clavier.
Ne vous attendez pas à ce que tout le monde utilise une souris pour passer sur votre page.
Ne vous attendez pas à ce que certaines choses, il est normal que
certaines choses ne soient accessibles que si vous passez la souris sur eux.
Les utilisateurs devraient avoir le contrôle sur tous les délais et les limites.
Donc, si vous avez ces vidéos dans les médias, assurez-vous que vous le mettez dans qu'il y a
un panneau de contrôle pour qu'ils éteignent les choses, les éteignent, rembobinent, etc.
C'est quelque chose qui est vraiment important pour moi,
parce que j'ai des membres de la famille qui s'occupent de cela, c'est que vous voulez vous assurer
que vous n'avez pas une sorte de contenu qui clignote tout le temps.
Je ne parle pas du logiciel Flash.
Je parle de choses qui vont clignoter à l'écran et
l'utilisateur n'a pas le contrôle de l'éteindre.
Cela peut effectivement provoquer des crises.
Vous souhaitez fournir des moyens d'aider les utilisateurs à naviguer dans votre page.
Ne faites pas de casse-tête où ils doivent comprendre comment aller où ils
veulent aller.
Il est de votre devoir de les rendre aussi faciles que possible pour eux de trouver du contenu et de
déterminer où ils se trouvent sur votre page.
Voici quelques exemples rapides de différentes façons dont
les gens accèdent parfois au Web, que ce soit avec un pentick,
un clavier, une télécommande, une sorte de clavier accessible, ou
même une sorte de dispositifs bouffants qu'ils peuvent utiliser pour naviguer sur le Web.
Ensuite, parlons de ce que je veux dire quand une page est compréhensible.
Typiquement, vous voulez garder votre langue courte et douce sur votre page.
À moins d'être un auteur et de montrer vos œuvres,
les gens ne passeront que quelques secondes sur votre page.
Fais en sorte qu'il soit facile pour eux de comprendre ce que tu essaies de dire.
Lorsque le texte est complété par des illustrations, des vidéos
et d'autres formats, le cas échéant, vous voulez vous assurer que vous utilisez
une bonne conception universelle et que les gens peuvent y accéder.
Navigation, structure de l'information, ceux-ci devraient être vraiment séparés et
discernables de votre contenu.
Rendre les gens, rendre plus facile pour les gens de s'échapper, revenir à certaines pages, etc.
Et enfin, faire fonctionner vos pages de manière prévisible.
Cela peut être un peu déroutant de parler, mais
si vous avez déjà été sur un site Web où vous ne pouvez pas tout à fait comprendre comment
revenir à la page que vous étiez il y a trois pages, faites en sorte qu'il soit facile pour les gens de l'obtenir.
Enfin, aidez les utilisateurs à éviter et à corriger les erreurs.
C' est à vous, pas à eux, de trouver comment accéder à l'information.
Enfin, le R, le robuste dans le POUR.
Votre site est-il fonctionnel à travers diverses technologies, un téléphone intelligent, un
lecteur d'écran, un ordinateur portable, des penticks ?
Au fur et à mesure que vous travaillez avec moi et que
nous allons plus loin, nous parlerons du design responsive dans certains cours ultérieurs.
Et c'est de s'assurer que votre page est la meilleure qu'elle peut ressembler
sur différentes tailles d'écran.
Mais c'est plus que des tailles d'écran, vous devez aussi penser à des choses comme nous l'avons dit,
les penticks et les lecteurs d'écran.
Donc, il y aura des erreurs de syntaxe que vous pourriez avoir dans votre code
qui n'affectent pas ce que la page vous ressemble.
Tu es entré, ça a l'air super, tu es comme, je suis dorée.
Vous devez vous rappeler que ces erreurs de syntaxe peuvent gâcher d'autres technologies.
Assurez-vous donc de respecter les normes et d'
assurer la compatibilité future avec les nouveaux navigateurs.
Et la façon la plus simple de le faire est d'aller sur validator.w3c.org et
le wave.webaim.org pour valider votre code.
C' est simple, c'est rapide, et ça va vraiment vous donner une meilleure page.
Donc juste pour passer en revue, je ne te demande pas de faire de grands pas.
Je veux juste que vous fassiez les petites choses correctement.
Et cela commence vraiment avec les balises HTML appropriées.
Le style peut en fait rendre plus difficile pour certaines personnes d'accéder à l'information
, donc tester, tester.
Demandez aux gens de regarder votre page.
Demandez-leur de vous donner des commentaires.
Ne le prenez pas personnellement.
Ce n'est pas à propos de ton codage.
Il s'agit vraiment de faire un excellent produit.
Enfin, prenez l'habitude
d'utiliser ces différents outils d'accessibilité.
Ils sont là pour vous rendre la vie plus facile, pas plus difficile.
Enfin, la seule chose avec laquelle j'ai vraiment du mal, avec les étudiants,
c'est que nous voulons tous faire de nouvelles choses cool.
Mais les nouveaux styles cool et les nouvelles technologies cool
ne devraient pas être au prix de l'accessibilité et les personnes qui consultent votre page.
Donc j'espère vraiment que lorsque vous apprenez ce code et que
vous êtes un peu stressé sur l'utilisation de toutes ces choses cool que
vous apprenez, que vous vous souvenez que ce n'est pas d'avoir la page Web la plus cool.
Il s'agit d'avoir une page propre qui dépeint vraiment les informations
que vous voulez sortir sur le Web.
Bonne chance.