n1fo.fr : Gutenberg, WebP, Internet Explorer & Safari

Tout au long de la vie d'un site, des choix sont à faire concernant la direction à donner tant pour le contenu que pour l'aspect général de ce dernier afin qu'il soit accessible au plus grand nombre.

Après avoir soufflé sa 12ème bougie en Juin dernier, le site est toujours vivant mais est, néanmoins, dans un état un peu léthargique au niveau du contenu par rapport à ses débuts.

Concernant l'aspect, le thème actuellement appliqué va rester tant que WordPress le supporte, avec les nombreuses modifications apportés (notamment le mode sombre). Cependant, il faut parfois faire quelques choix sur le support de certains navigateurs et la dernière version de WordPress (la 5.8) m'a facilité un peu les choses concernant Internet Explorer et Safari.

Gutenberg

Gutenberg est le nom du nouvel éditeur de WordPress introduit depuis la version 5.0 il y a un an et demi, il s'est démarqué par la façon de créer le contenu d'un article ou d'une page par la gestion de blocs.

Autant le dire, il ne m'avait clairement pas plu au début. Rigide, impossible à personnaliser, erreurs à tout bout de champ, l'utiliser convertissait ma sérénité en arrachage de cheveux. J'avais donc continué à utiliser l'éditeur classique jusqu'à ce que je lui redonne à nouveau une chance après la sortie de sa version 11.0 (actuellement il est déjà en 11.2).

C'est définitivement bien plus facile à prendre en main et bien plus souple qu'auparavant. A tel point que j'ai déjà commencé à convertir certains pages dans la section téléchargement au nouvel éditeur (les pages ayant l'icône du logiciel sur la droite sont déjà convertie à Gutenberg). Ces dernières seront améliorées au fur et à mesure que des nouvelles fonctionnalités arrivent avec les futures versions de l'éditeur.

WebP

Parmi les améliorations sous le capot, WordPress 5.8 a (ENFIN!) introduit la gestion native des images WebP (pour les serveurs qui le supportent). L'avantage du WebP fait qu'il peut remplacer 3 autres formats d'images : le JPG, le PNG et le GIF animé

A compression équivalente, le WebP détériore moins l'image que le JPG tout en étant plus léger. Pour le sans perte, c'est pareil par rapport au PNG, l'image finale est bien plus légère. Pour ce qui est d'une image animée, le WebP a l'avantage d'être moins lourd que APNG et d'avoir la même gestion de couleurs que ce dernier surtout par rapport à l'archaïque GIF bloqué avec ses 256 couleurs.

Du coup, avec ses avantages, il devient le format d'image par défaut utilisé sur le site. Et vu qu'il est utilisé par un large panel de navigateurs bureau et mobile, la transition ne se verra même pas. 😉

Cependant, certains navigateurs ne supportent pas ce format d'image…

Internet Explorer & Safari

Oui, c'est eux les coupables ! Jusqu'ici, j'utilisais de subterfuges afin d'être compatible avec ces deux zigotos : Une image posté en PNG était convertie et affichée en WebP pour les navigateurs récent tandis que ces deux là pouvaient encore obtenir une image en PNG.

Mais vu que la multiplications d'images alourdi tout le système, il fallait faire un choix : rester en PNG quitte à se faire déclasser dans le référencement des moteurs de recherches parce que c'est pas "mobile-friendly" (oui les moteurs de recherche ne jurent plus que par le mobile désormais) ou passer au WebP et simplifier la chose.

Avec l'arrivée de WordPress 5.8 et sa gestion native des WebP, le choix a été vite fait. Désormais, n1fo.fr ne gère plus Internet Explorer (certaines icônes resteront visible car elles sont au format SVG), mais pour Safari ce sera un peu plus compliqué, mais faisons simple :

  • Safari sous macOS 10.x = pas de gestion du WebP. Utilisez un autre navigateur (Chrome, Edge, Firefox, etc...)
  • Safari sous macOS 11 et plus récent : C'est bon mangez-en, le WebP est géré 🙂

Vous êtes sous iOS ? C'est à peu près la même histoire, les terminaux encore sous iOS 13.x ne gèrent pas le WebP.

5 1 vote
Note de l'article
Subscribe
Me notifier des
guest

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

0 Commentaires
Inline Feedbacks
Voir tous les commentaires