Un plugin pour rendre ses articles plus interactifs

Utilisation de H5P dans WordPress : #1 présentation générale

Utilisation de H5P dans WordPress : #2 Créer son premier diaporama

Utilisation de H5P dans WordPress : #3 Ajouter des activités

Utilisation de H5P dans WordPress : #4 Publier le diaporama dans un article

N’hésitez pas à signaler dans les commentaires vos chefs d’œuvre !

Merci de faire la demande par mail à Clairelle Lestage pour que l‘on vous installe ce qu’il faut dans votre blog pour pouvoir utiliser H5P ! Il faut 2 minutes pour le faire.

Texte de substitution et légendes pour améliorer l’accès à tous

Les trois singes sageshttp://fr.freepik.com/photos-libre/trois-singes_571826.htm

Saviez-vous que plus que 40% de la population est affecté par une déficience?
Saviez-vous que les personnes plus de 50 ans représentent 30% des internautes et les plus de 74 ans 16%?
Et savez-vous qu’est-ce que l’accessibilité web?

Sur Wikipédia, l’accessibilité de tous à un site web est définie comme l’accès au contenu de ce site quelques soient les handicaps :  visuels (cécité, trouble de la vision, daltonisme, achromatopsie), auditifs (surdité totale ou partielle), moteurs, cognitifs ou neurologiques, ou encore liés au vieillissement.

Des normes et recommandations

World Wide Web consortiumLes personnes ayant une déficience visuelle utilisent des « Lecteurs d’écran » pour prendre connaissance du contenu d’une page web ( exemple: http://www.nvda-fr.org/).

Afin que ces lecteurs d’écran fonctionnent bien et puissent décrire l’intégralité du contenu d’une page, il est indispensable de suivre les normes données par le W3C au travers du WCAG (Web Content Accessibility Guidelines). Pour plus d’information : https://www.w3.org/TR/WCAG20/. Ainsi, comment le contenu de l’image en haut de cet article pourrait être comprise d’une personne ayant des troubles visuels ?

La première recommandation du WCAG est de « fournir des alternatives équivalentes aux contenus visuels et auditifs (images statiques ou animées, contenus audio et vidéo) ; »

Ajouter des textes de substitution ou légendes dans ma page web

Les images constituent le premier obstacle majeur à l’accessibilité des pages Web. En y associant une description, les lecteurs d’écran pourront lire celle-ci en remplacement de l’image.

L’attribut alt

L’attribut alt est le principal vecteur des textes alternatifs pour :

  • les images img ;
  • les zones réactives des images cliquables area ;
  • les boutons de formulaire input type="image".

Ces descriptions doivent être concises et complètes. Les termes les plus importants doivent être placés au début du texte.

L’attribut longdesc et le lien D

Si la description excède 10 mots, il faut en effet envisager le recours à l’attribut longdesc des éléments img, qui crée un lien vers cette description détaillée placée dans un document annexe. Cependant, le support de cet attribut est encore très partiel. On le remplace donc fréquemment par un lien « D » (pour Description) : placé après la balise image, ce lien, avec la lettre « D » en guise de texte, mène à la page de description de l’image. C’est particulièrement utile dans le cas des images contenant des informations complexes, telles les graphiques.

Attention toutes les images ne sont pas concernées

Seules les images dites « significatives » doivent-être substituées. Il s’agit:

  • d’images ayant un sens,
  • des images porteuses d’un lien
  • ou du texte en image.

Les images transparentes ou à titre décoratif ne nécessiteront pas de légende.

Pour illustrer cet article voici une vidéo issue du site www.access-key.org réalisée par l’université de Nice Sophia Antipolis.

 

Alors, quels texte alternatif et légende pourrions-nous proposer à l’image en tête de cet article?

En cliquant sur une image insérée dans un article du blog, il est possible d’insérer ces informations et donc d’être plus accessible.

Structurer son texte : tout un programme !

Produire un billet de blog demande du travail. Il ne suffit pas d’écrire un texte, encore faut-il le mettre en forme ! Pour ce faire, il est conseillé d’utiliser toutes les opportunités offertes par le HTML (HyperText Markup Language), langage descriptif utilisé pour les pages internet. Heureusement, vous n’êtes pas obligé d’être expert en HTML, en effet, l’éditeur qui vous est proposé va vous aider !

Mais pourquoi mettre en forme ?

Cette mise en forme inclut bien sûr le choix et le positionnement des illustrations, mais aussi – et surtout – la structuration du texte, qui est essentielle à trois titre :

  1. Un texte bien structuré est plus facile à lire pour le lecteur : on comprend mieux la logique de l’auteur, on suit mieux sa démarche intellectuelle.
  2. Un texte bien structuré est plus facile à lire par un robot : ces machines qui parcourent le web à longueur de journées, indexent les pages pour vous les resservir lorsque vous posez une question à votre moteur de recherche préféré, s’appuient sur la structuration HTML du texte pour repérer les mots clés et catégoriser votre article.
  3. Il est beaucoup plus facile de configurer l’esthétique d’un texte bien structuré. Le langage CSS (Cascading Style Sheet) permet de définir tous les paramètres de votre page (police, couleurs, taille de texte, alignement, …) en s’appuyant sur la structure HTML de vos documents. C’est en s’appuyant sur ces possibilités que les couleurs des titres  des articles de ce blog s’adaptent à la catégorie dans laquelle chaque billet est référencé.

On peut donc analyser une page web selon trois niveaux :

  • le contenu, qui correspond au texte brut,
  • la structure, apportée par le langage HTML qui permet de présenter l’organisation logique et l’articulation des différents éléments présentés ( = la logique de votre pensée),
  • la présentation, gérée par le langage CSS, qui apporte l’aspect esthétique de votre production.

Cette idée de mettre en forme n’est elle utile que sur Internet ?

Non, bien sûr, et voici deux exemples.

1 – Avec un traitement de texte

Si vous avez un document long à réaliser (un rapport de stage, un mémoire, une dissertation, …) vous trouverez pratique d’utiliser les styles proposés par votre traitement de texte. Cela vous permettra :

  • de structurer votre document,
  • de vérifier que la structure est cohérente : les chapitres s’enchainent bien, les niveaux de paragraphes et sous-paragraphes sont cohérents, …
  • d’avoir une mise en page cohérente tout au long de votre document,
  • de générer automatiquement une table des matières.

2 – Avec un papier et un crayon

Guillaume Apollinaire est un grand auteur français, célèbre pour ses calligrammes. Voici ci-dessous trois versions du même poème. Même si c’est un exemple manuscrit, il permet de bien comprendre la différence entre le texte, sa structuration et sa présentation.

a) le texte brut

Reconnais-toi
Cette adorable personne c’est toi sous le grand chapeau canotier Œil  Nez La bouche Voici l’ovale de ta figure Ton cou exquis Voici enfin l’imparfaite image de ton buste adoré  vu comme à travers un nuage Un peu plus bas c’est ton cœur qui bat.

b) le texte structuré

Reconnais-toi
Cette adorable personne c’est toi
Sous le grand chapeau canotier
Œil
Nez
La bouche
Voici l’ovale de ta figure
Ton cou exquis
Voici enfin l’imparfaite image de ton buste adoré  vu comme à travers un nuage
Un peu plus bas c’est ton cœur qui bat

c) le calligramme

calligramme de Guillaume Apollinaire

Alors, quelle version vous semble la plus poétique ?

 

Qu’est-ce qui a été publié dans ce blog de janvier à mars 2017 ?

Voici le temps de faire un petit bilan des articles publiés depuis le début de cette nouvelle année 2017.

10 articles ont été déposés dans ce blog d’accompagnement du concours. Vous pourrez maintenant vous y référer si vous vous posez des questions sur la différence entre un logiciel libre et un logiciel gratuit, une version plus simple a même été proposée pour nos plus jeunes participants.

Toujours dans la même réflexion sur comment bien utiliser les ressources d’internet, un article vous informe des droits d’utilisation (ou de réutilisation) des images trouvées sur internet. Il existe des ressources que l’on peut réutiliser en respectant le droit. Allez voir la vidéo récapitulative proposée dans cet article. Et si vous avez besoin d’images à fond transparent, qui adopte automatiquement la couleur d’arrière-plan de votre page, vous trouverez dans cet article tout ce que vous devez savoir.

Si vous confondiez un avatar avec un troll, cela ne devrait plus vous arriver après la lecture de ces deux articles !

Une réflexion vous est également proposée sur comment choisir un bon mot de passe, avec une version destinée à nos participants les plus jeunes. Pensez à faire le petit jeu qui se trouve en bas de la page de l’article.

Un article se pose la question de savoir si le droit à l’oubli sur internet existe vraiment, et comment faire si l’on veut supprimer définitivement une photo de soi sur internet ?

Enfin vous pouvez accéder à la liste des équipes qui participent au concours cette année, bravo à tous !

Et vous, qu’avez pu mettre en application dans votre blog ? Avez-vous choisi des avatars ? Avez-vous réutilisé des images trouvées sur internet ? Dites-nous ce que vous avez pu mettre en place dans votre blog en utilisant les commentaires ci-dessous.

Mon mot de passe est-il sécurisé ?

« 123456 »
« azerty »
« soleil »
« iloveyou »
« password »
….
Ai-je trouvé votre mot de passe ?
Ou peut-être ne suis-je pas loin ?
Si oui, cela est très inquiétant…
Ces mots de passe sont parmi les plus répandus sur internet.

15415460033_dc72f39b0a

Savez-vous que si votre mot de passe est trop commun, il faudra moins d’une seconde à un pirate informatique pour le découvrir ?

Mettre un mot de passe sur un compte en ligne, c’est souvent un casse-tête, il faut pouvoir s’en rappeler facilement, on se dit qu’il est plus simple de mettre un terme qui nous parle : une date d’anniversaire, le prénom d’un membre de la famille, … Et tant qu’à faire, on va mettre le même pour tous nos comptes !

C’est l’erreur que font la majorité des internautes qui prennent cette procédure un peu trop à la légère, les mots de passe sont les protecteurs de vos données. S’ils sont négligés, les dégâts pourraient être particulièrement ennuyeux : accès à votre messagerie ou à vos comptes de réseaux sociaux tels que Twitter ou Facebook. Est-ce que cela vous plairait qu’un pirate informatique s’amuse à dire n’importe quoi à vos amis sur Facebook ?

Syrian.hacker

Des sites pour tester la force du mot de passe

La majorité des services en ligne proposent maintenant un testeur de mot de passe qui vous informe de la solidité de votre mot de passe lorsque vous devez créer un compte.

Voici toutefois une liste de sites qui vous diront s’il est temps de changer le votre :

Alors comment sécuriser un mot de passe ?

Certaines « règles » permettent d’avoir un mot de passe qui dispose d’un minimum de sécurité.

  1. Ne lésinez pas sur la longueur : les mots de passe trop courts sont encore plus faciles à trouver, il est conseillé d’avoir au moins 8 caractères.
  2. Mélangez les types de caractères : il est important de les varier, vous pouvez mélanger des majuscules et des minuscules, rajouter des chiffres et aussi des caractères spéciaux tels que ? % ; / ! $
  3. Évitez au maximum les mots du dictionnaire : c’est le premier test qu’un pirate informatique réalisera, il dispose d’une immense base de données contenant tous les mots du dictionnaire et lancera donc son attaque jusqu’à ce que le mot de passe soit dévoilé.
  4. Votre mot de passe doit être unique : chaque site / service doit avoir son propre mot de passe. Si un de vos mots de passe est cassé, cela évitera d’avoir accès à tous vos autres services.

Quelques techniques pour générer un mot de passe sécurisé et surtout le retenir

C’est bien beau tout ça, mais ça rend mon mot de passe très complexe et difficile à retenir !

Voici deux techniques utilisant des moyens mnémotechniques :

Technique 1 :

La première consiste à prendre une phrase, une citation, un titre de film qui nous plaît et qu’on retient facilement.

Prenons par exemple une citation de Confucius : « Le silence est un ami qui ne trahit jamais »

On peut donc sélectionner les première lettres de chaque mot, ce qui donne « lseuaqntj »

Bien ! On a un mot de passe de 9 caractères qui n’est pas dans le dictionnaire.

… mais d’après ce qu’on a vu précédemment, on peut faire mieux, on va le complexifier en mélangeant des majuscules et des minuscules : « LseuAqntJ »

Maintenant on va transformer certaines lettres en chiffres, « un » peut être changé en « 1 », le « s » ressemble au chiffre « 5 » : « L5e1AqntJ »

Enfin pour le fun on va rajouter un caractère spécial (ou plusieurs) : « L5e1AqntJ! »

Et voilà ! « L5e1AqntJ! » est un mot de passe sécurisé qu’on pourra retrouver à partir de la citation d’origine.

Technique 2 :

Vous aimez écrire en SMS ?
Alors pourquoi ne pas générer un mot de passe en SMS ?

Sur le même principe que la technique précédente, nous allons créer un mot de passe en substituant les sonorités des mots par des chiffres ou d’autres sonorités qui s’en rapprochent.

Prenons la phrase : « J’ai eu un cours de maths ce matin, c’était trop bien ! »

Cela donnerait : « Gu1Kour2MatCeMat1,CTtrobi1! »

Pas mal non ?

Utiliser un site pour générer mon mot de passe

Vous pouvez toujours utiliser des sites spécialisés qui vous permettent de générer aléatoirement un mot de passe sécurisé, il en existe des tonnes sur internet, en voici deux exemples :

Conclusion

Voilà, vous être prêt à générer un vrai mot de passe !

Attention, un mot de passe se périme, pensez à le changer de temps en temps.

Bien sûr, la terre entière ne cherche pas à voler tous vos comptes en ligne, mais cela permettra de les sécuriser un minimum et de garder l’esprit tranquille.

Et surtout, ne le donnez à personne !