L'attribut alt dans un tag fournit un contenu alternatif aux utilisateurs qui ne peuvent pas télécharger d'images ou qui ont des images complètement désactivées. Nous utilisons cet attribut tout le temps pour rendre notre contenu plus accessible, mais avez-vous déjà pensé à quoi il ressemble réellement?
Nous allons utiliser le modèle de courrier électronique que nous avons créé dans un didacticiel précédent à titre d'exemple, mais les principes s'appliquent tout aussi bien à la conception de sites Web à l'aide d'un navigateur..
Si nous examinons notre fichier avec les images désactivées, voici à quoi il ressemble:
Il est clair que le texte ALT n’est pas attrayant, en particulier les liens. Nous pouvons faire quelques choses pour égayer.
Pour le titre principal, nous allons rendre le texte beaucoup plus gros et le changer en bleu foncé au lieu de noir. Nous faisons cela en ajoutant des styles à l'élément parent (dans ce cas une cellule). Ces styles seront ensuite appliqués aux balises alt dans cette cellule.
Ceci est notre cellule:
Nous allons ajouter un peu de style de texte pour qu'il ressemble à ceci:
Et nous allons styliser nos liens de médias sociaux pour qu'ils deviennent blancs:
Aussi simple que cela! Maintenant, nous pouvons être sûrs que notre courrier électronique s'affichera bien, même si les images sont désactivées.