Je suis allé récemment aux PB. L’occasion de constater si le réseau de recharge pour EV est meilleur qu’en France ou non.

Résultat, pour la ville d’Arnhem où j’étais et la ville de Clermont-Ferrand qui est la grande ville la plus proche de chez moi, les deux faisant grosso-modo la même taille (environ 150 000 hab) :

Carte réseau de charge PB versus France.
Le niveau de zoom est identique, tout comme les filtres appliqués (je n’ai mis que les bornes Type2 et prise domestique), et à chaque fois c’est grosso-modo ce qui correspond au centre-ville. Mais si l’envie vous prend d’aller voir, vous constaterez que c’est pareil dans tous les quartiers, même si là-bas les villes ne sont pas construites pareil (on a plutôt des pâtés de maisons avec chacun leur mini centre de commerces entourés de logements, au lieu d’avoir un seul hypercentre et uniquement des logements autour).

On notera que le nombre de bornes en panne est identique dans les deux cas : 3. Sauf qu’à Clermont, cela correspond à la moitié des bornes, alors qu’à Arnhem ce nombre est imperceptible dans la masse.

Et c’est loin d’être un cas isolé. Voici un autre exemple, avec Lyon (1,6 Mhab) et Utrecht (0,4 Mhab), et le constat est identique :

Carte réseau de charge PB versus France (2).

Et c’est pareil partout.

Alors, est-ce que c’est parce que les gens achètent des EV que l’on installe des bornes, ou inversement ? Je ne sais pas. Car oui, il y a beaucoup d’EV là-bas, mais encore plus d’hybrides.
Est-ce que c’est parce que même avec une Zoé, on peut traverser le pays tout entier sur une seule charge ? Je pense, oui. Mais ça n’explique, ni n’excuse, pas tout.

Je pense surtout qu’en France personne n’a réellement la volonté ni la motivation de se bouger le cul à changer les choses. Du coup, ça évolue bien trop lentement.

Et c’est la même chose pour les arbres, les points d’eau, les micro-espaces verts, et surtout aussi les pistes cyclables et les trottoirs. Exemple tout con : au lieu d’avoir une route au centre, une bande stationnable et un trottoir de chaque côté, ils font du 2×1 voie séparées par un terre-plein, le stationnement au centre et les piétons ont de l’espace :

Rue aux PB
Pourquoi on n’y a pas pensé ?
Pourquoi on ne fait pas ça ici ?

J’entends souvent l’excuse du « ouais, mais on va pas raser Paris pour reconstruire des pistes cyclables ». Non, c’est sûr, et rassurez-vous : on n’a pas rasé Amsterdam non plus. On l’a juste rendu piéton (pratiquement, hormis quelques axes), et adapté les habitudes.

On a les maires et les élus qu’on mérite, et donc les projets d’urbanisations qui vont avec. Mais je pense que si on veut faire bouger les choses, quel que soit le sujet et dans n’importe quel sens, il faut à un moment donné prendre la responsabilité de foutre un gros coup de pied dans la fourmilière, quitte à se faire détester au début. Mais avec le temps, je pense que l’on pourra se rendre compte que c’est vraiment pour le mieux.

Haussman avait fait quelque chose de grand, il y a 150 ans, à Paris, et cela s’accordait avec les temps d’alors. Je pense qu’on n’arrivera à rien sans un esprit similaire, adapté à la société moderne et à l’avenir, au moins pour les nouvelles constructions.

Pourquoi les écoles sont en centre-ville et pas entre les immeubles d’habitation ?
Pourquoi les parkings n’entourent pas les villes en gardant le centre piéton et cyclable ?
Pourquoi les espaces verts sont l’exception et pas la règle ?

Par exemple, voilà à quoi une ville peut ressembler quand on y pense à faire les choses correctement plutôt que de faire comme on fait depuis des siècles :

i
i
Oui c’est dans la ville ça. C’est un quartier résidentiel, mais l’école est juste à côté (pas visible) et deux rues plus loin y a les petits commerces et commodités. Le centre-ville historique (piéton) est à environ 5 minutes en voiture ou en bus. Je rappelle que c’est la 10ᵉ ville du pays, et les proportions sont environ celles de Clermont, Nîmes, Rennes ou même Metz.
Or, hormis un parc ou deux et quelques places bétonnées, il n’y a pas réellement de tels espaces dans ces villes.

Ces espaces verts ici sont au pied des maisons et au bord de l’eau. Les routes, pour les voitures, elles, sont de l’autre côté des maisons. Ce qui fait qu’il y a un sorti d’énorme espace verduré impossible d’accès aux voitures, donc hyper calme, avec des canaux.
Ça sépare bien les choses et permet aux piétons d’éviter les voitures (et inversement), plutôt que d’avoir tout mélangé et de demander aux voitures, vélos et poussettes de cohabiter (chose qui n’arrivera jamais car c’est juste pas possible).

Et ceci est loin d’être un exemple isolé : pratiquement toutes les constructions de moins de 50 ans sont faites sur ce schéma, qui n’a rien d’une règle absolue, mais dont on retrouve les grandes lignes de façon systématique.

Bref, je tiens à la vie en France : le cours de la vie est différent, moins stressante, tout ça. Mais niveau architecture urbaine, je continue de penser que la France a bien 200 ans de retard. Les constructions récentes ressemblent aux villes anciennes et rien n’est pensé ni au présent, ni à l’avenir.

C’est dommage.

C’est quelque chose qui manque.

ING ferme sa filiale française et les clients sont invités à changer de banque. Ils ont fait un partenariat avec Boursorama, qui ont à quelque chose près les mêmes solutions bancaires.

Ce partenariat inclut également une procédure simplifiée pour migrer d’une banque à l’autre.

Je viens de recevoir le courrier d’ING m’indiquant la marche à suivre. Je dois dire que la procédure est très simple à faire : tout est déjà prérempli et y a pratiquement plus qu’à choisir le type de compte qu’on voudra chez Boursorama et de signer (électroniquement) les documents.

En plus, l’ouverture du compte donne une prime (80 €), l’activation de la mobilité bancaire donne une prime (50 €), et l’ouverture d’un livret A chez Boursorama donne une prime aussi (30 €), ou le LDD (30 €) et un paquet d’autres trucs comme les comptes épargnes ou bourse. Pas mal.

Par contre, le site de Boursorama est un véritable foutoir. Je pensais qu’on avait dépassé l’époque des sites surchargés de boutons, de liens et d’encarts, mais faut croire que non (ou alors ING, Twitter ou Google m’ont habitués à des outils simples et clairs).

Voilà pour vous donner une idée, des captures d’écran des espaces clients chez ING :

i
Ce n’est pas parfait, mais c’est clair.
Il y a l’essentiel, les éléments sont clairements distingués, et à peu près organisés correctement.

Les liens et les autres fonctions sont planqués dans des menus ou en bas de page. C’est ce qu’il faut, c’est à ça que ça sert.

Maintenant la page des comptes chez Boursorama :

i
C’est totalement surchargé. Certains éléments sont redondants et d’autres sont secondaires :

  • Mon solde global est affiché 3 fois au total, en plus des soldes pour chaque compte.
  • Il y a deux champs de recherche
  • À quoi sert la petite maison en haut à gauche ? À aller sur le site de boursorama ? Ok, mais alors à quoi sert le logo de Boursorama ?
  • C’est quoi la différence entre « Produits » et « Mes services » ?
  • Y a deux fois la gestion du découvert.
  • Y a deux fois « mes mouvements à venir ».
  • Y a deux éléments d’aide (un dans le menu en haut, et un tchatbot en bas)
  • Pourquoi le « info service client » est sur la page principale ? C’est pas dans les notifications, ça, normalement ?
  • Même remarque pour « mes dossiers en cours ».
  • le champ de recherche des opérations est trop compliqué. Laissez juste un champ et un bouton « + de critères ».
  • Pourquoi y a un bouton « ajouter un compte externe » ? Qui fait ça à chaque fois qu’il se connecte ? Cachez ça dans les menus !

Pour vous donner une idée, voilà l’interface nettoyée, à ma façon :

i
Vous voyez la différence ?

Le menu en haut est plus clair :

  • J’ai unifié « Mes services » et « Produits » en « Mes produits ».
  • J’ai viré le lien de parrainage. Ce lien devrait être dans le menu associé au compte (tout en haut à droite)
  • Le champ de recherche est inutile : un lien, un fonction du site doit être dans les menus. Sur la page « mes comptes », on recherche essentiellement des opérations bancaires, donc le champ de recherche des opérations suffit.
  • Le lien « bourse est actu » n’a rien à faire dans un espace client. Il doit être sur le site de la banque, ou bien dans le footer.
  • L’icône dans « aide est contact est supprimé. Il charge inutilement l’interface. Le bouton est écrit en toutes lettres, ça suffit.

L’affichage des différents avoirs est bien plus clair :

  • au centre, le montant du compte sélectionné. C’est central, c’est LE truc qu’on vient voir sur son espace client. Ça doit être la première chose que l’on voit.
  • le montant du découvert autorisé est supprimé : il est toujours le même, et doit être visible dans les paramètres du compte, pas du premier coup d’œil.
  • à gauche, le montant total des avoirs (tous les comptes confondus). C’est le second truc qu’on peut avoir envie de voir.
  • aussi, voyez la hiérarchie : ce cadre est titré et tout en haut.
  • juste en dessous, la liste des comptes.
  • ensuite, je conserve le bouton pour ajouter un compte.
  • enfin, je conserve une vue sur les dossiers en cours, mais j’aurais pu le cacher.

Notez que j’ai aussi changé le « boursorama banque » dans la liste des comptes par le numéro de compte.

Au centre, la liste des opérations avec une barre de recherche simplifiée :

  • j’ai viré les champs de date. Ceci doit être mis dans « + de critères ».
  • en contrepartie, le champ de recherche est plus large et plus visible, tout comme le bouton « rechercher ».

J’ai aussi viré le « mes mouvements à venir ». La liste des mouvements à venir est effectivement affiché juste au-dessus.
J’ai en revanche ajouté un lien « Mes moyens de paiement ». Cela comprend alors la gestion de la carte, du chéquier, du RIB, bref, toute la barre des gros boutons ronds sur la droite.

J’ai viré le bouton « votre avis » (dont je vais peut-être me servir pour leur envoyer ma capture d’écran) : ceci doit être envoyé dans les notifs avec 1 ou 2 mois d’utilisation, pas le jour même de l’ouverture du compte !

J’ai viré le tchatbot aussi. Arrêtez avec ça, tout le monde, c’est d’une débilité sans nom et ça n’a jamais aidé personne.

On pourrait aller encore un peu plus loin dans la simplification de l’affichage, mais je pense que c’est déjà pas mal. Je vais en tout cas déjà leur soumettre ça (sans grande illusion).

Un mandiant.
Le problème :

Valérie déclare un patrimoine de 9,7 millions d’euros.
Elle décide, comme une grande, de dépenser 5 millions d’euros pour une campagne à la présidentielle, en espérant que la république le lui rembourse si elle fait un score suffisant.

Malheureusement pour Valérie, ça ne sera pas le cas.

Question 1.
Connaissant son patrimoine de départ, et sa dépense, combien lui reste-t-il en patrimoine ?

Question 2.
Si ce dernier est négatif, Valérie est endettée.
Au vu de la réponse à la question précédente, est-ce que Valérie est endettée ?

Question 3.
Sachant que le salaire minimum en France (le Smic) horaire est de 8,37 € net, combien d’heures de travail au Smic peuvent rembourser les 5 M€ de dépenses de Valérie ?
Combien cela représente-t-il d’années de travail (une année travaillée valant 1 607 heures) ?

Question 4.
Le patrimoine restant à Valérie est 9,7−5,0 = 4,7 M€.
Combien d’années de Smic cela constitue-t-il ?

Question 5.
Plutôt que de se contenter de ces siècles de Smic (en équivalence), Valérie décide de demander aux Français qu’elle a déçu de lui donner tout cet argent.
Au vu de la réponse à la question 4, cela vous paraît-il justifié ?

Question 6.
Pensez-vous que si vous ou moi dépensions 50 % de notre propre patrimoine, les plus pauvres se cotiseraient pour nous pour rembourser ça si on le demandait ?
Votre réponse est-elle la même que dans le cas de Valérie ? Pourquoi ? Justifiez.

Questions bonus.

  • Le comportement de Valérie est-il surprenant de la part de la caste politique française ?
  • Qui sont réellement les assistés, dans ces conditions ?
  • Est-là éventuellement une des raisons qui fait que plus personne ne peut blairer ces gens-là ?
  • Pensez-vous qu’il est normal que des individus qui ne se sont jamais levé à 06 h du matin pour aller à l’usine fassent l’aumône à ceux sur qui ils crachent à longueur de journée ?

(Les calculatrices non programmables sont autorisées.)

image d’en-tête de Tarek

Image de Lakitu, un personnage de Mario sur son nuage.
En discutant par e-mail suite à mon article sur l’iPhone, et vu le fait que chacun a ses propres usages d’un téléphone, mais aussi ses propres usages d’un service Cloud comme Google Drive ou iCloud, j’en suis venu à faire cet article.

Google Drive, iCloud, etc. c’est pratique :

  • ça fait des sauvegardes des fichiers
  • ça permet de partager des fichiers entre plusieurs personnes (dossiers partagées sur plusieurs comptes).
  • ça marche
  • … tout seul.

Ces deux derniers points sont essentiels. Tout le monde n’est pas capable de superviser, surveiller, maintenir, sécuriser ou mettre en place une solution décentralisée, libre, et tout le tralala linuxien habituel
.
La grande majorité des gens veulent appuyer sur un bouton et ne plus jamais avoir à y penser. Et c’est leur droit, et ils ont raison.

Par contre, je remarque que de plus en plus de monde, y compris des non-techniciens, non-geek, y voit aussi la limite habituelle des Gafam :

  • mes données chez eux ? est-ce bien sûr ?
  • et la vie privée ?
  • et s’ils ferment mon compte ?
  • et si je ne peux plus payer ?

Ces questions sont légitimes, et ce sont celles qui poussent les geeks à ne pas utiliser le cloud Gafam.

Pour ma part, j’ai fait le choix d’utiliser un système « cloud » mais sans Gafam, et ceci au moyen d’un Nas chez moi.

Un Nas ?

Un Nas c’est un disque réseau, généralement chez soi, connecté à votre box et accessible depuis tous les autres appareils chez vous (télé, téléphone, ordi, console…) ou même depuis Internet (car oui, vous pouvez accéder à votre box ou votre PC depuis l’extérieur, si c’est ce que vous voulez).

Les Nas grand public sont des boîtiers dans lequel on met un disque dur, et qu’on configure avec une interface web (dans votre navigateur) ou une application tierce (sur mobile). Tout est simplifié et ça marche comme iCloud ou Google Drive, sauf que les données sont chez vous.

Physiquement, chez vous : le disque dur se trouve dans votre salon.

On peut faire quoi avec ?

Les boîtiers Nas sont des mini-ordinateurs avec leur propre système. Selon leur tarif, ils sont plus ou moins puissants, plus ou moins rapides et on peut faire plus ou moins de trucs avec.

Tous proposent des interfaces simples d’accès aux fichiers : Web, FTP, multimédia, applications…

Avec les applications dédiées, on peut mettre en place une synchronisation de ses documents, y compris entre plusieurs appareils, plusieurs comptes. On peut aussi gérer des dossiers partagés ou réservés.

Certains Nas peuvent servir de plateforme multimédia (comme un disque dur multimédia), avec ou sans ré-encodage ou streaming. Ils ont une sortie HDMI et peuvent streamer sur votre télé ou votre vidéoprojecteur.

Les Nas étant des serveurs, si on le configure pour être accessible depuis l’extérieur, on peut s’en servir pour héberger bien plus que ses documents et photos. On peut y mettre son lecteur RSS, son serveur e-mail, son blog, son nom de domaine… Et tout ça chez soi.

Les plus férus n’ont pas besoin de Nas : ils peuvent transformer un ordinateur ou un vieux téléphone pour faire tout ça. Mais pour le grand public, un Nas vient avec tout ce qu’il faut pour faire tout ça le plus simplement possible, et out-of-the-box.

Quelles sont les limites d’un Nas ?

Il existe des Nas avec un seul disque dur dedans, mais aussi avec 2, 4, 6, 8, 12 disques durs. On peut alors augmenter autant qu’on veut l’espace disque disponible.

On peut aussi mettre plusieurs disques identiques et redondants. Dans ce cas, la perte d’un disque dur n’entraine pas la perte des données. C’est donc plus sécurisé qu’utiliser un disque dur externe unique.

Néanmoins, il ne faut pas tomber dans le piège : en cas de coupure de courant ou d’un orage, si le Nas grille, tous les disques sont dedans et peuvent griller en même temps, et vous perdez tout.

Ce n’est donc pas infaillible.

Un Nas, même avec X disques dedans, ce n’est toujours qu’une seule copie de vos fichiers. Une copie robuste, mais toujours qu’une seule copie.

Et une copie, c’est pas de copie.
Ce n’est pas de la sauvegarde.

Heureusement, il existe des solutions pour relier plusieurs Nas entre eux et les synchroniser entre eux. Si un Nas est chez vous et un autre ailleurs (chez vos parents, vos proches), alors vous ne perdez pas vos données s’il y a une panne, un cambriolage ou un incendie chez vous (ou chez eux).

Donc là aussi, des limites existent et sont réelles, mais des solutions sont proposées.

Est-ce que c’est rentable ?

À vous de voir : les Nas ne sont pas donnés, il s’agit d’un investissement. Il faut aussi se dire que vu que c’est chez vous, vous payez l’électricité aussi (20-30 euros par an pour un Nas) et la maintenance est à votre charge, si y a un disque qui grille par exemple.

Maintenant, vu que tout est chez vous, vos données y restent et ne sont pas soumis au règlement des Gafam et leur épée de Damoclès que constitue leur arbitraire.

De nombreuses personnes ont perdu leur vie numérique à cause de ça… Si le Gafam le décide, ils peuvent tout vous prendre du jour au lendemain et il n’y a pas de recours.

Rien n’empêche par contre d’utiliser un stockage chez vous et un stockage cloud chez un Gafam. Dans ce cas, on peut imaginer une copie chiffrée chez le Gafam.

À vous de voir ce que vaut 15 ans d’archives numériques personnelles à vos yeux. Perso j’ai fait mon choix.

Liens ?

Il existe plusieurs marques de Nas, les deux plus connus sont sûrement Synology et QNap.
Perso j’ai fait le choix de Qnap.

Ci-dessous quelques liens. Les liens Amazon sont affiliés :
Le Nas :

Le Nas étant vendu sans les disques durs, il faut les prendre à part. Idéalement, pour de bonnes performances et une bonne compatibilité, prenez deux disques durs identiques destinés au stockage longue durée. Référez-vous aussi au site du constructeur du nas pour prendre des disques compatibles. En cas de RAID1, prenez deux disques de même taille.

Mes disques durs sont :

Si vous prenez plusieurs Nas pour les mettre en réseau (entre chez vous et un autre lieu), prenez deux Nas compatibles (même marque) mais avec des disques différents : ça évitera d’avoir des disques identiques, et donc avec des pannes potentiellement similaires partout.

Enfin, pour accélérer les transferts en Wifi entre vos appareils et votre Nas, votre Box Internet doit être récente (Wifi AC conseillée pour faire du 50 Mo/s) et vos appareils également. Sinon c’est juste un peu lent (le Wifi N plafonne à 5-15 Mo/s).

image d’en-tête

Un kit de nettoyage.
Juste quelques solutions pour le ménage chez vous (oui j’ai envie de partager ça).

Eau + IPA

Pour la maison (ou les vitres intérieures de la voiture).
Faites un mélange 50/50 d’alcool isopropylique (IPA, ou isopropanol — trouvable ici) et d’eau déminéralisé, et nettoyez une vitre avec ça.

En voiture, j’ai horreur des traces sur les vitres, tout comme sur l’écran d’un ordi. Sur l’extérieur, c’est saleté et calcaire, mais à l’intérieur c’est des corps gras qui émanent des cuirs et des éléments en plastique. Dans la maison, le gras de la cuisine se colle également sur les vitres.
Pour ça, ce mélange 50/50 est radical.

Sur la vitre rapidement débarassée de la poussière avec de l’eau puis essuyée, vaporisez le mélange sur une microfibre (elle doit être juste humide, mais pas gouttant) puis essuyez la vitre. Utilisez ensuite une microfibre propre et neuf pour essuyer le surplus complètement.

Ça fonctionne aussi pour dégraisser la gazinière ou autre. Au besoin, rajoutez du bicarbonate de soude (ce dernier agit mécaniquement : il ne faut justement pas le dissoudre complètement).

Pour le calcaire

Sur la vitre arrière de ma voiture, qui est relativement peu inclinée dans mon cas, l’eau ruisselait pas et des traces de calcaire s’accumulaient et l’ensemble ressemblait plus à une vitre de salle de bain qu’autre chose. Ça en devenait suffisamment critique pour que je juge ça dangereux : à contre jour on ne voyait plus rien).

J’ai essayé absolument tous les remèdes grand-mère : vinaigre froid, vinaigre chaud, citron, antical, éponge magique, alcool, argile… mais rien n’y fit.
Juste avant de passer par un polissage professionnel, j’ai réussi à tout retirer avec ce produit.

Ça contient de l’acide sulfurique, c’est peut-être pour ça que ça marche. Sur une vitre lavée à l’eau puis séchée, étalez une fine couche de produit en frottant avec une microfibre, laissez agir 5-10 minutes, remuez un peu, puis lavez à l’eau. Séchez la vitre avec de l’IPA et enfin sur une microfibre propre et sèche. C’est radical.

En revanche, ça n’a rien fait pour ma salle de bain : j’ai beau avoir laissé agir une nuit, je crois que le calcaire fait partie de la vitre désormais. Peut-être de l’acide sulfurique pure fonctionnerait, mais je n’essayerais pas, c’est bien trop dangereux.

Du vinaigre chaud pour le tartre dans une bouilloire

Celle-là je la note aussi, mais j’en avais déjà parlé je crois : mettez 100 mL (1/2 verre) de vinaigre blanc dans la bouilloire et complétez d’eau du robinet (assez pour que toute la partie entartrée soit immergée).
Faites ensuite bouillir l’ensemble. Ça devrait détartrer tout l’appareil du premier coup. Jetez le produit chaud dans l’évier (ça détartrera l’éviter en même temps) puis rincez 2 ou 3 fois la bouilloire.

Si les vapeurs du vinaigre vous importunent, vous pouvez faire ça dehors.

La javel pour les boules à thé

Si vous avez des boules à thé en ferraille, le gris laisse peu à peu place au marron. Ce n’est pas dangereux, mais c’est pas joli.
Pour ça, mettez vos boules à thé dans un verre ou un saladier. Ajoutez 100 mL de javel pure puis ajoutez de l’eau froide jusqu’à inonder complètement les boules à thé. Mélangez pour que la javel ne soit pas juste au fond. N’utilisez pas d’eau chaude : ça décompose l’hypochlorite de sodium de la javel et en retire toutes les propriétés nettoyantes et bactéricides (en plus de dégager du chlore).

Laissez agit 15 à 30 minutes en remuant une fois entre-temps.
Elles seront comme neuves à la fin. Rincez bien : le mieux est de les laisser dans l’eau claire pendant une heure puis rincer de nouveau une dernière fois.

Par contre ne faites pas ça dans votre théière en porcelaine ou en céramique. Premièrement, il est normal qu’une théière s’imprègne du thé au fil des années. Et deuxièmement, la Javel risquerait de l’attaquer et de rester dans les pores, ce qui n’est pas l’idéal.

image d’en-tête de alabama extension

Safari sur iOS (et sur Mac) n’utilisent pas Blink, mais Webkit. Apple est parti de son côté avec Webkit et du coup fait un peu n’importe quoi. Ayant désormais un iPhone, je me retrouve à corriger mes sites et outils pour iOS.

Voici quelques trucs et astuces. Cet article sera emmené à être étendu avec le temps.

Zoom lors du tap sur un champ texte

Safari nous zoom la page quand on tape sur un champ texte. Ça part d’une bonne intention, mais premièrement ça déforme la page, et ensuite, quand on sort du champ texte, ça ne dézoome pas. C’est stupide.

La solution qui marche, sans toutefois interdire le zoom à l’utilisateur (ça c’est très important), c’est mettre ce HTML dans votre <head> :

<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=yes"/>

La magie vient du « maximum-scale ». Notez bien qu’il s’agit de l’échelle automatique. Le user-scalable="yes" assure que le zoom à deux doigts reste possible. Si vous mettez « user-scalable="no" », je n’aurais que deux mots : au bûcher !!

Le :hover sur iOS

Sur Vivaldi comme Firefox mobile (android), le :hover est activé lors du tap. Sur iOS il n’en est rien (enfin pas toujours). Ça se résout en ajoutant l’attribut « onclick » sur l’élément. Juste l’attribut, pas de valeur. iOS considère en effet que si l’on click, le hover s’active. Ici on clique, ça n’a pas d’effet directement, mais ça déclenche tout de même le hover.

Alternativement, et en mieux, on peut mettre dans son JS :

document.addEventListener("click", function() { });

Ce qui rend la correction plus rapide que d’ajouter onclick="" partout dans la page.

Certains parlent de mettre un « cursor: pointer » en CSS. Ça aurait été tout à fait pertinent que iOS active le :hover sur un élément dont le curseur est un pointeur (la petite main qui clique), mais malheureusement cette solution ne semble pas fonctionner.

Pour le parsage des dates en JS

La plupart des navigateurs, en JS, quand on leur donne un texte représentatif d’une date, essayent de parser ça comme ils peuvent. C’est censé marcher même quand on leur donne une date en langage naturel, comme « vendredi 4 mars 2022 », qu’ils traduiront en le bon objet de date.

Perso j’utilisais une chaîne de date-heure égale à « 2022-03-04 18:30:59 ». Firefox et Chrome n’ont pas de problèmes pour parser ça. Safari exige qu’on mette un « T » entre la date et l’heure : « 2022-03-04T18:30:59 », sinon il renvoie une erreur.

Safari a raison : le T pour « time » provient de l’ISO 8601 étendue et il faudrait l’inclure tout le temps.
Ceci est donc un rappel que ce n’est pas parce que ça marche sans le T que c’est une bonne pratique.

Placeholder sur [type=date]

Si vous avez un input de type date sans placeholder, alors Firefox et Chrome (blink) mettront une date vide : « jj / mm / aaaa ».

Safari (sur Mac) mettra la date du jour… mais en placeholder, donnant l’illusion que la date est remplie, alors que ce n’est pas le cas. Vérifiez bien que ça soit effectivement le cas dans vos app.

Étrangement, sur iOS, je n’ai pas ce souci, mais il est bien réel sur certaines versions de Safari sur Mac que j’ai pu voir (pas pu regarder plus en détail, désolé).

Les événements load, beforeunload, unload

Ces événements sont dépréciés sur iOS, et ne sont pas forcément fiables ailleurs. En effet, le comportement des utilisateurs sur mobile est de changer d’appli ou d’onglet sans fermer la page, donc sans « unload ». Le problème se pose aussi sur Android, même sur iOS, ces fonctions ne semblent plus fonctionner du tout, ce qui pose effectivement problème dans le cas où l’on ferme l’onglet en cours.

À la place, il est préférable d’utiliser l’événement « visibilitychange » (qui se lance quand on change d’application ou d’onglet) et « pagehide », qui est lancée à la fois quand on change la visibilité de l’onglet et juste avant qu’on le ferme. Dans les faits, pensez à utiliser les deux car le premier agit sur mobile et le second sur desktop. De plus, un bug sur Webkit fait que le « pageHide » n’est pas déclenché quand on change de page lors qu’on clique sur un lien dans celui-ci.

Plus d’information ici (avec un tableau de compatibilité). Et voyez sur les événements supportés par iOS.

Enfin, il en va de même pour l’événement « load », qu’il faudrait remplacer par « pageshow ».

Comment dire que ton client e-mail est pourri sans dire que ton client mail est pourri :

Message d’erreur Outlook.
Ça rejoint mon coup de gueule contre GMail il y a des années

Je veux envoyer des fichiers par mail, oui. C’est visiblement un crime, chez Microsoft comme chez Google.

Depuis quand c’est à moi de faire attention à ce que les gens reçoivent ? D’autant plus quand ils demandent à le recevoir ?

Si t’es pas content, tu mets une alerte de leur côté. Une fois que j’ai envoyé mon mail, ce n’est plus mon problème : ils n’ont qu’à configurer leur client e-mail correctement ou changer de service e-mail. Chacun son boulot.

Oui j’aimerais que les jeunes soient formés au numérique et pas déformés au Microsoft. On exige par la loi des gens qu’ils configurent leur Box internet pour empêcher les intrusions et de surveiller l’usage qui en est fait (OpenOffice pourra vous aider), mais en même temps on sait très bien que la majorité des gens en est incapable, au vu de ce genre de messages.

Mais bon, continuez à transformer ce protocole d’échange électronique ouvert et interopérable qui tient et fonctionne depuis 50 ans en un tchat immonde et fermé pour cadre commerco-bullshito-powerpoint.

Bah.

Photo d’un bulletin placé dans une urne.
Je crois que j’ai un problème de candidats à la présidentielle.

Aucun ne me convient parfaitement.

Ah. Je crois ne pas avoir été assez clair. Laissez-moi répéter en insistant sur le mot important : aucun ne me convient parfaitement.

Ça veut dire quoi ?

Il y a bien une dizaine de candidats, à droite, à gauche, au centre, en haut, en bas… bref de tous les bords.
Parallèlement, il y a également tout un tas d’enjeux et de sujets divers qu’ils traitent tous plus ou moins à longueur de journée : emploi, économie, impôts, écologie, énergie, santé, éducation, immigration, politique extérieure… vous les connaissez.

C’est quoi le problème ?

Le problème c’est que tous les candidats ont des bonnes idées. Tous les candidats ont aussi des mauvaises idées.
C’est ça mon problème : en votant pour quelqu’un, on ne peut pas garder juste le bon. On doit garder le mauvais aussi.

Dans ces conditions, choisir un candidat revient à choisir non pas le meilleur des candidats, mais sur le moins mauvais. Pas sur celui qui nous correspond, mais sur celui avec le moins de mauvaises idées.

Je pense qu’il y a un paquet de gens qui sont dans cette situation, qui vont soit voter « utile », soit pas voter, soit voter blanc, soit voter nul, soit voter en espérant une améliorant dans un des enjeux tout en sachant que ça plombera tous les autres, etc.

C’est le problème de cette méthode de représentation des citoyens appelé « élections présidentielles » : un vote pour un gus dont on sait pertinemment qu’il n’est pas parfait et qu’il fera de la merde sur certains trucs, en espérant qu’il fera des trucs un peu moins pourris sur d’autres, sans garanties.

Alors pourquoi on vote pour un gus ? Pourquoi on ne peut pas voter pour des idées ? Sur des enjeux en particulier ?

Perso ça me fait une belle jambe de savoir que tel ou telle personne dirige le pays parce qu’on l’aura élu. Je préférerais largement qu’ils fassent des référendums tous les 3 mois à la place, pour discuter d’un sujet, et pas d’une personne.

image de Element5 Digital

En achetant mon récent téléphone, le vendeur (à la Fnac) m’a souscrit à une assurance smartphone, avec les 30 premiers jours gratuits (perso je n’avais rien demandé), je me suis retrouvé avec ça à la fin de la commande. Je trouvais étrange aussi qu’il prenne 15 minutes à consulter ses stocks. M’enfin.

J’ai déjà dit ce que je pensais de ces assurances spécifiques pour téléphones, électroniques ou autre.

Ici j’avais donc une assurance pour 300 € par an (!) et moults garanties. Donc j’ai demandé à résilier ça.

Bah c’est la merde :

Résilier un truc : expectation VS réalité.

Leurs CGU permettent de résilier ça facilement, gratuitement et sans raison durant les 30 premiers jours : un coup de fil, et hop. Ou un courrier simple avec un formulaire joint… que je n’ai pas reçu.

Va pour le coup de fil…

Donc 3j après l’achat, j’appelle. Après 10 minutes d’attente, je suis en ligne avec quelqu’un.

Je donne mon nom, ma référence dossier et je dis « j’aimerais résilier cette assurance ».

Là la personne commence à me demander pourquoi. Je lui dit que je n’ai pas de raison à avoir (dixit les CGU, article 6.2) et je répète machinalement que « j’aimerais résilier ».

Là la personne commence à m’inventer un scénario catastrophe au cours duquel mon téléphone subit des dommages et où l’assurance, dans son infinie bonté arrive à la rescousse*

[*] suggestion de présentation.

Je n’ai pas laissé le temps à la personne de finir son baratin. Je lui ait dit « Excusez-moi de vous interrompre, mais je souhaite juste ré-si-lier, maintenant et sans histoires. ».

J’ajoute que « cela fait trois que je le dis clairement, si je dois le redire une fois de plus je raccroche et vais voir un avocat et il vous fera une lettre puis une mise en demeure. ».

La personne me dit « inutile d’en arriver là, on va résilier ».
Moi : « bien. »
d’autres questions ?
c’est résilié ?
je suis en train de le faire.
– …
c’est fait. Vous recevrez un mail de confirmation d’ici 48 h.
Bien. Merci. Bonne journée.

Je ne me suis pas énervé, j’ai juste été ferme et clair. Aussi j’ai horreur qu’on me prenne pour un demeuré. Si j’appelle pour résilier, c’est pas pour ne pas résilier.

Du coup, il me restait à attendre l’e-mail de confirmation.

Ni 48h ni maintenant (on est 15 jours après), je n’ai reçu quoi que ce soit.
Et non, pas non plus dans les spam.

Du coup, je vais sur leur site et leur formulaire de contact. J’envoie un message. Le site bug, je le renvoie. Pas de réponse.

Quelques jours après, j’envoie un mail à l’adresse trouvé dans l’e-mail de bienvenu.

Je reçois un mail automatique me disant que la demande a été envoyée au broyeur reçue. Mais je n’ai pas eu de suite même après quelques jours.

Le mardi suivant (on est à J+15 après l’achat) j’envoie une LRAR avec une lettre où j’indique vouloir résilier. J’indique clairement ma demande et ses références dossiers. J’ajoute aussi que ça fait suite à mes précédentes tentatives, et j’enfonce le clou en disant que si je me fais prélever une quelconque somme de leur part (signe que la résiliation n’a pas été prise en compte), j’engagerai des poursuites.

Une semaine après (aujourd’hui) je reçois un SMS disant qu’ils ont reçu la demande (laquelle, je ne sais pas : email, courrier, tél ?) et qu’elle sera effective sous 12 jours.

12 jours à parti d’aujourd’hui, c’est à J+31 à partir de l’achat.
1 jour après la fin des 30 jours gratuits, donc.

Rien à foutre : ils me prélèvent un centime, je dépose une plainte jusqu’à ce que me soient remboursés ça.

Oui ça m’énerve. Oui je suis en colère.
Ces pratiques sont honteuses, pour ne pas dire douteuses.

Je hais, de base, ce genre de paperasse. Je déteste aussi les assureurs, qui ne servent à rien jusqu’au jour où on a besoin d’eux : là, ils t’envoient chier avec cordialité. Et avec ton pognon. Et je hais tout ce bordel en plus quand on n’a rien demandé.

Mise à jour du 2022-02-08, soit 3 semaines après mon mail : j’ai eu la réponse et leur confirmation (écrite) que ma résiliation est désormais prise en compte. Bien. Je rappelle que je devais, 48 heures après mon appel, recevoir une confirmation par e-mail de la résiliation. Si je l’avais eu, je n’aurais pas eu besoin de faire un mail suivi d’une LRAR, ni cet article. Souvenez-vous : les paroles s’envolent, les écrits restent. Si ce n’est pas écrit, c’est que ça n’a pas eu lieu. D’où mon obstination absolue à exiger un mail, un courrier, ou un accusé de réception, et ne pas me contenter d’un « oui-oui » au téléphone.


Ne vous faites pas avoir : à moins que ce soit vraiment votre intention (libre à vous de jeter du fric par la fenêtre), NE SOUSCRIVEZ PAS CES TRUCS LÀ : c’est la galère pour en sortir et ils vous feront chier jusqu’au bout.

Et maintenant, quand on achète un truc, il faut aussi déclarer NE PAS vouloir d’assurances et de services à la con ? Bah.

Quant à l’assurance en question, « Celside », filiale de la « SFAM », il suffit de chercher sur Google et voir les différentes mentions sur les forums comme UFC Que choisir pour se rendre compte que c’est du gros n’importe quoi, et que — comme toutes les assurances, y compris l’assurance chômage — ce sont des […nom d’oiseau ici…].

Voilà.


Dans mon cas, on verra ce qui se passe. En attendant, j’ai mes relevés téléphoniques indiquant la date de l’appel, les différents mails envoyés et la note de bonne réception de leur part, ainsi que l’accusé de réception du LRAR, et le courrier envoyé.

La LRAR étant la seule preuve légale, les autres papiers serviront éventuellement pour la bonne foi.

Si vous vous faites avoir : ne perdez pas de temps avec le téléphone et les e-mail. Foncez à la poste avec un modèle de lettre et envoyez ça en LRAR. Y a effectivement que ça qui fonctionne. Et qui soit légal aussi.

Leur formulaire a beau dire « résiliez par courrier », j’imagine qu’ils font ça pour qu’on envoie un courrier simple qu’ils déclareront ne jamais avoir reçu une fois les 30 jours écoulés et les premiers prélèvements effectués (et après, pour résilier, c’est encore plus chiant, et probablement pas gratuit).

Oui je vois le mal partout.
En même temps on parle des assureurs.


Inutile de dire que je ne serais plus jamais client à la Fnac pour quoi que ce soit. Ici, c’était dans une boutique physique, mais ça vaut aussi pour en ligne.

Ça rejoindra Cdiscount, Priceminister et tous les autres groupes qui prennent leurs clients pour des cons.

Étrangement, tous sont des groupes Français.

Amazon ?
Jamais eu une seule prise de tête avec : les problèmes de colis cassés ont été résolus dans l’heure les deux ou trois fois que c’est arrivé en 10 ans.

Achetez français, qu’ils disent.
Allez vous faire foutre, que je réponds.

Photo d’un ail et d’un vieux téléphone : ail-phone.
Je suis passé sous iPhone.

En effet, un publicitaire m’a offert un iPhone 13 Pro Maxi-choco XL+ S V8 42 light+X GTR Bio sans gluten 8G AK47 double-cheese C++ RATP pour que j’en vante les mérites sur mon blog devant des millions milliers douze lecteurs quotidiens mensuels !

Les trolls vous arrêtez de lire ici.
Les autres aussi, si vous voulez.

Pour l’unique lecteur qui reste désormais, s’il arrêtait de ronfler au fond de la pièce, il pourrait voir ici pourquoi moi, un utilisateur plutôt « power-user » a décidé de passer d’un Android ouvert à un iOS fermé (ainsi qu’un avis sur l’iPhone).

Et non, je n’ai évidemment pas reçu cet iPhone de façon promotionnel, pas que je n’aurais pas pu le faire, et plusieurs fois par an, vu tout ce que les annonceurs me proposent et que je refuse pour vous tous toi.

Pourquoi changer de téléphone ?

Mon ancien téléphone avait 3 ans — déjà, mais aussi seulement — et même si je l’ai adoré, il commençait à avoir des problèmes logiciels (reboot intempestifs) et matériels (l’écran jouait du tactile tout seul et l’appareil photo prenait parfois des demi-photos).

Et quand on a déjà changé la batterie une fois, l’écran une fois (parce qu’on est manchot et qu’on casse l’écran en changeant la batterie), que le système n’est plus mis à jour parce que le constructeur a mis la clé sous la porte, qu’on me l’a fait tomber et que le dos a été pété aussi et ben si on veut continuer d’utiliser un smartphone à jour et fonctionnel sans se ruiner en réparations qui finiront par avoir été vaines, il faut en changer. L’obstination de tout réparer ça a ses limites aussi.

Pourquoi prendre un iPhone plutôt qu’autre chose ?

Comme d’hab, je suis assez méticuleux dans mes choix avec un cahier des charges long comme le bras. Cette fois j’étais bien embêté, parce que aucun téléphone ne me semblait convenable.

L’iPhone était hors concours jusqu’à ce que je me dise « et pourquoi pas ? ».

Comme ça :
Moi : « Et pourquoi pas ? »

Il y a 3 ans, un iPhone j’aurais dit non merci à cause de l’absence de Jack et de port SD. En plus c’est cher.

Aujourd’hui, j’ai changé mes usages.

J’écoute la musique autrement : le Jack Sparrow ne m’est pas utile.
La carte SD était principalement là pour étendre l’espace de stockage interne et pour sauver toutes les photos si le téléphone mourrait subitement. Un iPhone 13 de base, c’est 128 Go : le double de tout ce que j’ai besoin et les backup se font chez moi, en Wifi et tout seuls.

L’ouverture d’Android ? Bof. Elle est toute relative : où est mon accès à /etc, /sys, /usr, /bin d’un vrai système ouvert ? En plus, je n’en ai que peu eu besoin : je n’ai jamais installé de ROM custom, et mon dernier téléphone n’a même jamais été rooté non plus (AOSP de base avait tout le nécessaire).

Comme j’expliquais dans un autre article, je n’ai plus besoin d’une machine à bidouille. Maintenant, je veux un truc qui marche. Au besoin je saurais comment le dépanner, mais j’ai pas besoin de plus. Et puis, arrêter de bidouiller pour bidouiller, c’est aussi arrêter de rendre le système constamment instable, ce qui aide à ne plus avoir besoin de le réparer, en fait.

Pour ce qui est du passage d’Android à iOS, ça ne faisait pas partie de mes inquiétudes. Si je trouve les surcouches constructeurs Android bâclées et lourdes, iOS est propre et fluide. En plus, mes logiciels habituels sont disponibles indifféremment sur les deux OS. Pour mes achats sur Google Play, un petit mail au développeur suffit parfois pour avoir la version iOS sans avoir à repayer (coucou, et merci beaucoup, l’équipe d’OsmAnd).

Ensuite, l’omniprésence de Google dans Android y est de plus en plus malsaine. Je n’aime pas du tout. Idem pour celui des constructeurs. Je ne suis pas sûr que pour Apple ce soit réellement mieux, mais en tout cas, ce n’est pas pire. Android a donc fini par perdre cet argument là.

Un des deux gros points qui m’importaient c’est la taille du téléphone. Je constate que plus aucun constructeur de premier plan ne fait de téléphones haut de gamme (puissants et équipés, j’entends) qui ne soient pas des phablettes de 6, 7, ou 8 pouces destinées aux soit-disant « influenceurs ». Or je veux du 5", un truc à utiliser d’une main et qui tienne dans une poche, pas un pavé.

Enfin, l’autre gros point important pour moi concerne un point noir d’Android, à savoir le manque de sérieux global dans les mises à jour du système, y compris Android One et ses 3 petites années de mises à jour et qui tombe si le constructeur tombe aussi (coucou le regretté BQ, chez qui j’ai pris mes deux derniers téléphones).

Je suis donc emmerdé pour trouvé téléphone qui m’aille.

Mes critères, cette fois :

  • un téléphone puissant (je veux qu’il tourne encore dans 5 ans avec l’OS du moment)
  • des mises à jours et un support étendu dans le temps
  • 5 pouces max
  • à peu près futur proof (5G, OLED, vidéo fHD… Oui j’ai visé haut, tant qu’à faire)
  • une marque qui risque pas de tomber et pour lequel je pourrais avoir des pièces et de la réparation.
  • pas de surcouche dégueux

Avec ça, il ne reste pas grand monde. Quelques modèles anciens tout au plus, mais surtout, l’iPhone Mini. C’est donc le critère du prix qui a été mis de côté ici.

J’ai donc sorti mes liasses de billets reçus d’EDF et d’Orano pour vanter l’électronucléaire sur mon site ma carte bancaire et ma prime énergie mes chèques cadeau du boulot et j’ai pleuré fait le choix de l’iPhone 13 mini.

C’était ça ou le 12 Mini, le modèle précédent, mais le 13 avait des caractéristiques nettement plus attirantes, principalement au niveau de la batterie, pour un prix qui en valait selon moi le coup.

Ce téléphone compense tout les points listés plus haut :

  • il fait 5,4 pouces, pratiquement sans bords. Il est aussi grand que mon Samsung Galaxy Wifi 4" en 2011, le borderless en plus (donc un ration écran/face avant bien plus proche de 1)
  • Apple supporte actuellement jusqu’au iPhone SE sorti en 2016, donc 7-8 ans de support.
  • Le 13 Mini a la puissance du 13 normal, et il est ultra-fluide et rapide.
  • 5G, charge induction, OLED, Wifi AX, Glonass, BeiDou, four à pizza… tout y est.
  • Avant que Apple tombe ou arrête son département iPhone, je pense qu’on a de la marge. Par contre, on sait déjà que les formats « mini » c’est terminé. Ils se vendent mal car tout le monde le dernier influenceur à la con mode veut des phablettes.

Bref, tout ça c’était pour expliquer un peu ma problématique et finalement mon choix.

Ci dessous, une petites liste des trucs bien ou pas bien avec ce téléphone.

Les plus et les moins

Points négatifs

Le prix.
C’est le double du prix de mon téléphone précédent. Maintenant, s’il me dure le double de temps, ça revient au même. On verra. J’espère en tout cas.
J’ai pu en réduire le prix avec mes chèques cadeaux du boulot (dont je ne sais autrement jamais quoi faire, et je ne cache pas que sans ça, je n’aurais pas changé tout de suite), mais ça reste un objet cher.

iTunes
Ce logiciel est une merde, probablement encore plus sous Windows que sur Mac. Heureusement qu’EDF m’a gentiment offert un Mac. Mais c’est le seul moyen de transférer sa musique (50 Go) sur un iPhone, hormis tout racheter sur Apple Music depuis le téléphone.
Comme ça reste un truc à faire quelque fois par an seulement, pas tous les jours, ça ira.

Safari
Sur iOS, Apple interdit les autres navigateurs que Safari. Plus précisément, c’est le moteur de rendu qui est bloqué. On a donc bien des navigateurs comme Firefox ou Opera, mais ce ne sont que des Safari déguisés.
Or, le moteur de rendu de Safari (pas juste sur iOS) est en retard par rapport au reste et a ses particularités. Pour un webdév, Safari c’est un peu l’équivalent d’IE-6 à une époque sombre, très sombre : un mouton noir de couleur qui pose problème.
Safari n’a pas non plus de bloqueur de pub/popup aussi puissant que Vivaldi sur Android. Globalement faudra s’y faire et c’est pas la mort, mais c’est un point noir quand-même, pour moi.

Port Lightning.
J’ai toujours préféré le design du port Lightning au port USB-C. Le lightning est une broche plein et dure, alors que l’USB-C peut s’écraser et les broches sont fragiles. Même si je préfère lightning, j’ai quand-même dû refaire mon stock de câbles (le seul fourni est USB-C-Lightning).

AppStore
Pourquoi le champ de recherche de l’AppStore n’est pas mis en avant comme celui de Google Play ? Ici il est sur la dernière page, WTF ? Entre ça et le Google Play, ce dernier est mieux fait, je trouve.

L’encoche de l’appareil photo
Le fameux « notch » sur le haut de l’écran et totalement affreux, mais pas propre à ce téléphone. Le même sans appareil photo frontale m’irait tout aussi bien sinon mieux. Je ne prends que des photos de chats et ils n’ont encore jamais fait de selfies.

Des petits détails
Apple vante le multitouch, mais ne l’utilise lui-même pas partout. Par exemple, là où Android permet de pivoter une photo avec deux doigts qu’on fait pivoter, Apple Photo ne le permet pas. Il faut passer par un bouton « rotation », puis « tourner 90° ». C’est ubuesque.
Un autre exemple est le clavier : pas assez personnalisable. Et le fait d’appuyer longtemps sur une touche (E) pour afficher les diacritiques (ÉÈÊË) ne marche pas toujours (je suppute que je m’y prenne mal mais où…). Et la ligne des chiffres sur le clavier me manque également.
Un autre truc : dans le « drawer » des paramètres rapides (équivalent au menu du haut dans Android), les boutons Bluetooth et Wifi ne désactivent plus ces derniers. Ils nous déconnectent seulement, et ça se réactive après X temps. C’est totalement stupide. Pour les désactiver on peut et il faut aller dans les paramètres d’iOS. Mais le drawer ne sert plus à ça.

Points positifs

Logiciels désinstallables
De façon intéressante, la très grande majorité bloatwares Apple (notes, bourse, cartes, radio…) se désinstallent sans problème, là où sur Android elles sont seulement désactivées (et encore : on finit par les retrouver en tâches de fond !). On peut les remettre via l’AppStore si besoin.

Les logiciels de base
En dehors des apps qui ne me servent pas, celles que je garde (e-mail, photos, réveil…) sont globalement utilisables et neutres.
Sur Android, l’appli e-mail est GMail, orienté GMail. Sur iOS, c’est e-mail, orienté rien du tout et ça fonctionne partout. Je ne regrette donc pas K9-Mail, qui était déjà vraiment très bon sur Android.

Options désactivables
Apple Music, iCloud… tout ça est désactivable et et ça nous fout la paix. Wow.
Là où, dans Android, il y a toujours omni-présence du compte Google Play à chaque recoin dans les menus.

L’intégration
Toutes les app natives forment des greffons à un ensemble dont le cœur est iOS. Le système fonctionne très bien sans, mais les app ajoutent des fonctions accessibles depuis partout. L’appareil photo (qui intègre l’OCR en offline (!)) est activable dans n’importe quel champ de saisie.
Le partage de données d’une app à une autre est à un niveau que je ne connaissais pas sous Android. On peut même faire des drag-n-drop d’images, par exemple d’une page web à un e-mail ou vers le logiciel de prise de notes, puis joindre ça à un rendez-vous sur l’agenda et l’envoyer à un contact directement. Bref, c’est fluide et naturel. Me gusta.

Des petits détails
Beaucoup de petits détails sympa.

  • Un swipe tout en en bas de l’écran glisse tout l’écran vers le bas : pratique pour accéder au haut de l’écran en utilisant le téléphone d’une main.
  • Le double-tap au dos du téléphone pour réaliser des actions rapides (capture d’écran, verrouillage…). Probablement existant sur Android, mais jamais vu.
  • Comme tous les iPhones, ils y a un bouton physique pour mettre en silencieux. Autant dire que pour moi qui déteste téléphoner et a horreur des notifs, le bouton est toujours activé.

Points neutres

Carte SD
Comme expliqué plus haut, ce n’est plus un requis actuellement. Je fais régulièrement le ménage et des backup de mes photos et avec tous mes fichiers actuels, je suis à 50 % de l’usage des 128 Go du téléphone (iOS inclus).

iOS
Malgré une adaptation pour retrouver ses marques, je ne crains pas ce changement. J’ai connu iOS 3 et 4 il y a deux lustres (donc 10 ans), tout est encore au même endroit. Quant aux applications tierces, je les retrouve toutes.

Port jack
C’est dommage qu’il n’y soit pas, mais je m’en sers pas ; et de toute façon le téléphone est vendu avec des écouteurs lightning au cas où.

5G
J’ai la 5G dans la ville où je bosse. C’est cool, c’est très rapide (mes cartes OSMand sont téléchargées en quelques minutes) mais la 4G/4G+ m’aurait suffit sur un téléphone. À un certain niveau de vitesse de téléchargement, je me dis que ça ne sert à rien d’avoir plus. En tout cas sans les usages qui vont avec, et qui ne sont pas les miens. La 5G rend néanmoins le téléphone future-proof. Donc pourquoi pas.

Siri
Je ne me suis jamais servis de OK Google, je ne sais pas si je me servirais de Siri un jour. Heureusement, on peut le masquer pour que ça ne traine pas constamment dans les pattes comme un installateur de Edge sur Windows. Dis Siri, tu veux bien m’empêcher de troller Microsoft ?

Liens

Image d’en-tête : montage des photos de Da Sal et de Liz West.

TL;DR : Une fois que vous avez essayé 1 ou 2 mots sur Sutom, allez sur cet outil, puis mettez le format du mot et renseignez les lettres à inclure ou à exclure.

Le format du mot à mettre est de la forme « A . . . ER. $ » où A est la première lettre, E une lettre bien placée, $ indique la fin du mot et les points sont des lettres à trouver.

Attention, les téléphones ont tendance à remplacer trois points par le caractère unique des points de suspension.


S’il y a bien un truc puissant en programmation, ce sont les expressions régulières, ou « regular expressions », Regex pour les intimes.

J’en avais déjà fait une petite introduction que je vous conseille de lire.

Aujourd’hui, voyons un usage à ces choses-là.
Depuis le début de l’année, le jeu Wordle (en anglais) et Sutom (en français) sont devenus viraux. Leur principe est celui du jeu télévisé « Motus ».

Sutom ?

Le principe du jeu est le suivant.

Le but est de deviner un mot.
La première lettre nous est toujours fournie. On connaît également la longueur du mot.
On a droit à 6 essais pour deviner le mot :

Début du jeu Sutom.

À chaque fois qu’on essaye un mot, on a des indices :

  • les lettres bien placées sont en rouge
  • les lettres présentes mais à leur mauvaise place sont en jaune
  • les autres lettres ne figurent pas dans le mot

Dans cet exemple, celui du 21 janvier 2022, si j’essaye le mot « Diamètre », j’obtiens :

Premier essai dans le jeu Sutom
Je sais désormais que :
– Le mot fait 8 lettres (incluant le D au début)
– D et I sont bien placés
– E et R sont mal placés (mais présents).
– A, T et M sont exclus (grisés sur le clavier)

D’essai en essai, on accumule les indices et la solution nous apparaît plus ou moins facilement.
Motus était un jeu télévisé, mais sur ces petits jeux en ligne, il n’y a rien à gagner. Il y a un seul mot par jour.

Si vous trouvez, vous recevez un code rigolo à partager sur les réseaux sociaux qui représentent les couleurs des cases du tableau. Comme personne n’essaie les mêmes mots, il est généralement unique à vous pour ce jour-là. C’est amusant :).

Utiliser les Regex pour jouer à Sutom

Sutom demande deux choses qu’un ordinateur a :

  • de la mémoire (du vocabulaire)
  • de la logique

Il suffit d’une liste de mots connus suffisamment complète ainsi que quelques règles de base pour permettre à un ordinateur de jouer à Sutom.

On pourrait créer un solveur où l’on prend la grille en photo et il nous donne la réponse. Ce serait un exercice intéressant à plusieurs niveaux, mais ce n’est pas ce que je vais faire ici.

Je me contenterai ici d’utiliser une liste de mots et les Regex mentionnées plus haut pour trouver la solution grâce aux indices du jeu.

J’ai fait cette page : Rechercher un mot. Elle contient 340 000 mots et un champ de recherche.
L’intérêt est que la recherche fonctionne par Regex !

Le but de cet article est de créer une Regex puissante qui va très vite filtrer les mots et nous sortir le bon, généralement après 1 ou 2 essais seulement.

Pour l’exemple du 21 janvier 2022, le mot commence par D et fait 8 lettres.

On a donc cette Regex :

D.{7}$

Vous pouvez copier ça dans le champ de recherche de la page de recherche de mots.

La Regex signifie « un “D”, suivi de 7 lettres » (donc bien 8 au total). Le « $ » à la fin signifie que c’est la fin du mot après ça. Si on ne le met pas, il va nous sortir les mots de 8 lettres ou plus. Or nous ne voulons que les mots de 8 lettres.

À ce stade, ma page me sort 37 042 mots. On peut en utiliser un de la liste ou en poser un qu’on connaitrait déjà.

Dans mon cas, j’essaye « DIAMETRE ». J’obtiens les informations suivantes :
– D et I sont bien placés
– E et R sont mal placés (mais présents).
– A, T et M sont exclus (grisés sur le clavier)

Il faut donc un mot qui débute par DI, qui ne contienne pas A, T, M, mais qui contienne E, R. et dont la longueur totale fasse toujours 7 lettres.

Le début de la Regex est simple : le mot commence par DI.

La Regex débute donc tout naturellement par :

di

Ensuite, il faut dire que parmi tous les mots commençant par « DI », on veut ceux comportant E et R.

Il s’agit d’utiliser une assertion positive avant (positive lookahead), pour dire « je veux un E et un R après le DI ». Il existe aussi des assertions arrière, pour vérifier ce qui se trouve avant, mais ça ne nous intéresse pas ici.
L’assertion positive est inclue dans notre Regex sous la forme (?=REGEX). Elle contient elle-même une sous-Regex.

Notre sous-Regex est la forme « une lettre suivie de E ou de R ». La regex est triviale, mais comme on veut un E et un R, qu’importe l’ordre mais il nous faut les deux, il nous faut deux assertions :

(?=.*e)(?=.*r)

Maintenant un peu de technique interne aux Regex.

Normalement quand on cherche « ABC », il cherche un « A » suivi d’un « B » suivi d’un « C ». La chaîne « A1B1C1 » ne marche pas, car les trois lettres ne se suivent pas.

Effectivement, après avoir matché le « A », le parseur se positionne après le A. Il regarde donc s’il y a un « B » juste après, et ainsi de suite, à chaque fois en venant avancer dans la chaîne. Ainsi, quand on matche notre « AB », on avance de deux lettres dans le mot.

Les assertions servent à matcher des trucs, mais ne font pas avancer dans notre Regex globale. Quand on utilise l’assertion, on va parcourir le reste du mot et renvoyer un TRUE si un E et un R sont trouvés, mais on vient se remettre juste après le DI.

À ce stade, la Regex entière a filtrée les mots débutant par DI et contenant un E et un R.

Il reste à filtrer les mots pour éliminer ceux avec A, T, M.

Pour ça, on veut exclure des lettres. On va utiliser une assertion négative avant (negative lookahead) pour dire « je ne veux pas de A, T, M après le “DI” ».

L’assertion négative se construit avec (?!REGEX). Elle est négative, car on retourne FALSE si la REGEX à l’intérieur de l’assertion retourne TRUE.

Dans notre cas, on veut refuser A, T et M. Une seule assertion suffit car on veut éliminer les mots contenant une ou plusieurs des lettres parmi A, T, M :
Ce qui donne :

(?!.*[atm])

Maintenant, il nous reste à dire qu’il nous faut 6 lettres.
Inutile de lister les lettres : on peut utiliser le simple « . ». Les assertions ont déjà filtré les lettres qui nous intéressent ou non. On a donc :

.{6}

Mis bout à bout, on a :

di(?=.*e)(?=.*r)(?!.*[atm]).{6}$

Le filtre me trouve 34 mots (sur 340 000). Pas mal, mais pas suffisant pour gagner au jeu. Il faut en essayer un au hasard. J’essaye donc le mot « DISPOSER ».

Qui donne :

Essai du mot « disposer » dans Sutom.
J’apprends donc que le mot est de forme « DI...SER ». J’apprends également qu’on peut éliminer les lettres O et P, en plus de A, T, M.

On peut donc modifier notre assertion négative avant pour filtrer ces deux lettres supplémentaires. De plus, le E et le R sont bien placés : on sait où ils sont. Notre assertion positive avant devient inutile.

La Regex globale devient :

di(?!.*[atopm]).{3}ser$

Qui signifie :

  • « di »
  • puis « on ne veut pas de A, T, O, P, M »
  • puis on revient après le « di », on met trois lettres n’importe lesquelles
  • puis on met « ser »
  • et c’est la fin du mot.

Et là, bim, mon outil de recherche ne me sort plus qu’un seul mot.

Il se trouve que c’est le bon :

SUTOM #14 3/6

🟥🟥🟦🟦🟡🟦🟡🟦
🟥🟥🟦🟦🟦🟥🟥🟥
🟥🟥🟥🟥🟥🟥🟥🟥

Bingo !
Ou plutôt « Motus » !
(ou Sutom)

Bien-sûr cela fonctionne, car tous les mots dans le dictionnaire utilisé par le jeu sont contenus dans le dictionnaire de ma page.

Ma page n’utilise pas le même dictionnaire. C’est volontaire, car je veux un dictionnaire plus large. Mais il arrive bien à filtrer des choses.

Notez que ma page permet de filtrer les accents et les tirets aussi. Sutom ne les affiche pas (ou plutôt il compte le É ou le È comme un E).


Enfin, j’ai aussi un outil de visualisation de Regex. Il est repris d’un code déjà existant (pas de moi) mais ça permet de visualiser ce que signifient les expressions assez compliquées de Regex.

Petite digression sur cet article :

Je commente juste ce passage, lié à la licence MIT car je suis totalement d’accord avec :

The MIT license to a large extent is the anti-license. The utopia of socialized programs, one that embraces the lack of marginal cost for software goods.

It’s an explicit rejection of the strong-property rights approach taken by both Gates and Stallman at their respective ends of the libertarian spectrum.

It’s the language of giving without expecting anything in return. It’s the language of sincere charity. A charity without strings attached, neither commercial nor reciprocal. With the risk of sounding sanctimonious, I read it as a pure projection of altruism.

[…]
That to me is freedom.

Car non, même si je considère que GPL et consorts sont nécessaires, ce n’est pas pour moi une licence libre.

La liberté, c’est quand je fais ce que j’ai envie de faire, et comment j’ai envie de le faire (je caricature évidemment).

Est-ce que la licence GNU me permet de faire ce que je veux ? Non. Je ne peux pas, par exemple, faire un logiciel propriétaire avec un code d’origine libre (pour ça, il y a d’autres licences qui sont apparues).

La liberté va de paire avec des devoirs, je suis absolument d’accord avec ça. Mais précisément : il faut bien distinguer les deux.

Ainsi, je vois les licences comme suit :

  • MIT est la liberté : je fais ce que je veux.
  • Une licence propriétaire, n’a que des devoirs (ou des interdits, qui ne sont que des devoirs négatifs ; en tout cas le contraire d’une liberté). Je ne fais rien comme je veux.
  • GNU/GPL essaye de concilier les deux : en donnant une liberté associée à des devoirs. Je fais ce que je veux, mais sous certaines conditions.

Parfois, souvent même, c’est utile et nécessaire de poser quelques limites. Mais dans autant de cas, une permissivité totale est également nécessaire.

Prenons l’exemple de la loi, car c’est ça qui détermine nos vies en société.

La loi, la constitution, posent des libertés et des devoirs pour chaque personne. Ainsi, par exemple, pour utiliser l’espace public, on ne doit pas être ivre. Il en va de la tranquillité de la société, sachant que l’alcool est une drogue, qu’elle rend violent et incapacitant : une personne ivre est un danger pour elle-même et les autres et il est mieux d’éviter ça.

Pourtant, il est tout à fait autorisé d’être ivre.
Il est tout à fait autorisé de boire quand on est mineur.
Et il est aussi tout à fait autorisé d’être ivre quand on est mineur.

Juste, chez soi.

Chez soi y a pas de problème.
Chez soi, la permissivité est très très large.

Encore heureux.

Stallman avec GPL, n’a pas fait une permissivité totale pour chez soi. Ce qu’il a fait, c’est un espace public : à la fois ouverte sur des libertés et délimité par des devoirs. La licence MIT, elle, c’est chez soi. Une licence propriétaire, en revanche, c’est chez les autres : on fait ce qu’on nous autorise de faire, car on n’est pas chez soi.

Quand je suis chez moi, je n’ai pas envie qu’on vienne me dire ce que j’ai le droit de faire ou non. Ni Bill Gates, qui vient me harceler parce que j’ai modifié Windows ; ni Richard Stallman qui exige le code source d’une modif que j’aurais commise (dans le cas de la AGPL, cette exigence est imposée même sans que le code ne soit redistribué).

Gates et Stallman ont beau être chacun à l’opposé d’une échelle assimilable à la droite et à la gauche en politique, cette échelle binaire, je la vois plutôt comme un polygone à trois sommets : Gates (tout interdit) à un bout, Stallman (des libertés ET des devoirs) à un autre, et les licences totalement libres telles que MIT, Apache, WTFPL au troisième (que des libertés).

Ces trois « pôles » défendent donc des intérêts différents à chaque fois : celui de l’utilisateur, du créateur, ou de la société (et on peut très bien en imaginer d’autres).

En fait, en rédigeant ce post, je viens de me mettre une image mentale sur pourquoi je n’ai jamais considéré les licences GPL comme libre, tout en étant fondamentalement convaincu de leur utilité. L’un n’empêche pas l’autre en fait.

Et le seul problème, c’est qu’on assimile GPL ou GNU à la liberté, alors qu’en réalité on devrait l’associer à une chose publique. (je n’emploie volontaire pas l’expression « domaine public », car ce vocabulaire signifie déjà quelque chose, même si le terme approprié serait bien « domaine public »). La GPL s’appelle d’ailleurs « General Public Licence », pas « General Free Licence ». C’est peut-être pas sans raison.

Car ce qui est public est accessible à tous sans appartenir à qui que ce soit.
Le bus est un transport public : pourtant je ne peux pas virer le conducteur et voler le bus pour rentrer directement jusque chez moi. Ni sortir dans un parc et couper les fleurs. Ni ramasser un banc pour mettre dans mon jardin.

Alors que ce qui est libre, je peux le prendre et en faire ce que je veux. Si y a un panier de pommes dehors où c’est écrit « Gratuit, servez-vous », je peux prendre une pomme et elle devient la mienne. Je peux la manger, la rapporter à la maison, en faire de la compote ou la jeter aux poules : j’ai le droit. C’est libre.

Quand j’ai commencé à utiliser un ordinateur, j’adorais bidouiller. J’étais encore petit, mais je m’amusais à modifier tous les paramètres possibles et voir ce qui se passait. C’était sous un système Windows. J’essayais aussi de supprimer ou déplacer des fichiers, toujours pour voir. Là, forcément ça plantait et il fallait réparer.

Avec le temps et au fil des bidouilles, on comprend quel programme fait quoi et ce qu’il ne faut pas faire ou alors seulement en connaissances de cause.

C’est un bon moyen d’apprendre.

Au fil du temps, je me suis lassé et j’ai voulu découvrir d’autres trucs. J’ai essayé GNU/Linux (Ubuntu). J’ai pu découvrir un autre système, d’autres manières de fonctionner, d’autres paramètres à bidouiller, à casser et à réparer, d’autres fichiers dans lesquels gratter, etc.
J’utilise toujours du Linux aujourd’hui, sur mon système personnel de façon courante.

Mais j’ai l’impression que tout ça c’était avant. Aujourd’hui je ne bidouille plus comme ça.

Aujourd’hui, si je bidouille mon système, c’est pour qu’après ça marche. J’édite d’obscurs fichiers de config, j’installe des outils étranges et je fais des scripts bizarres, mais tout ça est devenu purement fonctionnel.

J’ai plus le temps ni l’envie de bidouiller pour m’amuser : la fin n’est plus l’excitation de découvrir, casser puis réparer un ordinateur. Pas que je ne suis plus curieux, mais parce qu’une fois qu’on a découvert, on ne peut plus redécouvrir. Mon intérêt s’est porté sur autre chose.

La fin est devenue d’avoir un ordinateur qui fonctionne comme je le veux. Et c’est bien ce que j’ai : j’ai passé plusieurs années étudier le fonctionnement, afin de voir ce qu’on pouvait modifier et comment, pour pouvoir avoir enfin un système qui fonctionne comme je veux.

Ça ne me dérange pas de lancer des lignes de commandes trouvées sur la dernière page de l’internet, mais ça doit avoir un but et ça doit fonctionner. C’est d’ailleurs la raison de mes checklists Linux/Windows : avoir mes commandes à porté de main et pouvoir les appliquer rapidement en cas d’installation d’un nouveau système (mise à niveau complet, changement de PC…).

Pourquoi avoir un PC qui marche ?

Avant je bidouillais pour bidouiller. Maintenant je bidouille pour que ça marche. Car si ça marche, je peux produire et créer : faire des choses constructives.

L’informatique a pris une grande place dans mon quotidien et j’aime avoir les outils pour l’exploiter correctement. Et si un outil n’existe pas (ou n’est pas à mon goût), je sais le créer.

Tout le temps passer à regarder le fonctionnement d’un ordinateur m’a permis de découvrir l’univers des possibles en informatique (car oui, un ordinateur peut faire autre chose que ses courses en ligne ou regarder Netflix).

Du coup, maintenant, je crée des outils qui me servent au quotidien dans ce que je fais. Ma page des outils en ligne est dans cette veine-là.

Je pense que c’est un peu comme quand on évolue de lecteur à écrivain : on regarde, on apprend, puis on construit des choses différentes de ce qu’on a vu grâce à ce qu’on a appris.

Peu de monde va aussi loin dans cette démarche. La plupart des gens, face à un ordinateur, n’y voient qu’un écran interactif, bien loin de se douter qu’avec les bons outils et les bonnes connaissances on peut utiliser son PC pour faire à peu près n’importe quoi.

Et aujourd’hui, c’est là que je me dirige, plus que vers le simple bidouillage.

Ça en est à un point où, parfois, les systèmes trop configurables me font chier. KDE, un environnement Linux axé sur la personnalisation, est très joli mais ne m’attire pas. Je préfère Mate (Gnome) qui a autant d’options (juste elles sont cachées) mais qui à l’utilisation n’est pas encombrante.

C’est un peu ce que je reproche à Android de plus en plus. Il y a des tas d’options partout, à tel point que celle que l’on cherche est introuvable 90 % du temps. Sur ce plan, et bien que ça ne soit pas la seule raison, je songe de plus en plus à passer sur iOS/iPhone. Un système qui tourne et qui ne traîne pas dans mes pattes, quitte à avoir moins d’options : c’est ça que je veux.

Voici une magnifique subtilité du CSS, mais parfaitement logique quand-même :

Que se passe-t-il si on met !important dans une variable ?

Voyons ça :

div {
  --color: red !important;
  color: var(--color);
  color: yellow;
}

À votre avis ça donne quoi ça en CSS ? Le point litigieux, c’est bien-sûr la présence du !important
Sauf qu’il est à savoir que le !important n’est pas sur une déclaration de propriété, mais sur une déclaration de variable CSS.

Or, une variable ne peut contenir qu’une valeur. La valeur contenue dans --color est donc red. Il faut savoir que le !important ne fait pas partie de la valeur : il s’agit d’un élément de langage qui permet de jouer sur la spécificité, comme un drapeau (un flag).

Résultat : la couleur finale du texte sera décidée par le vainqueur des deux déclarations de color juste en dessous. Comme celle-ci ont la même spécificité, c’est la dernière qui gagne.

Conclusion : le texte est en jaune.

!important n’est pas sans effet !

Maintenant, utiliser un !important dans les variables CSS n’est pas sans effet pour autant.
Regardons :

div {
  --color: red !important;
  --color: blue;
  color: var(--color);
}

Ici, aucune ambiguïté sur la déclaration de la couleur, puisqu’il n’y en a qu’une seule : color prendra la valeur contenue dans la variable --color. Oui mais laquelle ?

Réponse : celle dont la déclaration a la spécificité la plus grande ! Autrement dit, la première.
Conclusion : ça donnera du rouge.

Il convient donc de distinguer deux cas de figure :

div {
  --color: red !important;
  color: var(--color);
  color: blue;
}
div {
  --color: red;
  color: var(--color) !important;
  color: blue;
}

Dans le premier cas, les deux déclarations de couleur ont la même spécificité. C’est donc la dernière qui gagne : le texte sera bleu.
Dans le second cas, c’est la première déclaration qui a la plus grande spécificité (à cause du !important).

Peu importe qu’elle ait une variable ou non, c’est elle qui gagne : cela donnera du rouge.

Le conflit ? Quel conflit ?

Dans sa conclusion, l’article dit qu’il y a deux niveaux de « scope » (traduction ?) sur lesquelles sont appliqués le !important. Une sur les variables, et une sur les propriétés. Je ne suis pas d’accord avec ça : pour moi il n’y a en a qu’une seule. En revanche, il a deux déclarations différentes à considérer : une sur une variable, et une sur une propriété.
Maintenant, dans les deux cas, on peut ajouter un !important si l’on veut. Et comme ce sont deux choses différentes, elles n’entreront pas en conflit.

Appliquer deux !important à deux propriétés différentes n’est pas un problème :

div {
  font-weight: bold !important;
  color: red !important;
}

Ces deux choses n’entrent pas en conflit.
Par conséquent, les deux choses suivantes non plus :

div {
  --color: bleu !important;
  color: red !important;
}

Notez que ci-dessus, la variable --color est déclarée, mais jamais utilisée, donc aucun conflit à l’horizon.

Dans ce qui suit, toujours aucun conflit :

div {
  --color: bleu !important;
  color: var(--color) !important;
}

Tout est clair : la variable reçoit du bleu. La couleur reçoit la variable. Donc la couleur finale est bleue.

Et même s’il y avait plusieurs déclarations de la variable, celle qui gagne est celle de la plus grande spécificité. Ensuite, c’est la déclaration de la couleur avec la plus grande spécificité qui gagne. Ainsi l’exemple suivant donnera du rouge :

div {
  --color: red !important;
  --color: blue;
  color: var(--color) !important;
  color: green;
}

Parmi les variables, c’est le rouge qui gagne sur le bleu.
Parmi les propriétés, c’est celui avec le var() qui gagne sur celui avec le vert. Or la variable contient du rouge. Donc le texte sera rouge.

Applications à un contexte plus large

Tout ceci est évidemment à mettre dans un contexte plus global avec des déclarations sur des sélecteurs de spécificité différente.

div {
  --color: blue !important;
  color: var(--color);
}

div#foo {
  --color: orange;
  color: var(--color);
}

Ici ça sera… Bleu !

Regardons la couleur pour commencer. La couleur reçoit ce que contient la variable. Aucune ambiguïté. Et la règle qui s’applique est celle dans le second bloc. Pourquoi ? Parce que le sélecteur y est plus spécifique.

Maintenant que contient cette variable ? Cette variable est celle qui est la plus spécifique. Donc celle avec le !important. Donc le bleu.

En effet, même s’il y a un #id sur le sélecteur du second bloc, la variable --color ne contient pas de l’orange, mais du rouge : le !important sur une propriété est plus spécifique que la même propriété placée sur un ID (Spécificité de 1-0-0-0-1 au lieu de 0-1-0-0-1).

Par contre, il en est différent si le !important sous le deuxième bloc avait été sur la variable au lieu de la propriété :

div {
  --color: blue;
  color: var(--color)!important;
}

div#foo {
  --color: orange;
  color: var(--color);
}

Dans ce cas, la variable qui s’applique est l’orange dans le second bloc (car cette variable est plus spécifique à cause de l’ID dans le sélecteur). Le texte est donc orange.

Notons de façon anecdotique que la propriété qui s’applique est bien celle du premier bloc (car cette propriété a un !important).

Le vocabulaire est important : la propriété et la variable sont deux déclarations différentes. Elles ont chacune leur spécificité (au sens de « priorité CSS »).

Si je ne conserve que les éléments qui s’appliquent réellement, ça donne ceci :

div {

  color: var(--color) !important;
}

div#foo {
  --color: orange !important;

}

La couleur reçoit une variable, comme indiqué dans le premier bloc. Mais cette variable a une valeur assignée dans le second bloc seulement.

Ça vous semble casse gueule ? Attendez la suite.

Cas des sélecteurs enfants

Jusqu’à maintenant, même si on utilise deux sélecteurs différents, ils ciblent le même élément HTML.
Poursuivons les complications par quelques exemples pour montrer ce qui se passe avec avec des sélecteurs enfants.

Voyons :

div {
  --color: red !important;
  color: var(--color) !important;
}

div a {
  --color: orange;
  color: black;
}

La question : quelle est la couleur du lien ?
Réponse : noire.

Noire ? Oui, noire. La déclaration tout à la fin.

En effet, le premier bloc a beau avoir des !important sur toutes les propriétés, ils s’appliquent au div, tout comme leur spécificité.
Or, la spécificité n’est héritée que si la valeur sur laquelle elle s’applique est également héritée. En réalité, seule la propriété la plus spécifique est alors héritée (et la spécificité devient inutile).

Ainsi, pour savoir ce qui s’applique à notre a, on regarde le code destiné au a. C’est alors lui qui s’appliquera, s’il y en a. Et le a possède une déclaration de couleur : color: black;.
L’hérédité ne s’applique donc plus : on applique le color: black;, point barre.

L’hérédité ne s’applique qu’en l’absence de déclaration.

Ainsi, si on avait mis :

div {
  --color: red !important;
  color: var(--color) !important;
}
div a {
  --color: orange;
}

Alors, le texte serait rouge. La couleur du a serait héritée du div, et contiendra var(--color), qui, dans le contexte du div (le contexte hérité, donc), est rouge.

Pas orange ?

Non : l’orange est du contexte de a. Or la propriété de couleur est héritée du contexte de div, et là, dans son contexte, c’est bien du rouge que contient la variable. Ce qui est héritée, c’est la propriété et sa valeur.

On aurait même pu mettre un !important dans le second bloc, cela ne changera rien :

div {
  --color: red !important;
  color: var(--color) !important;
}
div a {
  --color: orange!important;
}

Cela rester rouge, pour la même raison : la couleur est héritée, même si elle provient d’une variable.

Si l’on voulait du orange, on doit ajouter un color: var(--color) dans le second bloc. Comme ça, la couleur du a est déclarée et non-héritée. Mais il faut bien conserver la déclaration de la variable dans le a, sinon la variable n’est plus déclarée et elle hérite.

Il faut retenir que la variable s’applique sur les propriétés du même contexte. Le parent transmet une propriété ? D’accord, mais sa valeur est également transmise, même si c’est une variable.

Par contre, dans le code suivant, la variable est bien héritée :

div {
  --color: red !important;
}
div a {
  color: var(--color);
}

Le a sera rouge. Ici, l’on ne déclare pas la variable --color dans le a. Elle est donc héritée. Or son parent lui dit que la variable contient du rouge. Donc le texte est en rouge.

Et avec des variables partagées sur plusieurs propriétés ?

La blague n’est pas terminée !
On arrive ici à quelque chose de très drôle : quid des variables appliquées à plusieurs propriétés, l’une déclarée et l’autre héritée ?

div {
  --color: white;
  color: var(--color);
}
div a {
  --color: black;
  background-color: var(--color);
}

Ça va donner quoi ?
Ici le texte dans le a sera bien en blanc sur fond noir !

Décomposons :

  • La couleur du texte : la couleur n’est pas déclarée sur le a. Elle est donc héritée. Et l’héritage contient du blanc : c’est donc du blanc.
  • Le couleur du fond : le fond est déclaré sur le a. Le fond contient var(--color). Et --color, dans ce contexte, contient du noir. Le fond est donc noir.

Si l’on n’avait pas déclaré le --color: black;, alors la variable aurait été héritée, et on aurait eu du blanc sur fond blanc. Mais comme on l’a redéfini dans le contexte du a, elle prend une nouvelle valeur… dans son contexte seulement.

Notez que dans ce dernier exemple on n’a mis aucun !important : normal, car la spécificité n’est pas héritée si la propriété sur laquelle elle est appliquée n’est pas elle-même héritée.

On aurait pu en mettre partout dans le premier bloc, on aurait tout de même eu du blanc sur du noir.

Conclusion

Pour moi tout est logique, même si c’est parfois compliqué.
Il faut retenir :

  • !important s’applique à la déclaration de la variable. Mais elle n’est pas dans la valeur assignée à la variable.
  • une variable CSS peut être déclarée plusieurs fois. Tout comme on peut déclarer plusieurs fois une couleur. Dans ces conditions, c’est la déclaration la plus spécifique qui est retenue. Si toutes ont la même spécificité, la dernière est retenue. C’est du CSS de base.
  • concernant l’hérédité, rien n’est nouveau là non plus : les valeurs, même avec un !important ne sont transmis aux éléments enfants que si ces derniers ne les redéclarent pas. Ça vaut pour les variables comme pour les propriétés CSS.

Bref, c’est compliqué, un peu curieux, parfois casse-gueule, mais rien de nouveau.

Et rien de différent d’autre langages de prog non plus : les variables ont leur contexte et peuvent être redéfinies dans des boucles imbriquées d’où elles ne sortent pas (pensez au let en JS par exemple : deux variables redéclarées avec le même nom auront leur propre contexte :

let a = "bar";

function newScope() {
    let a = "foo";
    console.log(a); // "foo"
}

console.log(a); // "bar"

Ah et : ici on ne parle que de la propriété color. Je vous laisse imaginer ce que ça donne si l’on utilise des variables dans display, flex ou position, le tout assaisonnée de sélecteurs comme a ~ a et de pseudo-classes :not() ou :placeholder-shown. Ça promet, non ?