[Accessibilité Web] Bien écrire le texte alternatif des images

Savez-vous que le texte alternatif des images peut être utilisé par des logiciels d’assistance aux personnes ayant des défiances visuelles. Autrement dit, les logiciels de lecture d’écran vont lire le texte alternatif pour pouvoir décrire les images et photos.

Code HTML d’une image

Ce texte alternatif est un attribut HTML placé dans l’image. Voici un exemple typique de code HTML d’une image avec un le texte alternatif :

<img src="photo.jpg" alt="description de l'image" />

A titre d’information, avec WordPress cet attribut est présent dans le champ « alt text » lors de l’ajout d’une image.

Le texte alternatif d’une image

Mais il faut malgré tout respecter quelques bonnes pratiques pour que ça soit vraiment utile :

  • L’attribut ne doit pas commencer par « image de … » ou « photo de … ». Les lecteurs d’écran expliquent déjà qu’il s’agit d’une illustration
  • Le texte doit être bref
  • Le texte doit être suffisamment descriptif si l’image est importante pour comprendre le reste du contenu de la page web
  • L’attribut peut rester vide si l’image est utilisée pour le design du site.

Merci de respecter ces petits conseils pour faciliter la vie auprès de vos lecteurs.

12 requêtes SQL de maintenance sur WordPress

Le CMS WordPress est un excellent outil pour la création d’un site ou d’un blog. Lorsqu’il est installé sur un serveur il faut parfois mettre les mains dans le cambouis, façon de parler, pour améliorer les performances ou résoudre une problématique. Cet article va présenter une ressource contenant des requêtes SQL pour purger des données qui ne sont plus utiles.

Logo WordPress

Pourquoi faut-il faire le tri de temps en temps ?

Au fil du temps, un site WordPress fini par garder en base de données des informations qui ne sont plus utilisées. L’un des exemples les plus courant ce sont les révisions des articles. Par défaut WordPress enregistre une sauvegarde de chaque modification pour revenir facilement à une ancienne version d’un article. Ceci peut être pratique lors de la rédaction d’un article, lorsque celui-ci est encore en brouillon. Toutefois, je crains que cette fonctionnalité soit très utiles à un blogueur lorsque l’article à déjà été publié depuis plus d’un an.

Il convient dès lors de purger les révisions pour libérer de l’espace sur la base de données et ainsi améliorer les performances de son site. Les blogs qui possèdent beaucoup d’articles remarqueront une amélioration immédiate.

Quelles informations peuvent être purgées ?

L’article « Requêtes SQL pour nettoyer une base de données WordPress » présente plus de 12 requêtes pour purger les données suivantes :

  1. Supprimer les révisions
  2. Supprimer les commentaires de spams
  3. Purger les données associées à des commentaires supprimés
  4. Supprimer des données associées au plugin Akismet
  5. Supprimer des données associées à des articles qui n’existent plus
  6. Suppression des pingbacks/trackbacks
  7. Supprimer un champ personnalisé
  8. Suppression définitive d’un mot-clé qui n’existe plus
  9. Purger le cache des flux
  10. Supprimer les articles vieux de plus de X jours ou plus vieux que la date X
  11. Supprimer le user agent de chaque commentaire
  12. Supprimer un shortcode des articles et pages

Si vous avez un blog WordPress vous remarquerez surement qu’il y a un cas dans cette liste qui vous concerne et qui peut vous aider à économiser de l’espace dans votre base de données. N’hésitez pas à faire le ménage et à indiquer combien de Mo vous avez alléger vos tables WordPress.

Pays du monde en SQL ou CSV

Il est courant qu’une site web ou qu’une application doivent utiliser une liste des pays du monde. A titre d’exemple, c’est pratiquement toujours le cas pour les sites d’e-commerce qui fonctionne à l’international. Il faut que l’utilisateur puisse entrer son adresse, incluant son pays. Cet article présente un lien pour télécharger une telle liste.

Carte mondiale de la terre

Carte mondiale de la terre

Intérêt d’une table qui liste les pays

Si un utilisateur doit entrer le nom de son pays, il est recommandé d’avoir une liste déroulante des options disponibles pour plusieurs raisons:

  • Évite les erreurs de frappes
  • Permet de gagner du temps à chercher dans une liste plutôt que d’écrire le nom du pays s’il est très long
  • Pas besoin de savoir dans quelle langue écrire le nom du pays
  • Si un pays n’est pas pris en charge, vous pouvez l’enlever de la liste ou prévoir une fonctionnalité spécifique qui en informera l’utilisateur
  • Réduit la base de données total car seul une clé étrangère sera utilisée, il n’y aura pas besoin de ré-écrire le nom du pays dans les enregistrements des utilisateurs

Télécharger la liste

La liste est disponible en téléchargement sur le site sql.sh, à l’article intitulé : Liste des pays du monde au format SQL, CSV ou XML. Cette liste à l’avantage d’avoir les noms des pays écris en français et en anglais (pratique pour les applications multilingues) et également d’avoir une correspondance avec le code ISO des pays (utile pour servir de clé étrangère). Faites bon usage de cette liste.

La page d’accueil d’un site n’est pas la 1er page du site

La page d’accueil d’un site web est celle qui reçoit probablement le plus d’attention lors de sa conception. Il est souvent considéré que la page d’accueil est la page la plus importante du site. Toutefois, l’attention portée à l’accueil est parfois démesuré comparé au trafic qu’elle recevra réellement.

Statistiques de la page d’accueil

Si vous avez un site web, consultez le trafic qu’elle obtient. Comparez au reste du site, cette page reçoit généralement moins de 50% du trafic. Sur certains gros portails, la page d’accueil reçoit de 2% à 10% du trafic entrant (statistiques 2008/2010). Cela signifie que les visiteurs arrivent majoritairement sur des pages profondes.

Comment consacrer plus de temps sur les pages profondes

Pour éviter de passer trop de temps sur la page d’accueil, il faut donc revoir sa stratégie de base et se mettre dans la peau d’un internaute qui accède au site depuis une page profonde. Voici des axes d’améliorations possibles:

  • L’identité visuelle du site est-elle toujours présente ? (logo, couleurs en rapport avec la thématique …).
  • Y a-t-il une tagline qui explique en quelques mots le type de site sur lequel l’internaute se situe ?
  • Est-ce qu’il y a des éléments qui permettent de savoir où le visiteur se trouve (fil d’Ariane, menu avec un indicateur pour savoir dans quelles rubriques l’utilisateur est actuellement …) ?
  • La navigation permet-elle d’accéder à la page d’accueil et aux principaux contenu du site ?
  • Y a-t-il un titre sur cette page ?

Pour s’assurer d’un bon taux de pages vues par visiteurs, il ne faut pas hésiter à utiliser des call-to-actions.

Astuce : Les stratégies utilisées sur la page d’accueil pour guider l’utilisateur peuvent parfois être recyclées sur d’autres pages du site qui génèrent beaucoup de trafic.

Ajouter un plan du site sur un site WordPress

WordPress est un outil de création de site/blog très populaire. L’outil est très complet et les quelques fonctionnalités spécifiques qui n’existe pas peuvent être implémentée grâce aux plugins créé par la communauté qui soutient ce logiciel. Cet article présente un plugin pour ajouter un plan du site.

Logo WordPress

Ajout d’un plan du site

Par défaut il n’est pas possible d’ajouter un plan du site sur WordPress. Attention, je ne parle pas d’un sitemap XML à donner à Google, mais bien d’une liste de toutes les pages ou de tous les articles du blog.

Le plugin « WP Sitemap Page » est un très bon moyen d’ajouter la liste de toutes les pages sur une page de son site. Le plugin est plus léger que les plugins concurrents qui font la même chose. Par ailleurs, il est gratuit et n’affiche aucune publicité (alors que certains concurrents ajoutent un lien en bas du sitemap).

Utilisation

L’utilisation du plugin reste très simple. Il suffit d’effectuer les actions suivantes:

  1. télécharger le plugin depuis le site officiel
  2. le dézipper et envoyer le dossier dans « /wp-content/plugins/ » (avec un logiciel FTP)
  3. Utiliser l’interface administrateur de WordPress pour activer ce nouveau plugin
  4. Créer une nouvelle page qui sera appelée « Plan du site »
  5. Sur cette nouvelle page, dans le contenu il faut utiliser le petit bout de code : [wp_sitemap_page] (il faut aussi utiliser les accolades)
  6. Sauvegarder la page

Ca y est, il suffit maintenant de visualiser la page pour vérifier sa bonne conformité. C’est aussi simple que ça d’installer un plan du site sur le CMS WordPress.

A noter : le plugin fait même un lien vers les catégories du blog.

Continuation

N’hésitez pas à indiquer des axes d’amélioration possible au développeur sur son compte Twitter : @TonyArchambeau. Le plugin est actuellement sur sa première version mais il est possible d’effectuer des améliorations.

Connaître son adresse IP

Sur le web il est courant de devoir déterminer son adresse IP. Cette adresse est un identifiant qui permet à n’importe quelle ressource connectée au web d’être reconnue. Il s’agit d’un code composé de 32 bits, comme l’explique la capture ci-dessous.

Adresse IP v4

Explication sur une adresse IP v4

Les outils idéaux pour connaître son adresse IP sont les outils en ligne qui divulgue l’adresse IP. C’est très pratiques puisqu’il n’y a rien à télécharger et cela permet d’avoir la véritable adresse IP publique. Cela évite de confondre avec les adresses IP d’un réseau. Par ailleurs, ces outils permettent accessoirement de donner des indications sur la configuration d’un poste (langue utilisée par le navigateur, taille de l’écran …).

Conception des sites en responsive design

De nos jours la conception de sites web implique de les rendre adaptables sur un maximum de supports. La technique consistant à faire un site web en responsive design est le meilleur compromis pour s’assurer que son site web sera lisible correctement sur ordinateur, tablette et smartphone.

Exemple d'un site responsive visible sur écran, tablette et mobile.

Exemple d’un site responsive visible sur écran, tablette et mobile.

Qu’est-ce que le responsive web design ?

Un site responsive est un site totalement ordinaire qui se contente d’adapter le design aux dimensions de l’écran. Il suffit par exemple de redimensionner la fenêtre de son navigateur en plus petit pour constater que le design se transforme en design pour mobile.

Cette technique qui consiste à adapter le design à la taille de l’écran est beaucoup plus simple à mettre en oeuvre que de créer une application spécifique pour iPhone, Android ou Blackberry (par exemple).

Techniquement comment ça marche ?

Au niveau de la technique, il suffit simplement d’utiliser ce qu’on appel les @media-queries à la feuille de style CSS. Les media-queries sont en quelques sortes des règles qui stipulent par exemple « si la largeur est inférieur à 400 pixels alors transformer les liens en boutons ».

Il ne faut pas oublier que le chargement d’un site sur mobile est plus lent que sur un ordinateur de bureau. Les développeurs qui prennent véritablement cela en compte vont essayer d’optimiser le code source pour avoir un temps de chargement correct sur ces petits suppots.

Quel est le budget pour faire un site responsive ?

Une chose est sûr, le développement d’un site responsive est globalement moins long que le développement d’une application dédiée pour smartphone ou pour tablette. Pour les webdesign les plus simples il faut environ 4 jours de travail pour implémenter un tel dispositif sur un site existant. Les design les plus complexes et les plus poussés peuvent demander 3 à 4 semaines pour mettre en place un tel responsive design. Il est même possible de faire plus long si le site doit être très optimisés et qu’il y a des effets et animations particulier.

Si vous êtes intéressé, n’hésitez pas à contacter une agence capable de réaliser des design responsive. Demander un devis est rapide et si le devis vous convient, vous pourrez enfin rendre votre site compatible sur un maximum de support.