Le mode inversé, quand accessibilité devient fonctionnalité

Je suis toujours étonné que personne ne connaisse cette option d’accessibilité sur iOS et macOS. Je suis d’ailleurs assez impressionné à quel point l’accessibilité est prise en compte chez les systèmes Apple.

Notez que, bien qu’ayant des lunettes avec une correction assez forte, je n’ai pas de trouble visuel ni de pathologie médicale nécessitant un équipement ou des interfaces spécialisées. C’est juste que tout ce blanc me crame les yeux pour rien.

L’utilisation du mode « couleurs inversées » est d’ailleurs un confort qui m’a fait revenir à iOS après un passage (très) rapide sur Android. Et j’écris cet article dans le train en mode inversé (ctrl+alt+cmd+8, aucune idée si c’est activé par défaut ou non).

Apple MacOS en mode inversé

J’utilise ce mode principalement sur mon iPhone, en l’ayant activé en triple tap sur le bouton principal. Et c’est génial. Je m’en sers absolument tout le temps, que ce soit pour éviter de me péter les yeux (dans le canap le soir, dans le lit le soir ou au réveil, …) , mais aussi pour ne pas déranger autour de moi dans un endroit peu éclairé (meetup, conférence, train, passager en voiture).

Alors je vous vois venir : certaines applications intègre un mode nuit/sombre. Et c’est vrai, Twitter, Waze ou le mode liseuse de Safari font ça plutôt bien. Mais pas la plus grosse partie des applications. Et c’est là qu’est le gros intérêt de ce mode: il est global. Et c’est absolument toutes les applications qui se retrouvent en mode inversées. Le fait de pouvoir l’activer ou non rapidement en 3 taps rend cette option super adaptive au contenu affiché à l’écran.

Voici plusieurs exemples d’application. J’ai pris le téléphone en photo vu que ce n’est « que » l’affichage qui est inversé, et donc une capture d’écran reste dans le mode « normal », non inversé.

Apple iOS Calendar en mode inversé

Apple iOS Mail en mode inversé

Apple iOS Notes en mode inversé

Apple iOS Safari en mode inversé

Apple iOS AirBNB en mode inversé

Apple iOS Google Music en mode inversé

Sur du texte ou des menus, c’est vraiment très reposant. En revanche, lorsqu’il y a beaucoup d’images, les couleurs inversées détériore complètement le contenu. Autant dire que mieux vaut éviter sur Instagram ou YouTube…

Apple iOS Twitter en mode inversé

A noter que ces photos ont été faites en aout 2017, sous iOS 10. Quelques semaines plus tard avec la sortie d’ iOS 11, j’ai noté des comportements très bizarre. L’écran de veille et le principal avec les icônes ne s’inverse plus. Dans Twitter, les images ne s’inversent plus, mais les emoticones oui. En prenant une capture d’écran, les images sont inversées. J’en conclu que c’est donc détectable côté appli mais sans plus d’info.

Apple iOS Twitter en mode inversé

Styliser un element select uniquement avec CSS

Pour ceux qui n’ont pas encore totalement vendu leur âme à Bootstrap pour styliser un bouton, l’element select reste un de ceux qui pose le plus de problème.

Voici ma petite technique permettant de le styliser comme vous le voulez, tout en gardant la petite flèche vers le bas qui indique à l’utilisateur que ce n’est pas un bouton mais bien une liste déroulante.

Voici l’exemple :

Continue reading

Me and my shadow

Probably some dusty remains from my dark Flash dev past, i’ve always love small little online games. Huge big 3D games are ok on the XBOX but to my heart, 2D will always win! Probably because i’ve been a 2D games kid back in the 80’s: Sonic, Alex Kid, Kyrandia, Monkey Island, … oh my oh my 🙂

Yet again, i found a very nice and smart little yet-another-HTML5-game-framework-demo game on which i waste procrastinate spent an hour and loved it! Hope you’ll love it too

Me and my shadow

Posted in Uncategorized

Emails Responsive : viewport ou pas viewport?

Depuis bientôt un an, les emails, et donc les newsletters, sont plus souvent ouverts depuis une tablette ou un smartphone que depuis un ordinateur de bureau. Alors oui, cela varie selon l’annonceur ou la segmentation mais globalement, c’est le cas. Côté intégration HTML, on me pose (très très) souvent la même question: viewport ou pas viewport ?! Voila de quoi répondre…

Continue reading

Posted in Uncategorized