Add avatar_alt text to lesson header images

[mdlincoln]

closes: #1324

To-do:

• determine if/how to do alt-text-translations
• generate to-do list of lessons that need alt text
• get all translations done
• update editor guidelines and YAML template with avatar_alt fields
• add avatar_alt to required fields in travis checks

[spapastamkou]

I thought it could be useful to add avatar_alt in all already published FR lessons and start doing it systematically in the ones that will follow. So if I understand correctly, it is ok to only add avatar_alt: [FR image title] in each lesson's yaml? On confirmation (or correction:-)) I will work through a separate ticket.

…

[mdlincoln]

@spapastamkou yes, correct, just adding avatar_alt will be fine! Can you please add the commits to this branch?

[spapastamkou]

only did this for the 2 FR lessons that are on the branch; could add later for the remaining 2 once the branch is updated.

[mdlincoln]

@spapastamkou I just updated this branch based on the most current gh-pages code

[arojascastro]

What is this sorcery? I do not understand what I have to do :-(

[walshbr]

@arojascastro - 397ffd1. For the files in the chunk you sign up for, you just need to add at the top as part of the YML metadata an avatar_alt category with text describing what the image for the lesson has in it.

[jenniferisasi]

What is this sorcery? I do not understand what I have to do :-(

No worries, @arojascastro. That is why I assigned you a batch of avatar edits, since you are probably the one who edits more lessons. So, those images we place for each lesson (the little, square, B&W ones) need to have an alt text for screen readers to describe the image and, thus, make our site more accessible.

You need to include 'avatar_alt' category in the YAML of the files I assigned you with a short description of the image. We are doing in on GitHub desktop to edit all lessons and then push them as a batch, rather than doing one by one online.

[arojascastro]

Ok thank you both @jenniferisasi @walshbr - when is the deadline for this? :-S

[walshbr]

@arojascastro I don't think we set a deadline.

[spapastamkou]

I was looking for an image for an original lesson I am editing and I thought that perhaps from now on, for the next original lessons to be published in any language, we can define something like a small convention for the avatar_alt in yaml? For example, include the original title of the image (from the notice), source (the library or archive), and identifier.
What do you think? If we agree, I can make a ticket to propose to the whole PH team. This would involve to make slight additions to the Editors guidelines, which I could take in charge.

[arojascastro]

done my part... sorry and thanks

[mdlincoln]

I just went through and finished all the EN texts. The remaining work is listed below. (I've also rebased against our current branch so all available lessons should now be on this PR)

[mdlincoln]

@programminghistorian/french-team 👍

• In /fr/lecons/analyse-corpus-antconc.md:

  • 'avatar_alt' is missing.

• In /fr/lecons/comprendre-les-pages-web.md:

  • 'avatar_alt' is missing.

• In /fr/lecons/introduction-a-la-stylometrie-avec-python.md:

  • 'avatar_alt' is missing.

• In /fr/lecons/nettoyer-ses-donnees-avec-openrefine.md:

  • 'avatar_alt' is missing.

• In /fr/lecons/travailler-avec-des-fichiers-texte.md:

  • 'avatar_alt' is missing.

[mdlincoln]

@programminghistorian/spanish-team

• In /es/lecciones/mineria-de-datos-en-internet-archive.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/normalizar-datos.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/palabras-clave-en-contexto-n-grams.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/poniendo-omeka-a-funcionar.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/preservar-datos-de-investigacion.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/procesamiento-basico-de-textos-en-r.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/reutilizacion-de-codigo-y-modularidad.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/salida-de-datos-como-archivo-html.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/salida-palabras-clave-contexto-ngrams.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/sparql-datos-abiertos-enlazados.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/topic-modeling-y-mallet.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/trabajar-con-archivos-de-texto.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/trabajar-con-paginas-web.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/transformacion-datos-xml-xsl.md:

  • 'avatar_alt' is missing.

• In /es/lecciones/ver-archivos-html.md:

  • 'avatar_alt' is missing.

[mdlincoln]

@programminghistorian/french-team and @programminghistorian/spanish-team We need just a few more avatar_alt additions on the lessons here, and then I will be ready to merge this PR!

[jenniferisasi]

jekyll 3.8.5 | Error: There were YAML errors.

Hmm...is it giving errors because the FR tags are missing? I don't see anything wrong with the tags I just added.

[spapastamkou]

I added the avatar_alt text in four lessons out of five.
The remaining lesson corresponds to this original: https://programminghistorian.org/en/lessons/viewing-html-files I am not sure the avatar_alt text in the original ("A boy drawing on a tablet") corresponds to the image, am I mistaken in this? This is why I left it out and prefer to confirm here before adding a translation.
(And the build fails bcz the text is missing in the FR lesson)

[mdlincoln]

@spapastamkou good catch! I put that into the wrong file. I'm pushing a change now.

[mdlincoln]

OK @spapastamkou I think this is ready - we just need the final French translation for comprendre-les-pages-web. I would propose a French translation, but I am not comfortable translating "ear trumpet" by myself 😂 Hopefully you have a more elegant term!

[spapastamkou]

@mdlincoln did my best:)