da scritch net works - Mot-clé - libre

Retravailler un lecteur web audio dans les petites largeurs

Da Scritch — 2019-06-05T07:32:00+02:00

Parce que les chiffres ne mentent pas : nous sommes de plus en plus nombreux à avoir un smartphone. (Essayez de prononcer cette phrase d'un ton concerné en public sans rire, ça vous fera l'après-midi)
Webdev

Cet article est dans la série consacrée au développement de la bibliothèque cpu-audio.js et documente les affres de sa version 6.

Mettre de l'audio dans le web n'a pas été simple
Reconstruire son lecteur audio pour le web (sur la version 5)
Retravailler un lecteur web audio dans les petites largeurs
Le blues du Web Share (english version)
Deux couleurs bizarres en CSS
cpu-audio.js enfin en 7.0
Tout-terrain WebVTT pour de l'audio
Dichotomie entre podcast et web sur l'audience

Et cet article est long, car comme le premier, je tiens à documenter ma démarche. Et comme j'aborderais plusieurs thématiques, vous aurez plusieurs épisodes. Vous pouvez tester l'application ici ↓ dans sa version de travail en cours.

Pour lire ce billet, il est conseiller d'aller sur mon site dascritch.net. Si vous lisez ce texte, c'est que probablement vous n'y êtes pas.

Avant d'entrer dans le vif du sujet, je rappelle que je ne suis pas web-designer, mais un développeur d'applications web et que je n'ai qu'un minimum de bagages pour construire un web component faisant office de player audio. Que ce composant a été écrit afin de l'intégrer dans un site d'une émission radio, ceci dans le but de lier et de lire des sonores qui durent en moyenne une bonne heure. La plus longue des émissions de CPU dure 5h30, un exemple NSFW qui montre à l'extrême les contraintes.

J'ai qu'un minimum de culture en design, mais j'ai eu la chance d'avoir fréquenté depuis 2000 des designers web (des vrais) qui étaient exigeants et m'ont beaucoup appris à ~~coups de b~~ la dure.

Petits dans la poche, gros dans les contraintes

L'un des gros gros chantiers évolutifs de CPU-Audio.js pour cette version fut la mise au point d'une interface confortable pour les smartphones.

Par rapport à ceux dits de bureau, on a sur ce type d'ordinateurs deux problématiques supplémentaires :

Un écran nettement plus petit,
un dispositif de pointage bien moins précis.

Voici la comparaison avec mon web component sur mon propre blog dans sa version de Janvier 2019, tel que vu sur un ordinateur de bureau (1920 px de large) avec un pointeur de souris.

la souris a une précision au pixel et son curseur ne cache pas tout l'environnement immédiat

… et le même composant, mais vu sur un smartphone d'une largeur de 320 px (virtuels, résolution typique d'un iPhone 5 en mode portrait, en fait l'écran fait dans les 1080 pixels physiques, mais expliquer les dppx dans la foulée serait trop long).
Le disque rouge est une simulation l'espace d'appui d'un gros doigt normal prompt à la bourde.

environ 50 pixels de diamètre, sans compter l'imprécision dû au virage effectué par votre bus à une certaine vitesse

Il existe un certain nombre de règles de bonnes pratiques pour y palier :

mobile first : On présente en priorité les éléments les plus importants de la fonctionnalité voulue ;
On aménage des zones cliquables suffisamment grandes et espacées ;
Le composant doit s'afficher très très vite, et donc avoir un code très léger avec le moins de dépendances possibles, si possible aucune ;
Responsive Web Design (RWD) : On ajoute l'accessoire quand on a plus de largeur disponible.

J'étais déjà parti avec un design liquide (ou fluide ou coulant) pour être le plus confortable, dans l'idée que mon composant puisse être intégré quels que soient les choix sur le design du layout des sites. Pour la légèreté, je tente de maintenir le code compilé sous les 50 kB, même s'il a pris 20% de poids en plus entre la v5 et la v6.

Mais il y avait encore quelques manques dans la version 5 pour que mon player audio soit vraiment confortable à utiliser sur smartphones.

Et déjà un premier souci avec les CSS media queries breakpoints

Car effectivement, il est possible de cibler des définitions CSS par des règles media queries qui s'activent en fonction de la largeur de l'écran ou de la finesse de l'afficheur physique (via l'unité de ratio dppx évoquée plus haut entre parenthèses, oui je sais, ça fait lourd à lire tous ces apartés). Pour les définitions en fonction de la largeur d'écran, cela revient à définir un breakpoint, une dimension critique d'une media query ou le chouïa qui fait changer l'aspect, des propriétés peuvent changer plus ou moins radicalement. J'ai choisi cette stratégie car c'est la plus pratique pour une conception en design liquide.

Mais il y a un gros problème dans l'idée de concevoir un web component installable partout : Il n'est pas possible d'appliquer lesdites règles en fonction de l'espace disponible dans un élément parent en pur CSS. C'est faisable mais avec des polyfill en javascript particulièrement lourdingues.

Je m'explique : Si l'écran est d'une largeur d'écran de bureau (vers 2000 et au-delàààààà), mais qu'un intégrateur installe mon composant sur un site, dans une gouttière qui fait 320 pixels de large, l'aspect de mon composant ne sera pas adapté car les boutons seront trop gros, et par exemple pour les titres, ils ne rentreront pas dedans.
Autre exemple : supposons que la mise en forme du site est entre un bloc principal à largeur variable, et une colonne à taille fixe de 200 pixels. Si le lecteur est dans le bloc principal, il serait logique qu'il change de forme pour une largeur inférieure à 320 pixels quand la fenêtre tombe en dessous de 520 pixels…

@media (max-width: 320px) {
    dommage, hein ?
}

Tommy Hodgins a fait une proposition auprès du W3C qui me serait super utile et totalement indiquée dans mon cas : Les CSS Element Queries qui proposent de définir en breakpoints la dimension d'un élément englobant.

La proposition CSS Element Queries permettrait de définir des règles appliquées si la largeur de l'écran fait 320 pixels ou moins ou que l'élément #conteneur a une largeur de 320 pixels ou moins :

@media (max-width: 320px) , @element #conteneur and (max-width: 320px) {
    J'en rêve, mais j'en rêve ! (c'est déjà dans mon code)
}

Hélas, cette proposition ne semble pas être au programme du CSS working group du W3C et donc pas près d'être implémentée nativement. Et évidemment, tout polyfill est lourd, même avec l'arrivée prochaine de l'API ResizeObserver.
Pourquoi ? Imaginez que vous chargez 4 ou 5 web components dans la même philosophie de conception, qui chacune lance son polyfill… Ouais, évitez le CSS-in-JS dans ce cas-là : vous risquez de ne plus rien contrôler correctement.

Autre frustration : il n'est pas possible d'utiliser des variables CSS pour définir des breakpoints, des changements de résolutions significatifs. Dans mon projet, le style est défini est dans une CSS locale, tandis que les variables reparamétrables par l'utilisateur sont dans une CSS globale, normalement, toutes les variables qui intéressent les graphistes sont dans la CSS globale… sauf ce qui défini les breakpoints !
C'est pour ça qu'ils sont codés en dur à 640 px, 480 px et 320 px.

Pourquoi une telle frustration ? En fait, ce manque est intentionnel : les variables sont justement variables selon les usages et leur définition, pouvant vite devenir un casse-tête pour les navigateurs web à recalculer dans un media query.

Et on pourrait aussi avoir des… maladresses genre :

--largeur : 1000px;
@media (max-width: var(--largeur)) {
    --largeur : 500px;
}

Do not want comme on dit dans le secteur.

Il tourne actuellement au W3C une autre proposition, définir des constantes CSS d'environnement définissant des informations pour l'ensemble du document. Ces constantes peuvent être définies par le système hôte, le navigateur web ou dans la CSS (et on imagine, idéalement sur le sélecteur :root).
À leur appel en lecture, ces constantes peuvent prendre un paramètre optionnel qui sert de fallback. L'invariance de la valeur représentée en quelqu'endroit du DOM le rend alors utilisable pour définir un breakpoint.

Là aussi l'idée est géniale, et le dossier semble un poil plus avancé, l'implémentation native étant satisfaisante pour être jugée comme générale l'année prochaine. On a la lecture, pas encore la déclaration

:root {
    --largeur : 1000px;
}

@media (max-width: env(--largeur, 320px)) {
    ooooh ouuuuiiiii
}

breakpoint sur un élément, comme on peut, comme un porc

Dans l'immédiat, je suis arrivé à le faire sur le mini-site de présentation du projet grâce à une astuce limite du crade à faire dégainer l'Inspecteur Dirty Hacky

Pièce à conviction n°1, faites entrer l'accusé

J'ai utilisé des <iframe>. Et pourquoi est-ce crade ?

Il faut créer une ressource indépendant pour chaque instance appelée, ici 3 documents html de plus ;
Évidemment, il faut recharger le script cpu-audio.js, donc le charger et l'instancier 4 fois pour cette page ;
Idem pour la feuille de style ;
On instancie 3 objets DOM de page en plus, bouffant de la RAM ;
C'est impossible de faire un design liquide propre dedans sans pleurer sur certains cas ;
Et on perd des fonctionnalités comme :
- le lien avec media-fragment (c'est très très con : c'est la fonction qui a motivé l'écriture de mon script),
- l'anti-cacophonie (un seul sonore lu à la fois dans la page),
- les playlists,
- et le contrôleur global (le bouton ▸︎play dans l'encart à fond noir à gauche sur ma capture) ne voit pas ces instances.

Je ne l'ai utilisé que pour faire la démo des largeurs. Ne faites jamais ça chez vous, les enfants !

Le problème de la navigation fine sur une largeur fine

Revenons sur les problèmes fonctionnels de mon web component sur les ordinateurs de poche.

Le manque qui me semblait le plus gênant était de revenir en arrière d'une phrase dans un sonore d'une heure. Le lecteur peut interpréter certaines touches comme ← et →, mais aucun smartphone n'a de clavier avec des touches fléchées depuis la mort du dernier Blackberry à touches physiques. Reste le positionnement au doigt ~~levé~~ posé, et donc la navigation dite fine s'y révèle imprécise.
Améliorer ma time-line était indispensable.

Une time-line c'est ÇA :

N'oublions pas que mon web component est prévu pour être utilisé dans une page web, et qu'il a été conçu en design liquide, donc si on passe son smartphone de l'orientation portrait à paysage et que sa dimension n'est pas fixée, le visiteur gagne autant de largeur, donc de précision pour naviguer dans la time-line. Mais la prise en main me semblait toujours insuffisante.

Dans pratiquement tous les lecteurs audios, la time-line est à la fois un indicateur et un élément de contrôle auquel on s'attend pour tout média audio ou vidéo d'une certaine durée. Elle indique à la fois la position en cours de lecture, la partie préchargée immédiatement lisible sans avoir à attendre, et permet à l'auditeur de sauter à une position. Plus cette time-line est large, plus le positionnement au pointeur par l'utilisateur est précis. Plus le sonore est long, moins ce positionnement est précis.
Je ne saurais dater son apparition, mais il me semble qu'elle est apparue avec le premier Quicktime (1991) en tant qu'adaptation de la time-line des éditeurs de sons qui présentaient la forme d'onde du sonore en cours d'édition, et ceci depuis les années 1970s.

Avant de me remettre ~~au redesign~~ à la refactorisation de mon lecteur, et vu que moi-même je ne suis pas parfait, j'ai regardé ailleurs et essayé des applications natives sur smartphones. En me concentrant sur son comportement lors du passage d'une disposition portrait à paysage. Certains choix y sont surprenants, et pas uniquement sur les durées affichées (passée, restante ou totale).

Quatre exemples de time-line en natif

L'application Youtube l'agrandi aussi en passant en mode paysage. En mode portrait, elle utilise le maximum de largeur d'écran.

Mais pourquoi ai-je pris une vidéo d'Eugène Lawn ?

HenryMP, héritier d'un excellent player audio (Appollo sur Cyanogen OS), se montre encore moins aisé : si on décide de basculer l'écran du mode portrait au paysage.... la time-line n'est pas plus grande pour autant. Frustrant.

J'imagine que la logique y est plus d'écouter des singles d'environ 4 minutes et de mieux voir la pochette de l'album, pas forcément de naviguer dans un DJ-set de 2 heures ou dans une conférence au Collège de France

Note : Cette application n'est plus maintenue depuis 4 ans, elle est présentée ici pour l'exemple.

Podcast Addict, qui est une excellente application orientée podcast (merci Capitaine Évidence), a quelques manques dans sa prise en main pour naviguer. En gros, si l'émission n'est pas chapitrée ou n'a pas de liens explicatifs dans son texte descriptif, on pointe sur la time-line puis on utilise des boutons pour se positionner plus finement.

Dans la vue présentation d'un épisode, basculer en mode paysage étend la time-line.

Sauf que, petite inconsistance : sur la vue propre à un sonore, en mode paysage, la time-line est… plus courte. Oups.

Je termine ce tour avec une application très particulière, celle de Les Croissants, qui propose une matinale par modules, composée en fonction de vos centres d'intérêts.
(Manque de bol : La société Les Croissants a fermé la veille de la publication programmée de cet article. Pas d'bol.)

En haut, vous avez une vue sur l'ensemble de l'émission dans une time-line globale, et au milieu, chaque chapitre a sa propre barre de défilement, mais à la verticale, sur la gauche.

On a certes une redite de la time-line entre la vue totale (horizontale) et celle par chapitre, mais ce qui est nettement plus notable et bizarre est que la progression des time-lines des chapitres n'est pas constante, puisque la hauteur de cet élément est fixe, mais que la durée peut varier (entre 3mn et 7mn). Mais ces bizarreries sont plus une signature et non gênantes à l'usage.

On a vu quelques outils de consultation destinés au public, j'aimerais vous présenter un outil professionnel de lecture de média :

Le jog shuttle du Beta SP

Le magnétoscope Beta SP de Sony est avec sa cassette Betacam un engin de chantier de l'audiovisuel des années 1980s-2000s. Costaud, robuste, très cher et indispensable pour toute production de qualité. La première fois que j'ai pu en utiliser un, j'ai immédiatement adoré l'usage du bouton jog shuttle ! Oui, même en pleine frustrajoie.

Vous ne pouvez pas louper le jog shuttle : c'est ce gros bouton rond noir proéminent idéalement placé sous votre main droite sur le panneau inférieur.
Photo non créditée sur Pinterest

Dans le mode shuttle en pause ou pendant la lecture, vous pivotez le bouton rotatif, la bande défile alors vers l'avant ou l'arrière plus ou moins rapidement, entre le ralenti et l'accélération ×8 en fonction de l'angle de rotation. Relâchez, le bouton rotatif revient en position neutre.
Mais si vous cliquez sur le bouton, le ressort est désactivé, et le mode de fonctionnement passe en jog, où vous faites défiler les images en tournant le bouton. Comme si vous bougiez manuellement la bobine de la bande sur un bon vieux reel-to-reel ReVox, ou que vous caliez un disque vinyle (étant à Radio <FMR>, j'ai voulu être DJ). Ce qui permet un calage à l'image près, indispensable pour le monteur vidéo.

On a donc un outil de calage qui passe d'un clic d'un positionnement grossier au calage à l'image élémentaire. La prise en main est incroyablement intuitive une fois qu'elle vous a été montrée.

À 1m42s, une petite démo avec un lecteur XDCam portable, mais il s'agit d'un bouton combo (voir le paragraphe suivant). Pour 60€, je vous aurais intégré cette vidéo éclairante avec un vrai BetaSP. Et y'a celle-là montrant un autre point de vue.

À noter que certains magnétoscopes très haut de gamme des années 1990s avaient un combo bouton central shuttle rotatif et pourtour jog à ressort. Peut-être fut-il utile pour monter les Sept Premiers Bitomans.

Depuis, la génération Betacam est passée.
Au prix de la bande, les BetaSP sont devenus des pièces de musée, et on monte au clavier et au trackpad. Mais le jog shuttle est resté dans cette micro-culture industrielle pour ceux qui ont connu avant l'informatisation totale du banc de montage. Pas mal de monteurs vidéos, qui ont un jog shuttle wheel sur leur poste de montage. Les control knob prévus pour Windows 10 tels le Surface Dial s'en approchent mais n'ont pas le retour haptique avec ressort, si intuitif.

Et dans les logiciels ?
Il me semble qu'une version (bêta ?) de QuickTime Pro avait tenté à la fin des années 1990s d'ajouter dans un panneau de son interface une molette de défilement… qui ressemblait trop furieusement au jog-dial, une molette crantée cliquable que Sony incrustait absolument partout. Et quand je dis partout, ce jog-dial a été la signature des produits Sony de la fin des années 1990s : sur les baladeurs Mini-Discs (utile pour titrer un MD, mais dont l'usage bourrait de saletés l'intérieur de mon MZ-R35), le téléphone Z5 (celui de l'An 2000) ou encore les PDA Clié. Il me semble que les designers de Sony se soient retenus pour les télés et playstations.
Apple a retiré l'interface avant un procès prévisible, ou peut-être en souvenir de l'échec de la molette de volume du Quicktime 4 ?

Mais je m'égare dans mes rushes.
Alors l'idée d'un jog shuttle dial est super, mais non-intuitive pour le visiteur lambda d'un site à qui il faudrait lui expliquer le manuel, or, rappelons la règle d'or du design réussi :

S'il faut expliquer le fonctionnement d'une interface grand public
⇒ c'est que ton design est loupé
⇒ F.B.I. Fausse Bonne Idée.

Accessoirement, elle est aussi un poil lourd à écrire from scratch. Pas infaisable, juste lourd. Et prendrait de la place sur l'écran.

Maintenant qu'on a fait ce petit tour de l'État de l'Art pour se mettre en appétit, passons à l'action !

Supprimer les bords ronds

Un truc totalement idiot où j'ai pêché par coquetterie : j'ai mis des bords ronds au début et à la fin de la time-line. En fait, cela rend moins facile de viser le début d'un sonore (oui, les recherches avancées ont prouvé que statistiquement, nous cherchons plus souvent à revenir au début qu'à aller dans les 5 dernières secondes d'une émission d'une heure). Donc tant pis pour les bords ronds, on revient au bon vieux rectangle.

Je vais prendre exemple sur mon propre blog, avec une de mes émissions actuelles qui ne dure qu'une heure : Sur 320 pixels de large, le web component fait 291 pixels de large à cause de la mise en page.

La time-line fait 195 pixels de large, les bords ronds en bouffent 2×4 pixels.

Je me suis appliqué la Règle des Cinq Pourquois pour chercher la vraie raison de ma décision graphique. Alors, euuuuuh… les bords ronds sont moins agressifs, parce qu'il y a trop de rectangles, Steve Jobs a inventé les rectangles arrondis… Au final, j'avais mis ces bords ronds sans aucune raison valable.

Bon ben, on vire !

À 18 secondes par pixels pour un sonore d'une heure, cela faisait 2'27" rabotées par pure coquetterie, et non pas par design.

Parce que, oui, il faut se rappeler que le design n'est pas qu'une question de couleurs et de formes mais surtout de praticité pour tous. Faire du décor ne suffit pas et n'est pas du design.

Agrandir la time-line

Passer de la souris à la précision d'un pixel sur un écran de 52 cm de large (1920 px soit 96 dpi) à un écran tactile de 8 cm de large (1080 px soit 400 dpi, plus qu'un album de bd !) avec la précision d'un gros pouce… inutile de dire que sur smartphones, une telle précision peut entrainer autant de dégâts collatéraux qu'une guerre chirurgicale. Et cette imprécision devient de plus en plus problématique quand on a mis en ligne un podcast qui dure une heure (voire 5h30), rendant encore plus problématique un bête besoin comme celui de revenir d'une minute en arrière dans une interview.

Il était évident que garder la time-line contrainte entre les deux boutons ▸︎play/⏸︎pause et action n'était pas une super idée graphique : Je perdais environ 2×48 px en largeur disponible, ce qui n'est pas négligeable quand on a moins de 320 px de large.

Pour reprendre l'exemple de mon blog, la time-line fait 195 pixels de large soit 18 secondes par pixel pour un sonore d'une heure

Il m'a fallu jouer une fugue en CSS mineure pour que cette barre bascule en-dessous de ces boutons pour gagner en largeur. Comme je voulais aussi garder l'indication des longueurs de chapitres (les lignes noires discontinues), je considère qu'elles deviennent transparentes aux actions pointeurs en dessous d'une certaine largeur d'écran, pour éviter un appui malheureux dessus.
Oui, si c'est conditionné avec un breakpoint, c'est que j'ai utilisé une propriété CSS qui influe les interactions du curseur avec des éléments. Cette propriété qui tient de la magie vaudou mérite votre attention : pointer-events : none;

Retravaillée la time-line fait toute la largeur du web component, 291 pixels de large soit 12,4 secondes par pixel pour un sonore d'une heure.
Vous noterez aussi que les deux boutons ont perdu un poil de hauteur et que la place laissée au timecode dans la liste des chapitres est devenue élastique ce qui permet de gagner des lignes dès la première entrée.

Comme l'utilité d'une telle finesse est moins pressante sur de plus grandes largeurs, qui correspondent en général à des ordinateurs avec des dispositifs de pointages plus précis (le doigt occupant une fraction moins importante de l'écran, ou ayant un stylet voire la souris), la disposition entre les deux boutons revient au-delà d'une certaine largeur.

Deviner où l'on vise d'un coup d'œil

On le voit sur la capture au-dessus, j'ai fait apparaitre sous la time-line une indication pointilliste des chapitres. Elle existait depuis un an, mais uniquement dans les grandes largeurs. Celle-ci est désormais aussi visible sur les petites largeurs, mais il n'est pas dit que tous les utilisateurs de mon script vont penser à renseigner un manifeste de chapitrage au format WebVTT. On en reparlera dans un chapitre à part, j'ai beaucoup à dire sur le sujet ; si cela vous intéresse, vous pouvez déjà vous amuser avec mon éditeur en ligne.

Pour aider visuellement à sa navigation, j'ai ajouté une fonctionnalité qui permet d'afficher l'enveloppe du son. Il s'agit d'une option, disponible via l'attribut waveform="".

Pour des raisons évidentes de performances, l'image de l'enveloppe en question est pré-générée au moment de la compression du sonore en PÀD (prêt à diffuser). Afin de tester la fonction et de donner un exemple fonctionnel dans ma doc, j'ai profité d'une fonction méconnue de l'utilitaire en ligne de commande sox, véritable couteau suisse pour travailler du son avec le minimum de dépendances. Un script qu'on trouve souvent dans des chaines de publication audio industrialisées sur des serveurs de rendus.
Anecdote : j'ai utilisé cet outil en 2004 pour faire des messages de répondeurs personnalisé par prénoms et pour biper des ringback tones. Un script de 20 lignes permettait à des ingés son de gagner des journées de travail en supprimant des silences superflus, concaténant des sons et normalisant le rendu.
L'option pour générer ce graphique est spectrogram. Par rapport à la traditionnelle vue de la courbe, elle permet de mieux distinguer les voix et les musiques sur une très petite hauteur, ici 8 pixels de haut. C'est pas toujours vrai et c'est surtout un choix personnel, il est susceptible d'évoluer plus tard.

Comparaison entre une vue d'une forme d'onde (en haut, niveau sonore en ordonnée) et un spectrogramme (en bas, fréquence en ordonnée) de l'émission 🍺 Bière

Naviguer plus finement

Reprenons les problématiques de la navigation sur smartphone : L'écran est tout petit, et notre doigt est démesurément gros pour essayer de se placer précisément. Et donc nous avons toujours le problème de la navigation fine, quand on veut revenir de quelques secondes en arrière.

J'étais parti sur l'idée qu'un appui long sur ma time-line est une tentative pour se placer finement. Ben oui, ça m'arrivait plusieurs fois d'appuyer à un endroit du player, puis de bouger délicatement mon doigt en le faisant pivoter, tout en approchant de près mon smartphone et en tirant la langue afin de contrebalancer le manque de précision… ce qui me rendait totalement idiot dans le bus.

AHEM !
Une requête pour afficher la navigation alternative, nous disions.

L'idée étant évidemment de suivre l'analogie UX de la blague de l'interface : s'il faut l'expliquer à l'utilisateur, c'est que ton interface n'est pas bonne.

j'ai mis des boutons, juste pour voir si la requête en question marchait. Mais j'avais pas forcément idée de le garder. J'avais même réfléchi à zoomer la time-line avec des mouvements genre pinch-in/pinch-out (pincer/étendre), mais je me suis rendu compte que ce n'était ni intuitif, ni pratique, voire complètement frustrant sur iOS : le pinch-out à une certaine ampleur peut vous sortir du navigateur web pour aller vers un sélecteur d'applications (Un parti-pris d'Apple très con et totalement frustrant quand votre appli utilise le pinch, justement).
Et comme mon web component a aussi pour objectif d'être repris, hors de question de risquer une contradiction parce que le site hôte a déjà son usage du pinch-in/pinch-out.

Donc finalement, supposer qu'un appui long sur la time-line est une demande explicite de l'utilisateur vers plus de précision, me semble pas trop erroné.

Mettre des boutons ⏮ ◂◂◂ ◂◂ ▸︎▸︎ ▸︎▸︎▸︎ semblait pas trop pourri.

J'ai dit semblait, une fois de plus, je dis pas avoir raison.

La mauvaise surprise du temps

J'ai tenté de mettre une entrée de temps, utilisant un champ <input type="time">, yep, icelui : . Après tout, les smartphones ont en général un excellent sélecteur de date et d'heure.

Le sélecteur d'heure d'Android, extrait de l'excellent article sur <input type="time"> de Mozilla Developer Network.
Une chouette analogie aux vieilles horloges à aiguilles, compréhensible parce que des équipes de Google (comme Microsoft, Apple et Mozilla) ont investi des milliers d'heures sur ce problème à votre place.

Sauf qu'il y avait un os ! J'ai pris un sélecteur d'heure, faute d'avoir un sélecteur en HTML5 pour exprimer une durée. Ce qui veut dire que… l'heure peut afficher au format 12 heures avec une locale américaine ! Et impossible de le localiser de force avec un attribut comme lang="fr".

Tiens, si je règle un champ time à 0h1mn23s, dans Firefox avec l'interface paramétrée en Français, vous aurez :

bon là, vous m'comprenez si vous me lisez en Français

Et avec l'interface paramétrée en Anglais Américain (en-US), qui est l'interface par défaut pour beaucoup de monde :

Tempora mori, tempora mundis recorda comme dirait le roi de Loth,
ça veut pas du tout dire la même chose, et surtout pas une durée

En fait, il n'y a pas de règle uniforme du comportement basculant entre les affichages en 12 h ou 24 h : certains navigateurs se basent sur la langue de leur interface, d'autres celles du système d'exploitation (heureusement, le DOM expose au javascript une représentation unique au format 24 heures, idem pour l'envoi d'un formulaire à un serveur, sinon je serais devenu fou).

J'avais le même souci dans mon éditeur de chapitrage puisqu'il utilisait le même type de champ. Pour le résoudre, il suffirait d'écrire un polyfill d'affichage agissant sur un champ <input type="time"> caché… ouaip, ça craint.
Ben j'ai écrit une mécanique différente.

En résumé, pour un champ natif de durée, il manque :

soit un type de champ <input> pour gérer la durée, une décision à prendre au niveau du W3C ;
soit le respect de la propriété lang="" dans les contrôles, ce qui peut être implémenté par les navigateurs mais peut poser des soucis d'UX ;
soit la possibilité de styliser un champ <input type="time"> dans sa présentation et son interface pour basculer entre les modes 12 et 24 heures, une décision qui peut être testée par les navigateurs par une propriété CSS préfixée expérimentale avant standardisation.

Néanmoins, je n'étais pas satisfait de cette navigation alternative.

L'enfer des petits détails

La barre de navigation alternative apparaît quand on clique plus de 400 ms : au-delà, Chrome sur Android et surtout l'affreux iOS considèrent que l'utilisateur veut une autre fonction, genre sélectionner du texte. Alors qu'on a déjà désactivé la sélection de texte. Le pire étant iOS qui va lancer un sélecteur d'application qui n'a rien à voir.
À noter que pour les ordinateurs de bureau, il est possible de l'afficher en faisant un clic droit à la souris sur la time-line (la fonction normale est disponible en combinaison avec ⇧Shift).

Voilà où en était mon brouillon, que j'ai finalement gardé. Ici en faisant abstraction du champ input type="time" pour ne pas plus vous distraire avec…

Pour être le plus standard possible, j'ai créé des boutons ◂◂ et ▸︎▸︎, calqués sur les appuis de touches ← et → tels qu'interprétés dans mon web component (faisant des sauts de 5 secondes, durée paramétrable) , ainsi que ⏮ sur la touche ↖. Puis j'ai ajouté ◂◂◂ et ▸︎▸︎▸︎, qui font comme ◂◂ et ▸︎▸︎, mais répétés 4 fois.

J'ai tenté ce sélecteur, mais design liquide oblige, j'étais obligé de cacher certains boutons qui me semblaient moins utiles, d'un usage moins fréquent. notamment ◂◂, un choix décidé grâce à une technique scientifique de pifométrie, ce qui une fois de plus, vaut ce qu'il vaut et que je n'ai pas forcément eu raison.

Dans la plus petite largeur recommandée (320 px de large, soit un iPhone 5 en portrait), on a l'essentiel utilisable

Mais ces boutons étaient câblés sur l'événement click (clic de souris). Vous cliquez, l'avance se fera. Une fois. Ça serait cool de rajouter la répétition, non ? Tant que vous ne relâchez pas, l'action continue au même rythme.

Donc au final, j'ai dû écrire un gestionnaire d'appui-long/répétition pour 4 boutons, avec un mode de fonctionnement proche d'un clavier de bureau : Une première attente (400 ms) avant de commencer à répéter, puis répéter l'action sur des intervalles nettement plus courts (100 ms). Des durées paramétrables par le site, car je déteste les constantes magiques au milieu du code, et pour qu'un webmaster qui n'aime pas les réglages puisse faire mumuse avec, comme ça, il se sentira plus fort.
Ouarf.

Peut-être pouvait-on faire une accélération de l'avancée en fonction du temps qu'on appuie sur le bouton, mais je ne suis pas sûr qu'un tel système à accélération progressive soit pratique.

Bref…

In fine, j'ai travaillé les fonctionnalités sur mon lecteur audio pour qu'il soit aussi pratique à utiliser sur un ordinateur de bureau que sur smartphone.

Je ne garantis rien. Maintenant reste le plus difficile : en faire autant sur la navigation fine pour l'accessibilité.

En plus de la navigation fine, il faudrait aussi parler du chapitrage audio, mais le sujet est très vaste, il interviendra après qu'on ait parlé de Web Share...

CPU Ex0102 Bonjour à toi, Enfant du Futur Immédiat : Le Seum et le Grub

Da Scritch — 2019-01-17T11:00:00+01:00

Allons bon.. t'arrives pas à imprimer malgré tout ? Faut absolument que je prenne le train pour te dépanner ?
Radio

Ceci est une partie du script de la release Ex0102 du programme CPU, Place locale des Linux User Groups, diffusé le Jeudi 17/01 à 11h. Plus d'infos sur le site de l'émission.
Si vous suivez le programme en podcast, préférez le flux du site de l'émission.

Bonjour à toi, Enfant du Futur Immédiat, toi qui est en train de soupirer devant l'invite de grub, dans la solitude d'une cryptique invite shell. Alors que mince, on t'a tellement dit que Linux c'était pas si compliqué !

Je dois te faire une confession : entre autres Crimes contre l'Humanité, j'ai été longtemps, trèèèès longtemps un prescripteur, ou plutôt un évangéliste des systèmes d'exploitations basés sur des logiciels libres. Quelle ne fut pas mon erreur !
Recommander et installer des logiciels libre entraine une responsabilité : celle d'assister dans la durée. Ben oui, contrairement à Microsoft Windows ou aux produits Apple, tu ne trouveras pas d'enseignes reconnues pour assurer le suivi après install. Et il faut reconnaitre que quand on cherche l'info sur internet, on trouve des réponses, mais pas toujours lisible pour qui n'a pas un master en shell bash.

J'ai été confronté à cette situation l'année dernière. Mes parents habitaient en région parisienne, et j'avais passé leur pc sous Linux afin de ne plus être importuné pour des histoires de virus… ou en tout cas un peu moins. Et il se trouve que mes parents ont décidé d'acheter une imprimante. Et que l'imprimante n'était pas configurable par les outils standards, ou plus exactement, sans le driver Windows proprio du fabricant.
Ne pouvant m'y déplacer, j'ai crû me souvenir qu'il y avait dans leur ville une association d'utilisateurs de Linux. Impossible d'en retrouver la trace sur le site de la mairie où j'avais trouvé l'info, bon, faut dire que le site a été légèrement remanié suite à changement de majorité municipale. Je me dis qu'il doit bien avoir des réunions régulières de ce genre d'assos, outre le premier samedi du mois à la Cité des Sciences à la Villette… Je vais sur l'Agenda du Libre et… ben non, je ne trouve rien [d'accessible pour eux pour qu'ils puissent être dépannés]. J'écume des annuaires d'assos ou des sites spécialisés linux, je fais appel à mes contacts.

Rien. Strictement rien d'exploitable ou à jour.
On parle de Montrouge, une commune limitrophe de Paris, desservie par le métro. Alors oui, je sais, Paris est une plus petite ville que Toulouse si on compare leurs surfaces. Mais quand même !

Enfant du Futur Immédiat, je vais être honnête… Je suis tombé sur un os en préparant cette émission.
J'avais des souvenirs, vagues mais certains, d'avoir croisé une espèce de manifeste pour avoir des Linux Users Groups plus ancrés dans le local et hors des internets ; l'auteur les nommait Local Linux User Group. Cela devait être vers 1998, et je me demande si ce n'était pas sur IRC plutôt que sur un newsgroup… En tout cas, y'a eu un moment une page web…
20 ans après, il m'est impossible de remettre la main dessus. J'avais bien une copie sur un disque dur, le même disque où j'ai miné quelques bitcoins quand ça valait que quelques centimes et qui m'a lâché… Mais c'est pas graaaaaaave.

bouhbouhou snif [[pleurer à chaudes larmes]]

ahem.

Reparlons des vagues souvenirs personnels de ce texte. Ce manifeste partait d'un constat particulièrement pertinent : à part les rencontres IRL (en chair et en os) qui permettaient à des gens déjà en ligne sur leur forum ultra-spécialisé de se rencontrer, il y avait paradoxalement de moins en moins de rencontres proprement identifiés, ouvert à toutes et à tous même à ceux qui n'avaient pas encore internet ou installé linux. Et ceci à un moment où Linux n'avait qu'une notoriété naissante. Ce qui voulait dire que pour adhérer à ces clubs sans connaitre personne, il fallait un ordinateur en état de marche. Mais que peuvent faire les personnes malheureuses qui n'arrivent plus à redémarrer leur bécane suite une installation plantée ?

L'idée soutenue était de revenir aux principes d'origines. Back to AFK : Reprendre de la distance avec nos claviers. À l'heureuse époque où les clubs d'électroniques des années 1970s se sont mués en clubs d'informatiques ; où les gens se retrouvaient régulièrement à un endroit identifié, où un quidam pouvait venir, mais surtout l'information était affichée dans les mairies, les écoles, les commerces et les journaux locaux.

Enfant du Futur Immédiat, Linus Torvalds supposait dans une récente interview que l'extrême diversité et complexité du bureau Linux a ralenti l'adoption de l'OS au pingouin. Pour moi, il y a un autre problème : le manque de présence sur le terrain qui permette au néophyte complet de trouver un minimum d'aide. Or, sans bouée de secours, qui ne sait pas nager ne se jettera jamais à l'eau.
Tant que les zélotes ne l'ont pas compris, ils prêchent dans le désert.

CPU Ex0096 Bonjour à toi, Enfant du Futur Immédiat : libre et stylé

Da Scritch — 2018-11-15T11:00:00+01:00

Il faut dire cette cruelle vérité : Le logiciel libre a longtemps été une belle intention, mais très rarement beau et utilisable. Et encore de nos jours, y'a du boulot à faire à tous les étages.
Radio

Ceci est une partie du script de la release Ex0096 du programme CPU, Libre… mais moche ?, diffusé le Jeudi 22/11 à 11h. Plus d'infos sur le site de l'émission.
Si vous suivez le programme en podcast, préférez le flux du site de l'émission

Bonjour à toi, Enfant du Futur Immédiat, toi dont la rétine est encore tout éblouie du thème de bureau violet/mauve installé par ta petite sœur.

Je crois que maintenant, tu as compris qu'il y a deux sortes d'univers informatiques : le logiciel propriétaire et le logiciel libre. Dans l'un, tu achètes une licence d'usage et tu installes le soft produit fini tel qu'il est, tu n'es qu'un client et puis c'est tout.
Dans l'autre, tu as le droit de le copier pour toi, pour ton voisin, tu peux regarder sous le capot, et tu peux même participer à son développement.

Mais si installer un Linux ou un Windows est désormais kif kif bourricot en terme de difficulté, il faut reconnaitre que le monde du logiciel libre revient de loin, de très très loin : en 2000, Linux et compagnie étaient des repoussoirs. Graphiquement affreux, fonctionnellement rebutants, et d'une prise en main malaisée pour le non-spécialiste.

Franchement, il fallait en vouloir pour mettre quelqu'un sur Linux. Il faut reconnaitre que le Mac avait un aspect classieux avec son design accueillant et simple qui fait tout pour cacher tout début de complexité à l'utilisateur, au risque de trop simplifier ; quant à Microsoft Windows, il était familier car on le voyait partout, et il donnait beaucoup de contrôles, beaucoup beaucoup beaucoup de contrôles, au risque de montrer trop d'informations.
Alors que Linux… Non mais franchement, déjà on commençait par la ligne de commande si l'interface graphique avait le malheur de ne pas être configurée. Ensuite, quand on avait enfin un shell graphique, soit le Gnome qui singe MacOS ou KDE succédané de Windows, ben on a des programmes… qui ont des interfaces très différentes. Une fois, j'ai compté que j'avais 9 types de fenêtres d'ouverture de fichiers tous très différents, selon le programme que j'utilisais. Pire que tout, certains sélecteurs proposaient d'utiliser des marque-pages pour aller plus vite vers un répertoire, sauf qu'ils ne se partageaient pas ces raccourcis entre eux. L'énervement était garanti quand on lançait un programme nouvellement installé la première fois. Ou quand on le réinstallait.

Enfant du Futur Immédiat, je ne te parle que de la prise en main quotidienne, mais imagine la gestion technique des paramètres de l'ordinateur... Mandrake avait ouvert la voie à l'époque pour simplifier l'administration de son ordinateur, à une époque héroïque où compiler le kernel n'était régulièrement que la meilleure réponse possible, une opération qui prenait une journée complète. Sauf que, et on en a déjà parlé, 20 ans après c'est toujours un bazar déprimant pour tout nouveau venu.
T'auras beau avoir des gens de très bonne volonté comme Delphine Malassigne tenter d'en parler le dimanche en famille… ben non, ça passait pas.

Et d'un autre côté, des libristes audacieux avaient tenté l'impensable : compiler leurs projets sur Mac et Windows, et de là, faire un effort pour que leur projet semble le plus anodin, le moins déplaisant à utiliser. Firefox, VLC, LibreOffice, des applications qui existent sur toutes les plateformes, et qui donc devraient être aussi facilement utilisables sur un OS libre. Ceux là on souvent reçu les huées des extrême-libristes qui n'acceptaient pas ce manque de pureté.

Le monde du logiciel libre a des efforts à faire, et comme le dit David Revoy, l'auteur du webcomic « Pepper & Carrot », parce que libre et open-source ne signifie pas au rabais ou à l'arrache. Le logiciel libre ne doit pas dire que les concepteurs peuvent tout se permettre, mais au contraire, avoir une obligation d'exigence.

Mais bon, voilà que je m'emporte, alors que le plus simple reste de participer pour que les choses soient enfin bien faites, car…
Qu'est ce qui fait qu'une interface est engageante ? Le beau.

Mais est-il facile de parler de beau ? pas tant que ça.
Et est-ce qu'une interface qui est belle est... utilisable ? Pas toujours.

Enfant du Futur Immédiat, c'est pas parce qu'un aspect graphique est magnifique qu'il est réellement design : ce mot englobe aussi le concept de fonctionnalité, l'oublier, c'est ne faire qu'à moitié le travail.

Reconstruire son lecteur audio pour le web

Da Scritch — 2018-11-06T12:25:00+01:00

Ou comment j'ai bricolé longtemps les pages web pour mettre du son, les différents players que j'ai essayé, que j'ai écrit et la livraison du petit dernier.
Webdev

Cet article est dans la série consacrée au développement de la bibliothèque cpu-audio.js et documente les affres de ses versions 5 et 6.. Dans cette série :

Mettre de l'audio dans le web n'a pas été simple
Reconstruire son lecteur audio pour le web (sur la version 5)
Retravailler un lecteur web audio dans les petites largeurs
Le blues du Web Share (english version)
Deux couleurs bizarres en CSS
cpu-audio.js enfin en 7.0
Tout-terrain WebVTT pour de l'audio
Dichotomie entre podcast et web sur l'audience

TL;DR Trop Long; Vous ne lirez pas ?

La démo du player :

Si vous voyez ce texte, c'est que le lecteur ne s'est pas lancé, très probablement parce que vous ne lisez pas mon billet depuis mon blog
Sauter au milieu de ce sonore d'un simple lien, même en dehors de la page
Une autre démo avec les chapitres
Le repository github du player
Le site de démonstration du player, n'hésitez pas à tester le configurateur et l'édition de chapitres
et tout ça pour une émission radio

Et si on étendait ce tag ?

Mais revenons au moment où on a déclaré deux sources de sons, ce qui permettait le support par la totalité des navigateurs web supportant l'<audio>.
Ladite balise ne venait pas seule : Elle était accompagnée d'une API très riche, permettant de suivre l'état de chargement du fichier, de changer le volume sonore, de connaitre la position actuelle de lecture et même de changer la vitesse de restitution ! En fait, rien ne vous interdit de ne pas afficher l'interface native et de construire la votre derrière.

L'occasion était trop belle : je changeais d'émission radio en lançant CPU et je lançais plusieurs projets liés en parallèle. L'idée étant que les contenus produits pour l'émission radio servent comme cas d'usage pour les projets afférents. L'occasion d'explorer ce que l'on pouvait explorer en production et en ~~consommation~~ écoute d'émissions radio sur internet et de jouer avec les spécificités d'une émission radio par rapport à un pure player audio du web.

Un de mes projets était de reconstruire un player audio au look un poil passe-partout, partageable/réutilisable avec d'autres sites, pour proposer des idées comme une playlist partageable.

Pointer dans le temps

En fait, l'écriture de ce player était une évolution d'une autre bibliothèque de mon crû : j'interceptais déjà les liens d'une page pour lier vers un moment dans le sonore d'une page, ce qui est bigrement utile…

Un menu contextuel de Firefox, généré par ma bibliothèque timecodejs, permettant de récupérer une URL pointant sur le moment du sonore pointé par le menu contextuel.

…et prévu par un standard du W3C depuis 2009, les media fragments !

L'idée est simple : transposer dans le hash d'une url le principe de segmentation des paramètres query par un &, et utiliser les paires clé=valeurs, les valeurs étant séparées par des virgules clé=valeur,valeur. Le hash n'est interprété que par le logiciel client (le navigateur web), charge à lui d'optimiser finement la requête avec le serveur, en utilisant les requêtes partielles Content-Range, répondues par des HTTP 206 Partial Content.
Et, beauté de la dégradation élégante, si le hash n'est pas compris… il est simplement ignoré.

Il existe de multitudes de fragment de média possibles. Ainsi, si je veux afficher un bout de carré d'une grande image à partir des coordonnées (80,160) sur un carré de 80×80, je ferais un <img src="https://dascritch.net/post/2018/11/06/image.jpg#xywh=80,160,80,80" alt="" />.
Vous trouvez qu'il y a comme une similarité avec les sprites ? L'idée partait justement de là.
On retrouve des stratégies équivalentes pour les polices de caractère mais qui n'étaient pas décrites dans ce standard-là.

Soyons honnêtes : À ce jour, en natif, seules les vidéos sont considérées.
Et le standard n'a jamais été implémenté pour les sonores dans les pages, considérant que le chargement fragmenté via les requêtes Content-Range pouvait y palier. (Tu parles ! ça marche efficacement que pour les sonores encodés en CBR, sinon on tourne à la pifométrie, mais j'en causerais dans un autre billet).

Car oui, trop longtemps on a oublié que le web a été conçu pour lier entre eux des documents d'une manière pérenne, que le web sémantique va de pair avec l'espace d'adressage où est le document et qui existe à l'intérieur du document, et qu'on a la technologie pour lier à des chapitres (si on pense à utiliser le nommage id="", j'ai écrit un outil pour vous aider)…

Importance du web documentaire : les hyperliens autour de la page de garde de Wikipédia

…mais si ces technologies sont très bien implémentées pour du texte, voire des vues pour certaines PWA, il n'y avait à l'époque malheureusement aucune implémentation propre et standardisée dans les navigateurs pour lier un sonore ou une vidéo embarqué dans une page à un moment très précis via une URL. Ce qui pose de sacrés soucis, par exemple quand on veut pointer une phrase dans une émission de 4 heures. Oui, je fais parfois des émissions avec 4 heures de parlotte, et elles sont très très bien.

Il existe néanmoins des implémentations de la notation t=<secondes> sur des médias au sein d'une page sur des sites à très fort traffic :

Vimeo et Soundcloud l'utilisent dans la partie hashtag, comme je le fais (…#t=10) ;
Youtube et Peertube en sont très proches mais l'information temporelle est placée dans les paramètres de l'URL (…?t=10), charge aux serveurs de vous envoyer une page directement au bon repère, et qui impose d'intercepter les modifications d'URL plutôt que seulement ceux du hash (exemple dans les chapitres de cette vidéo de Ça Fait Écho).

À noter que plusieurs notations sont autorisées pour le timecode en valeur de t= : notamment le nombre de secondes, ou la notation SMPTE HH:MM:SS.FFF très utilisée dans le monde professionnel (avec des frames d'une durée d'un millième de secondes).

Bonus que j'ai ajouté dans ma petite bibliothèque : quand on quitte une page avec un tel sonore par inadvertance (lien, formulaire, chat qui saute sur Alt et F4), ben si je fais ←back, ou si la page s'ouvre avec exactement le même sonore, j'aimerais bien qu'il reprenne exactement là où je suis. Ça serait la moindre des choses, non ?

Voilà qui m'a écrit…

Mes règles de base :

être toujours au plus près des standards, pour ne plus revivre l'enfer d'avant leur respect, et avoir un code qui restera fonctionnel dans le temps ;
minimalisme de code, pas de bibliothèques/frameworks externes (JS ou CSS), si on s'appuie sur un framework, vous ne pourrez jamais virer cette béquille et elle vous posera des problèmes à l'avenir ;
si besoin de code externe, appliquer les polyfill les plus proches de ces mêmes standards ;
pouvoir le développer avec le moins d'outils tiers (genre Bower, Less, etc...). Tout au plus des linters et des compresseurs JS et CSS ;
par dégradation élégante, pouvoir fonctionner sur des vieux tromblons de plus de 2 ans au minimum ;
que le lecteur natif du navigateur web puisse fonctionner et s'afficher même si votre javascript est complètement planté, car si votre site de contenus ne présente aucun contenu sans javascript, c'est qu'il est sémantiquement mauvais ;
un design liquide, pour s'adapter à tous les styles et largeurs ;
assurer un minimum d'accessibilité ;
rappeler l'importance d'un bon web sémantique.

Le papa player

Alors tout ça, je l'ai braficotté dans mon coin dans une petite bibliothèque javascript. Elle faisait ça :

Le player “ondemiroir” dans deux résolutions

code javascript avec l'excellent framework vanilla js
en liquid reponsive web-design,
avec i18n (internationalization, baille ze ouéy excuse my french)
affichage de pochette
ajout de lien vers la page canonique du sonore
navigation au clavier dans le sonore
reprise à la volée si on a quitté le sonore (donc la page) inopinément au même endroit (très utile quand on lit la dernière émission dans la home du site CPU.pm, puis qu'on clique sur la page de l'émission)
partage sur des réseaux sociaux avec le moment en cours
avoir un contrôleur cloné pour l'entête fixé (qui apparait quand le lecteur principal n'est pas visible)

À l'usage, notre player est réellement devenu un outil très utile pour dérusher les émissions, et pas que pour moi, mais aussi pour les journalistes qui ont participé à l'émission.

Mais le code de génération est assez.. dégueu...
En plus, je voulais tenter un système de playlist centralisée (pour tous les podcasts de la radio), qui impliquait de charger la lib JS depuis un domaine précis. Très grosse erreur.

je voulais rafraichir mon projet avec les Web Components. En fait, je voulais le faire avec dès 2015, quand je lançais l'émission, sauf qu'à ce moment-là, l'ensemble Web Component n'est pas encore gravé dans le marbre et les implémentations parfois masquées dans les navigateurs.

Les WC étaient fermés de l'intérieur

J'ai jamais vu une discussion sur les WC qui n'est pas partie en couille
(@myagoo, in slack communautés-toulouse )

Bon, on va pas troller, on va y aller simplement :

L'idée des Web Components est dans l'air depuis 2012. Il a commencé par être implémenté dans Chrome avant que le standard soit correctement validé. Puis nous eûmes soit des implémentations avec leurs propres API et concepts (ReactJS, VueJS,…) , soit des polyfills plus ou moins proches des standards (Polymer,…)
Le choix d'un polyfill au plus proche des standards me semblait évident, et je voulais utiliser le génial Bosonic de mon camarade Raphael Rougeron.

Si je radiographiais le code source d'un Web Component, je verrais ça :

<template>
  <style>
    …
  </style>
  …
</template>

<script>
  class TonElement extends HTMLElement {
      constructor() {
      }
      …
  }
  window.customElements.define('ton-element', TonElement);
</script>

Un motif HTML, un stylage CSS et une classe javascript pour piloter le module.
Dans l'idée de départ, le tout était enregistré dans un document .html importé dans ta page via <link rel="import" href="https://dascritch.net/post/2018/11/06/webcomponent.html" />

Et dans ta page, tu l'appelles comme ça :

<ton-element>
</ton-element>

Le choix de nommage est assez malin car le standard impose dans le nom d'utiliser un -, afin de ne pas se marcher sur les pieds ultérieurement.

Les Web Components sont formidables

Et en quoi ils vont nous être bigrement utiles :

ils présentent un ensemble d'API totalement standardisées par le W3C, dans 10 ans, le code tournera encore ;
ils obligent à concevoir un design atomique : réfléchir non plus en terme d'aspect global d'une page comme on le fait pour un site, mais en briques élémentaires, indépendantes, donc réutilisables ailleurs ;
ils peuvent se passer des frameworks de rendus pour les intégrer ; fini la panique de mettre à jour bloated code, ranger ReactJS à côté de MooTools dans l'étagère du fond ;
il sont isolés du reste de la page avec le Shadow DOM, une API document fragment d'un DocumentRoot (comme une iframe) appelée shadowRoot. L'isolation peut être stricte, mais laisse la possibilité de discuter par des points d'entrée ;
ils n'ont plus besoin de CSS reset pour nettoyer les règles venant de la CSS du site, ou de filtrer des événements sur des tagNames. À noter que les variables CSS3 passent, on s'en servira ;
leur insertion est simple au possible, à condition que le développeur pense à la dégradation élégante ;
mais ils peuvent inserer des éléments déclarés dans leur code d'appel HTML, ce qui permet une dégradation élégante si le Web Component n'est pas fonctionnel ;
ils disposent d'une mécanique standard pour l'inclusion et la suppression d'une instance d'un Web Component dans une page, déjà cablée sur tout manipulation d'éléments, ce qui facilite la gestion mémoire sur les Single Page Application ;
comme la version de javascript imposée accepte les extensions de classes, on peut construire des héritages de web-elements.

En fait, un Web Component, vous vous en serviez sûrement des prototypes via <input type="date">, <input type="range">, le tandem <summary>/<details> ou encore <video controls> , car les implémentations natives de ces composants dans les navigateurs datent à peu près de cette période.

Dégradation élégante

Pour moi, il me semblait absolument évident que le script doit être capable de ne pas fonctionner sans bloquer l'accès au contenu publié. Il y a milles et unes raisons que cela arrive :

La bibliothèque ne se charge pas,
votre code est bugué,
le navigateur client n'a pas toute les fonctionnalités nécessaires,
le visiteur bloque volontairement tout javascript pour des raisons hygiéniques,
le web n'est pas parcouru que par des navigateurs webs connus et le Google-bot.

Il faut donc que le lecteur audio natif reste fonctionnel, mais qu'il soit facilement capturé et caché par le Web Component. Et ses propriétés d'invocations sont extrêmement intéressantes :

<cpu-audio>
  <audio controls>
  </audio>
</cpu-audio>

Sur un navigateur ancien, la balise du Web Component sera toujours interprétée, mais le navigateur ignorera sa signification sémantique. En fait, elle serait vue par un <div> que ce serait pareil. C'est un fonctionnement d'intégration par fallback qui a toujours été prôné par le W3C et qui est utilisé dans les exemples plus haut avec <object> et <audio>, et c'est ce qui permet de garder un minimum de support le temps que les navigateurs clients soient renouvelés.
La balise <audio> que j'y ai mis serait du coup intégrée normalement, et son interface graphique normalement affichée, invoquée via l'attribut controls.

Les précédentes opérations ont lieu sur un navigateur moderne, sauf que la classe TonElement liée à la balise sera invoquée via sa méthode constructor() ; méthode qui insère le shadowDom (l'interface graphique), lance les interactions avec cette interface, et retire l'attribut controls de la balise <audio> pour la cacher.

J'avais néanmoins besoin, même si les API Web Components n'étaient pas supportés, qu'un navigateur daté profite néanmoins de la fonctionnalité d'adressage dans le temps du sonore. Ce qui voulait dire avoir une vraie politique de développement en amélioration progressive et pour cela, il fallait isoler du code ce qui concerne purement cet adressage et la gestion de l'interface graphique. Bon, dans les faits, tout n'est pas proprement isolé, mais l'essentiel y est.

Brique-olons

Chrome avait une excellente démonstration du ShadowDOM v0 mais avait des petites craditudes derrières. Il y avait aussi la possibilité d'insérer des variables dynamiques dans la CSS et le HTML, mais l'implémentation jouait avec des rafraichissement continués en écrivant directement dans le .innerHTML, avec donc d'énormes soucis de performances. Mozilla avait sa propre implémentation, les X-Tags, qui n'étaient vraiment pas facile à prendre en main. Enfin bref, fallait implémenter de façon très expérimentale, des fois pas accessible par défaut, car on allait changer pas mal de paradigmes sur lesquels les navigateurs web étaient construits.

Puis virent les BONNES nouvelles : ShadowDOM v1 fut enfin finalisé. Chrome en fit une implémentation propre. Et l'équipe de Google proposa un polyfill, WebComponentsJS, qui était vraiment au plus proche du standard des Web Components, à se demander quel intérêt on a encore à utiliser le framework Polymer.
Bon en fait, WebComponentsJS n'est pas parfait, notamment il crée des javascript inline pour émuler les HTML import et les inclusions… une réponse extrêmement mauvaise en terme de sécurité car on doit alors réduire les Content Security Policies de son site, et pour moi, réduire les fonctions de sécurité est une ligne rouge.

Il fallait attendre patiemment les implémentations natives qui n'allaient pas tarder. Le navigateur multi-plateforme qui était apparemment le plus en retard était Firefox, l'implémentation native était là, activable par des paramètres cachés car pas encore considérée comme suffisamment solide. En fait, Mozilla attendait une stabilisation de l'API, dont leur implémentation était cachée jusqu'à Firefox 63 quand il était en version nightly.

Étonnement, Safari était assez vite prêt, Apple n'étant pas pressé de rendre le web aussi puissant que les applications natives.
Il reste le support de Edge, qui habituellement adapte bien plus vite les standards que Safari. Je tiens de source sûre que Microsoft le proposera pas pour la fin de l'année, car le support demande une refacto assez conséquente.

L'interface

Voici un exemple de l'interface en mode large :

Euh.... vous savez quoi ? Vaut mieux vous le montrer en vrai :

Pas de bol, votre navigateur ne supporte pas les Web Components

Mais voici une capture écran de ce que vous manquez :

On voit le panneau horizontal standard avec la pochette, le bouton lecture/pause, le titre qui renvoie à la page canonique, le temps écoulé, la timeline (où l'appui long entraine l'apparition du mode de navigation smartphone) et le bouton d'action.
Et le panneau optionnel de chapitrage.

Pour ceux qui ne peuvent l'afficher, ou pour les archivistes du XXIII^ème siècle, deux captures du player, une en largeur normale, et une autre dans une largeur de smartphone. Captures de début octobre 2018.

La puissance du chapitrage

Dans les fonctions qui sont hyper-pratiques et donc je suis fier, il y a le support des chapitres.

Normalement, il existe la possibilité de chapitrer un fichier mp3/mp4 MAIS chaque format audio a sa propre spécification et il n'est pas dit que si un sonore a deux sources différentes, qu'elles soient raccord sur les déclarations de chapitres, et donc d'avoir des données uniformes. De même, un des problèmes les plus récurrents est que celui qui a encodé le média ne pense pas toujours à vérifier que les métadonnées soient en début de fichier, car certains encodeurs partent dans l'idée que vous voulez faire du vrai stream, sans début identifiable, et donc le chapitre déclaré au moment où il apparait (c'est comme ça que les radios transposent les informations contextuelles RadioText du RDS dans leur stream mp3 sur le net).

Un sac de nœuds ? Non. Il se trouve qu'il existe un standard du W3C (dérivé des fichiers de sous-titres .srt , donc... issus du piratage, mais chut) : Les WebVTT. Et pour les exploiter, une API standard parfaitement supportée par les navigateurs peut prévenir quand on entre ou sort d'un de ces chapitres.
Il est probable que vous les ayez déjà vus à l'œuvre dans une vidéo… sauf qu'ils sont quasi jamais utilisés en audio, et donc sans interface utilisateur dans le navigateur… Jusqu'à maintenant.
Pour des raisons éditoriales, l'interface des chapitres est activée sur mon blog, pas sur le site de CPU.

De même, le player intègre désormais une fonction playlist dans une page : si une balise termine sa lecture, la lecture d'une suivante peut démarrer dans la foulée.

Ce que j'ai appris

Plein de méthodes du DOM que je ne connaissais pas, et qui m'ont facilité le travail. Une fois de plus, on ne relit jamais assez les standards du W3C, sachant qu'ils font actuellement plusieurs milliers de pages. Une de mes découvertes, par exemple, me permet de gérer le blocage des lectures de son automatiques introduits depuis Avril 2018, document.hasFocus() m'évite de lancer une lecture trop tôt et d'attendre que le visiteur a cliqué dans la vue de ma page.

Plein d'événements et autres subtilités sur des balises HTML que je croyais connaitre. Comme quoi, on ne relit jamais assez les documentations officielles.

Utiliser les variables CSS3 pour pouvoir customiser l'aspect du Web Component de l'extérieur sans avoir à bricoler le code ou mettre trop d'attributs HTML dans la balise d'appel.

Modifier du balisage sur les billets descriptifs de 95 émissions de CPU.
J'avais prévu de cacher la liste des chapitres si elle a été chargée et affichée par le lecteur. À la main, et plus d'une fois, pour finalement ne pas m'en servir de suite. Quand vous allez dans vos toilettes avec votre laptop, y'a comme un signe. J'ai tiré une croix pour les 390 Supplément-Week-End et tous les autres émissions archivées. Moralité : toujours déclarer des id="" par blocs reproductibles suffisamment tôt et s'y tenir, ce qui aurait permit d'automatiser ces modifs triviales.

Garder une séparation entre les sources HTML, feuilles de style et javascript.
L'implémentation de HTML Imports restera dans les limbes pour des raisons de sécurité. Heureusement, on peut faire sans, tout en gardant la possibilité de séparer le <template>, le <style> et le javascript : Pour cela, j'ai écrit un make.sh maison crade, certes, mais il fait le taf avec un minimum d'environnement, et je vous invite à participer, il est dans le repo de ce projet.

Avoir attendu 2018 pour développer la nouvelle version m'a permis de bénéficier de :

API enfin stabilisées et réellement standardisés ;
meilleur support de ces standards dans les navigateurs ;
par amélioration progressive, pouvoir toucher 50% d'audience ayant un navigateur à jour de moins de 6 mois (et avoir au moins deux navigateurs cibles multiplateformes) ;
n'utiliser aucun polyfill ;
modulariser pour avoir un fonctionnement possible sans le support des Web Components ;
usage des variables CSS3, ce qui permet de pouvoir personnaliser plus facilement le player ;
relevé deux bugs dans Firefox, 1476302 et 1476301 (yay !) ;
passer mes serveurs en HTTP2, mais sans le mode push, faute d'un support correct du mode HTTP 206 Partial content ou de pouvoir désactiver le push en fonction du type-mime ;
résoudre le problème posé par le blocage des autoplays sonores par Chrome (mars 2018) et Firefox (Octobre 2018).
étoffer la doc et proposer un outil de configuration live et d'édition des chapitres

Je me suis néanmoins planté

J'ai perdu un contributeur (désolé NerOcrO) car j'ai repris le projet ondemiroir-player de zéro à grands coups de copiés-collés et je l'ai surtout annoncé beaucoup trop tôt avant de pouvoir prendre des tiers. Cela a toujours été ma peur bleue quand j'ouvrais mon code, et le meilleur moyen est d'écrire suffisamment tôt une guideline des contributeurs pour que les règles soient posées d'entrée.

Il y a toujours ce souci insupportable qu'il est impossible d'essayer Safari sur iOS sans avoir un iPhone/iPad sous la main. Et d'expérience sur les interfaces, un émulateur peut être vraiment trompeur. J'en veux pour exemple le mode émulation d'appareils mobiles de Chrome à qui il manque des API telles que navigator.share. Alors payer pour un émulateur en ligne… ahem…

Et tout ça pour arriver trop vite, ayant quasi-terminé 6 mois avant de pouvoir lancer mon player :/ Les Web Components totalement fonctionnels sont arrivés dans Firefox 63 sorti officiellement le 23 Octobre, bien après Chrome et Safari, mais la version LTS (Long Term Support) actuelle est Firefox ESR 60 et Tails utilise une version encore plus vieille. Ce qui veut dire que Firefox ESR et Tails vont voir le nouveau lecteur dans sa version fallback un petit moment : pas avant juillet 2019.

Eh oui, le support à long terme est souvent synonyme de… long tail

Je terminerai par un tweet de @mariejulien (le gars des badges en tissu) lors de Paris Web

Question de @SkyNebula à #parisweb sur comment contribuer au libre quand on est designer, début de réponse "déjà tu peux voir si y'a un contributing md sur le repo…" 😅🤗

Vous le voyez toujours pas le problème ? Tout le monde n'utilise pas des outils de dev. Get over it. 😁

… ce qui m'a fait écrire le message d'accueil aux contributeurs extérieurs AUSSI pour les non-développeurs. Ne serait-ce pour les traductions, le graphisme, la doc, etc… Il faut que je complète encore pour expliquer comment faire sans avoir à installer d'outils via le site web de Github, notamment l'épineuse question des localisations (utiliser les .po ? un tableur ?).

Ce qui m'amène à…

L'avenir imaginé pour mon lecteur

Oui, je sais, il ne faut pas documenter le futur d'un produit. Néanmoins, voilà ce que j'aimerais faire :

avoir un vrai travail de design et d'accessibilité, et le documenter ;
résoudre le problème du positionnement fin en tactile sur smartphone : la barre de progression n'est bien qu'à la souris sur ordi, on compense la précision par le clavier. Aucun de ces dispositifs sont sur portable… j'ai prévu une interface avec des boutons en appui long sur la timeline (ou click droit à la souris), mais c'est pas encore ça ;
le support des règles CSS en fonction de la largeur d'un élément ; @element est prête pour moi, mais implémentée nulle part ;
plus de tests de non-régression ;
encore plus de tests ;
documenter encore plus ;
construire en même temps que la compilation des add-ons pour des CMS communs, notamment dotclear ;
créer des add-ons WebExtensions pour les navigateurs avec un ProtocolHandler custom pour basculer la lecture vers une application native (ex: VLC), et donc gérer les touches multimédias, ou les copier dans une clé USB à emporter ;
créer des fonctions décentralisées, sur le modèle (ou basées sur) mastodon :
- pouvoir faire des commentaires comme pour SoundCloud mais de façon décentralisée ;
- pouvoir créer des playlists et les partager de façon décentralisé. Par exemple, lier des émissions qui ont la même thématique comme « Tout est numérique » d'Olivier Tesquet sur France Inter, « Libre à vous» de l'April, le podcast « NoLimitSécu avec la mienne, et les annoter ;
générer des infos côté serveur comme
- un spectrogramme ;
- découper en MSE API ou MPEG-DASH (Dynamic Adaptive Streaming over HTTP), notamment pour sauter plus vite à des fragments (mais y'a des brevets dessus) puis les navigateurs Chrome et Safari se montrent très mauvais dans le chargement partiel d'un sonore via les requêtes Content-Range ;
- avoir un système de pige automatique des textes, pour l'accessibilité aux sourds et malentendants. Je remercie infiniment le travail des bénédictins de l'April, se faire transcrire par eux est un honneur. Accessoirement, cela aide aussi au référencement naturel (sifflote) ;
traduire ;
supporter les localisations RTL (Right To Left), notamment pour les langues arabes, hébreu,… ce qui signifie renverser les icones, la timeline et.... les touches fléchées du clavier, eh oui ;
supporter la vidéo aussi ;
rester sous les 100Ko.

« Mais pourquoi t'embêter ? y'a les apps natives maintenant ! »

Alors oui, malheureusement, la plupart des utilisateurs d'internet sont désormais clients d'applications mobiles…

mais pour moi, le Web n'est pas mort !
Il est ce que nous en ferons : du partage, de l'accès à tous et dans le <a href="https://dascritch.net/post/2018/11/06/"> tous les lier. Il peut même remplacer fortement ces applications, éviter la fragmentation des langages et des frameworks, et conforter ses missions premières via les hyperliens et la décentralisation,…
Qu'on puisse mettre un marque page à un endroit, partager ce lien et donc le contexte à ses amis, dans ses billets de blogs, et retrouver le contexte si la page est publique bien plus tard (à condition que le site existe et qu'il a maintenu son plan d'adressage).

C'est un peu ce que je fais inconsciemment avec ce petit bout de code, qui ne sert qu'à une chose : rendre les sonores plus navigables et plus partageables.

L'étape suivant a été de travailler dans les petites largeurs.

CPU Ex0083 Bonjour à toi, Enfant du Futur Immédiat : Passe le package !

Da Scritch — 2018-05-04T06:19:00+02:00

et toi, c'est quoi ton paquetage favori ? .deb ? .apt ? .rpm ? .tar.bz2 ?
Radio

Ceci est une partie du script de la release Ex0083 du programme CPU, Distribution logicielle, diffusé le Jeudi 3/5 à 11h. Plus d'infos sur le site de l'émission.
Si vous suivez le programme en podcast, préférez le flux du site de l'émission

Bonjour à toi, Enfant du Futur Immédiat, toi qui patiente pendant la mise à jour de ton ordinateur.

Un système d'exploitation est composé d'un noyau système et d'utilitaires de gestion systèmes, et de drivers de matériels.
Oui, cela n'a rien à voir avec une quelconque vision marxiste de la condition humaine, quoique…

Dessus cette brique, ~~je construirai ton égli…~~ j'animerai ton ordinateur : je t'y ajoute un pare-feu, un environnement graphique, un navigateur web, un lecteur audio, un lecteur vidéo, un jeu de carte... On y trouve même parfois une suite bureautique, une appli de chat vidéo, des outils de composition graphique, des langages de programmation, des outils de bases de données, un MOBA et j'en passe. Tous ces outils ont été compilés, paramétrés, empaquetés par des mainteneurs. Et il y a toute une infrastructure derrière pour en assurer la livraison.

Oui, je sais, tu t'attends à ce qu'on te parle de Debian, Ubuntu, Red Hat,… Alors je vais te rappeler les distributions d'OS pour ordinateur les plus connues : Microsoft Windows et Mac OSX. Eh ben oui, ce sont des distributions, il n'y a pas que Linux dans la vie. Et encore, il faut ajouter Android, iOS, Nintendo Switch, Cisco, et tous les appareils aux OS exotiques conçus par les constructeurs.

Certaines sont généralistes, et destinées à donner des usages très variés à des ordinateurs et des smartphones. D'autres sont très spécialisées, par exemple orienté serveur web, plateforme téléphonique ou jeux vidéo. Oui, oui, jeux vidéo, avec un x et sans s, puisque Steam propose son propre OS dérivé de la Debian.

Enfant du Futur Immédiat, tu nous connais, dans cette émission, on a l'esprit mal tourné ; je vais donc prendre un malin plaisir à rappeler à certains qu'il existasse au millénaire dernier une distribution nationale, souveraine, Frrrrrrançaise : Mandrake Linux, devenue Mandriva. Mais comme toutes les distribs, ça va, ça vient… et malgré les meilleurs volontés du monde à faire une distribution simple à l'usage et plaisante à l'œil, il suffit des ratés, une sortie mal léchée… Et la distrib fautive est délaissée, abandonnée, perdue dans les limbes d'une impasse où plus personne ne passe pour l'aider à la sortir d'une mort certaine.

Et puis la manière de répandre une distribution a évolué au même rythme que les manières d'installer un OS from scratch : Il est loin l'époque des CD-ROM d'installations qu'on achetait avec un magazine en papier glacé. L'époque héroïque où tu installais Windows 98 en jouant au DJ avec la trentaine de disquettes et aussi passée que le succès de l'Italo-dance. Maintenant, on est modernes, on fait un système minimum sur une clé USB auto-bootable, et après tout se fait en ligne au—to—ma—gi—que—ment.

Oui, mais quand il y a trop de choix, et bien, on commence à s'y perdre. Laquelle correspond à ce que je veux faire ? Qui a une communauté qui peut m'aider à me dépatouiller ? Laquelle a ce fond d'écran magnifique avec plein de petits chatons ?

Enfant du Futur Immédiat, il est temps de se retrousser les manches, car le Windows de ta mémé s'est fait verrollé, je crains bien que tu sois obligé de passer par une nouvelle installation système.

Cryptoparty de Printemps : Snowden, 5 ans plus tard

Da Scritch — 2018-03-15T06:30:00+01:00

5 ans après les révélations Snowden, que reste-t-il de nos libertés informatiques ?
Sortons

TL;DR Prochaine Cryptoparty de Printemps le Samedi 24 Mars à Utopia Tournefeuille

Projection (payante) en matinée à 10h de « Citizenfour » suivi d'un débat sur les conséquences des révélations Snowden
Mini-conférences, ateliers et install party linux et LineageOS en accès libre de 14h à 18h

La séance

Celle-ci débutera à 10 heures et sera payante.

On aurait pu programmer l'excellent documentaire « Democracy » sur la naissance du RGPD. On aurait pu aussi diffuser d'autres films plus vieux, voire des fictions comme « Ennemi d'État » (sur la surveillance globale et son usage imbu) ou « Antitrust » sur les biais induits d'un OS dans l'usage d'un ordinateur… Deux films qui en 20 ans n'ont pas pris une ride dans leur propos

Mais lors de la réunion préparatoire, une remarque a été intéressante : Beaucoup n'ont pas vu le documentaire de Laura Poitras, alors qu'il relève du document historique d'un événement qui a encore des conséquences importantes sur notre société. Historiquement, c'était aussi notre première cryptoparty chez Utopia à l'invitation de l'association Toulibre en 2015. Le film initialement prévu a été déprogrammé pour la bombe incroyable qu'est « Citizenfour » toute fraîchement oscarisée. Nous ne l'avions pas du tout regretté.

Donc nous rediffusons ce samedi 24 le même documentaire que lors de notre première Cryptoparty de Printemps.
Car il mérite une seconde lecture.
Car il a ouvert des portes.
Car bien des choses restent à faire.
Car des œillères restent malgré l'évidence.

Donc… venez

Les mini-confs prévues

Lors de l'après-midi de 14h à 18h, nous reprenons notre formule des mini-conférences, 5 minutes pour introduire un sujet, 10 minutes pour que le public pose ses questions. L'accès est gratuit, dans le hall du cinéma. Les thèmes prévues pour cette session :

Force d’un mot de passe
Le social engeering aka la faille PEBCAK
Différence navigateur/moteur de recherche net/web
Qu'est-ce qu'un système d'exploitation
Qu'est-ce-qu'un smartphone ?
La sécurité d’un poste Windows
Centralisation / Décentralisation d'Internet

Toulibre sera là comme ils le font tous les mois pour une install party autour de linux.

La nouveauté sera une install-party avec LineageOS pour libérer/revivre votre smartphone

Et d'autres ateliers sont prévus, sans compter des démonstrations si vous nous les demandez.

Pour vous donner une idée, CPU diffusera sur Radio <FMR> en trois partie l'enregistrement de la précédente cryptoparty faite à la médiathèque José Cabanis.

CPU Ex0071 Bonjour à toi, Enfant du Futur Immédiat : Pénible à table

Da Scritch — 2018-01-12T05:20:00+01:00

Oui, cette histoire est autobiographique.
Radio

Ceci est une partie du script de la release Ex0071 du programme CPU, Parler du libre en famille, diffusé le Jeudi 11/1 à 11h. Plus d'infos sur le site de l'émission.
Si vous suivez le programme en podcast, préférez le flux du site de l'émission

Bonjour à toi, Enfant du Futur Immédiat, toi qui es encore tout excité du nouveau PC que tu as reçu parce qu'il n'est pas encore vérolé.

Les repas en famille sont parfois très compliqués. Surtout les repas des fêtes. Bon déjà, si on te demande d'entrée de réparer Windows, ça va faire des salades avant l'apéro...
Mais passons au plat de résistance :
Oui, on a toujours ce convive moralisateur qui casse les bonbons de tout le monde à table. Le végan qui veut sauver les animaux, celui qui veut passer toute morale par la religion, celui qui rappelle que de son temps la météo n'était pas détraquée par tous ces satellites ou encore celui qui souhaite une bonne guerre pour que ça apprenne à tous ces jeunes. Imagine le désarroi de la famille Le Pen quand l'oncle antiraciste commence à bougonner à table !

Bref on aura forcément quelqu'un qui va prêcher la Bonne Parole entre l'apéro et le dessert, donnant une furieuse envie de prendre sa voiture et 3 heures d'autoroute pour rentrer au plus vite chez soi. Et tant pis pour les condés et leur petit ballon.

Et dans le lot il y a nous, nous-même…

…nous qui nous nous y connaissons en informatique ; nous qui disons que c'est mieux avec BSD, qu'il faut arrêter d'être dépendant aux GAFAM. Oh oui, tu rigoles, mais mets-toi à la place des autres convives : qu'est-ce qu'on en on à faire ?

Parler du [logiciel] Libre en famille n'est pas exactement pareil que de faire de l'évangélisme logiciel. On parle d'un ordinateur ou d'un smartphone dont le système d'exploitation fourni par défaut a un gros défaut : il ne travaille pas forcément au mieux, et au final, il exploite par indiscrétion son utilisateur.

En fait, le choix du Libre est très différent d'un bête choix logiciel dans le sens où elle amène un changement d'habitude : ce n'est plus la facilité de prendre le logiciel idoine qui est proposé par le même éditeur (Microsoft, Apple ou Google), mais de comprendre le concept d'alternative. Et une alternative, cela ne remplace pas parfaitement dans tous les cas, cela ne fait pas exactement comme dans l'autre cas, c'est une alternative. Un peu comme passer de l'auto au vélo : Je te vois mal acheter une bouteille de butane sur ton b-twin™, ou emmener hors de Toulouse 3 enfants pour Rocamadour. Les missions ne pas les mêmes et il faut en connaître les limites avant de les imposer aux autres.

Et avant même de passer à une alternative, il y a le fait qu'un OS (un système d'exploitation) est fourni d'office dans l'ordinateur neuf. Sans possibilité de choix dans les applications pré-installées. Et aussi avec le risque de la panne et que le SAV refuse l'appareil en garanti si l'OS a été changé. Ben oui, ça serait ballot alors que ça coûte horriblement cher, ces bestioles.

Et puis, dans l'informatique, il y a le souci de la complexité et du jargonisme. On est revenu de très loin. La distribution Linux Mandrake avait tracé la voie en tentant de faciliter la prise en main de l'utilisateur ; ce qu'Ubuntu a fortement travaillé, et maintenu une forte communauté prompte aux réponses.
Encore faut-il que les constructeurs jouent aussi le jeu : J'ai encore tout récemment dû me débattre par téléphone à dicter des commandes absconses par téléphone à cause d'une imprimante à jeu d'encre, dont le constructeur tenait absolument à ce qu'elle tourne avec son logiciel maison sous Windows qui envoie des pubs toutes les heures.

Faire migrer des novices vers le logiciel libre consiste non seulement à réduire les risques d'une infection ou de l'obsolescence du PC, mais surtout à les rapprocher des LUG, les Linux User Groups. Parce que la plus grande difficulté sera d'assurer le service après vente…
Déjà qu'on passait nos week-ends à déplanter les Windows de toute la famille, on veut bien les passer sous Linux, si on n'a pas plus de boulot avant le repas du Dimanche…

Enfant du Futur Immédiat, en voulant passer ses proches au logiciel libre, tu auras une grande responsabilité : celle qu'ils n'y soient pas perdus, celle de ne pas rendre inutilisable l'ordinateur, celle de ne pas passer pour l'ayatollah intolérant qu'on redoutera au prochain repas de famille.

Écoutez la cryptoparty d'automne

Da Scritch — 2017-10-30T06:54:00+01:00

Vous pouvez écouter l'enregistrement et regarder les supports des interventions lors de notre cryptoparty du 28 Octobre à la médiathèque José Cabanis.
Sortons

Pour cette cryptoparty, ou chiffrofête, nous avons eu une chance d'avoir un enregistrement avec une prise de son correcte. De même, nous avons l'ensemble des supports qui sont consultables.

NOTE : Pour les présentations, si la page est toute noire, appuyez sur → pour faire apparaitre chaque texte et diapo.

Sujet	Position dans le sonore	Auteur	Lien vers le support
Histoire de la cryptographie	0:27	DaScritch	page web
Histoire du chiffrement	22:45	Simon	pdf
Force d'un mot de passe	39:51	InfestedGrunt	page web
L'hygiène numérique pour ceux qui n'y connaissent rien	1:00:54	Maiwann	pdf
Métadonnées	1:20:00	Simon	pdf
Réseau	1:41:02	DaScritch	page web
Sécurisation du Wi-Fi personnel	2:01:16	InfestedGrunt	pdf
Tor/Tails	2:25:06	Simon	pdf
Testament numérique	2:42:00	Natouille	pdf
Sauvegarde personnelle : méthode et solutions	3:01:40	Simon	pdf
La sécurité d'un poste Windows	3:20:27	Glacasa	page web
WannaCry	3:40:22	Glacasa	page web

J'ai déjà expliqué les motivations à organiser ce genre d'événements. Le format 5'+15', quoique pris avec beaucoup de libertés par les orateurs, permet d'avoir des retours constructifs et surtout de ne pas trop perdre l'attention du public.

Je pense que comme le autres intervenants, nous remercions infiniment l'équipe de la médiathèque José Cabanis pour leur invitation, leur accueil, les moyens techniques (dont l'ingénieur du son Patrick Faubert), et bien évidemment le public d'avoir été attentifs et leurs questions pertinentes.

Comme d'habitude, nos supports et sonores sont sous licence CC-BY.

De TEDxToulouse à une cryptoparty

Da Scritch — 2017-10-16T06:38:00+02:00

En Juin dernier, j'ai expliqué mon engagement à TEDxToulouse : Nous avons besoin de plus de cryptoparty pour expliquer aux gens comment regagner confiance envers notre société du numérique. Et notre prochaine cryptoparty sera le Samedi 28 Octobre à la médiathèque José Cabanis.
Sortons

Ça y et, les règles de l'État d'Urgence vont être intégrées dans le droit commun.... alors qu'aucune de ces mesures n'est réellement susceptible d'arrêter un attentat. Ça plus les mesures hallucinantes quant à votre identité numérique...

Maintenant vous devriez comprendre...

Pourquoi nous faisons des cryptoparty

Et une fois de plus, je l'ai expliqué, mais cette fois-ci à TEDxToulouse, sur la grande scène du TNT :

Pourquoi encore en parler? Parce que le sujet de l'édition de Juin dernier était « Nouveaux Mondes, points de rupture ». Or, notre monde numérique exclue ou exploite de plus en plus ceux qui peinent à le suivre. Et nous devons impérativement sortir ceux et celles qui sont dans l'ornière, au risque d'amplifier les inégalités de notre société.

Photo du public de l'édition de TEDxToulouse 2017, © Romain Saada

Alors oui, convaincre une salle pleine à craquer et faire un call to action dans mon uniforme d'opérette encore une fois de plus, oui, c'est important. Et tant pis si on se sent timide, pas à sa place sur scène avec d'autres orateurs aux histoires magnifiques (comme Latifa Ibn Ziaten, véritable mère courage, ou Nicolas Cauwe et l'incroyable histoire des statues de l'Île de Pâques)... Il faut faire bouger les choses !

Tout ceci pour vous inviter Samedi 28 Octobre à la médiathèque José Cabanis

Car, pour rappel, nous y ferons une cryptoparty de 14h à 18h. Alors, n'hésitez pas à venir avec vos questions, nous tenterons d'y répondre.

Affiche de la cryptoparty du Samedi 28 Octobre

Les joies de la communauté open-source

Da Scritch — 2017-09-04T13:45:00+02:00

… comme par exemple s'ajouter un truc à faire, et quelqu'un te dit qu'il a déjà fait.
Webdev

Afin de me familiariser avec les add-ons du navigateur Firefox, j'avais conçu une extension extrêmement simple : anchors-reveal, qui permette de lier à un paragraphe précis au milieu d'une longue page. J'avais déjà blogué à ce sujet. Trèèèèès utile quand on blogue sur un sujet technique.

Des add-ons qui proposent ce service, il en existait déjà une demi-douzaine, mais elles n'ont clairement pas été conçues dans une optique de simplicité d'usage. Le but du jeu était de faire une fonctionnalité le plus minimaliste possible : un bouton qui s'installe dans la barre d'outils et qui révèle les ancres nommées d'une page en superposant un lien direct.

Je voulais à la fois me frotter à l'écriture d'un add-on, mais surtout au framework (obsolète) cfx, que j'ai vite converti vers le framework (obsolète) JetPack qui facilitait l'écriture de ces add-on. Cela m'a aussi permis d'essayer le processus de validation de la communauté Mozilla, qui a été formidable, prévenante et qui aide vraiment à gagner en qualité de code.

Et par ailleurs, j'avais poussé mon code source sur mon repo github, ce qui m'évitait à devoir maintenir un repo git. Ce qui me permettait d'éventuellement profiter de quelques fonctions sympathiques comme la fusion de branches et un rapport de bugs.

Arrive la ré-écriture de Firefox

La Mozilla fondation s'est lancé dans un projet audacieux, nom de code : Quantum (la blague ne marche qu'en France). Objectif : reprendre de vitesse le Chrome de Google. Un retour en avant car le terme chrome désignait à l'origine l'interface de Firefox.
Le travail est titanesque : ré-écrivant des parties importantes de son navigateur, en passant à Rust, un langage bas niveau conçu pour éviter les bugs fréquents, et surtout en virant un nombre impressionnant de technologies dont les buts furent atteint par d'autres technologies standardisées. C'est le cas du vénérable XUL (le langage qui décrivait le chrome, l'interface graphique de Firefox), hélas,… mais pas tant hélas.

Mais cela voulait aussi dire abandonner Jetpack, et donc devoir faire un nouveau portage, dans le format Web-Extension.
Web-extension est standardisé par le W3C. Cela veut dire qu'un add-on Firefox est utilisable quasi tel quel par Chrome, Opera, bientôt par Edge et d'ici 10 ans, peut-être par Safari…
Que du bonheur !

J'ai donc ouvert un ticket sur le repo.
Ce bug, je me l'étais écrit comme mémo, en me disant que je ferais ce travail le week-end suivant où à la prochaine nuit d'insomnie.

C'est là que la magie de la communauté opère

À ma grande surprise, 6 heures plus tard, un individu du pseudo de Makyen, m'annonce qu'il a déjà effectué ce travail et qu'il a même corrigé quelques bugs.

Quelqu'un avait déjà fait le travail ! Je n'avais plus qu'à merger sa contribution, ajouter un script de packaging et l'envoyer sur le site des add-ons de Firefox.

Ben voilà, ce petit projet sans prétention, purement égoïste, se trouvait être utile pour d'autres personnes, au point que certains étaient prêts à me donner un coup de main pour le maintenir à jour. Pourtant, je savais que cela pouvait m'arriver, mais la surprise fait chaud au cœur.

Thank you a lot, Makyen !

Et n'oubliez pas : vous pouvez toujours aider un projet open-source. Pas forcément en codant, mais simplement en aidant au design, en écrivant la doc, des tutos, en aidant à répondre aux questions des gens perdus. N'hésitez pas !

Oh ! Une dernière chose !

Je suis actuellement sur Firefox Nightly (57), et je peux vous dire que d'ici deux mois, vous allez être décoiffés par le gain de vitesse de Firefox. Ils ont viré plein de vieux trucs, retravaillé une partie du reste, et le coup de boost s'en ressent !

Un TEDx en uniforme d'opérette

Da Scritch — 2017-06-14T12:36:00+02:00

Ce samedi, je me retrouve sur la grande scène du TNT (Théâtre National de Toulouse), en représentation unique. Et prochaine cryptoparty en mode atelier au bar le Zinzolin, le Mardi 27 Juin à 19h.
Sortons

Cryptoparty Mardi 27 Juin, de 19h à 23h au bar le Zinzolin (26 rue des Couteliers, métro Esquirol).
Accès libre, venez avec vos questions, on en discutera autour d'un verre.

Oui, j'ai été très flatté d'être invité sur la scène du prochain TEDxToulouse.

Mais je suis malheureusement assez déçu de moi-même : une fois de plus, je reviens sur l'importante des dangers pour nos libertés fondamentales que représentent la surveillance globale et la nécessité d'informer le plus grand nombre via les cryptoparty.

Je suis aussi triste que la question de l'espionnage global n'aie pas été un point important aux Législatives, alors qu'au contraire, et comme d'habitude depuis 15 ans, ce sont les lois prônant cette surveillance généralisée que nos dirigeants poussent à faire passer. Car cette loi est trop confortable pour certains : elle permet de surveiller et d'intimider les voix contraires. Et tant pis pour le risque grandissant de voir de tels armes tomber dans des mains extrémistes.

Vous ne me croyez pas ? Que deviendrait notre pays si un pouvoir extrémiste et dictatorial arrive au pouvoir ?

Je vous invite à regarder sur le replay d'Arte le documentaire rencontre « Meeting Snowden » avec Edward Snowden, Lawrence Lassig et Birgitta Jónsdóttir.

Dès le début, les protagonistes commence par une blague : Une poète, un avocat et un geek entrent dans un bar. Ils se posent la question Pourquoi vouloir continuer à croire en la Démocratie ?

Voilà, vous avez une idée de mon sujet. Et si vous n'êtes pas Samedi prochain au théâtre le TNT, les conférences seront retransmises en live sur le site tedxtoulouse.com

Cryptoparty en mode atelier Mardi 27 Juin

Nous avons le plaisir de vous convier à une soirée cryptoparty en mode atelier au bar le Zinzolin, 26 rue des couteliers, métro Esquirol. Mardi 27 Juin, de 19h à 23h.

Nous avons fait beaucoup en mode conférences, nous serons en petits groupes de 4 à 8 personnes, avec un animateur qui aura soit quelque chose à démontrer, soit un sujet à vous expliquer. L'idée est que vous venez avec vos questions, et que nous tentons de vous répondre.

Il est probable que l'on parle de moyens de paiement, de virus, de profilage publicitaire, de chiffrement d'e-mails et de disques durs...

Cryptoparty de Printemps 2017 : Rien à cacher

Da Scritch — 2017-03-08T17:58:00+01:00

Est-ce que vraiment vous n'avez « rien à cacher » ? Quelles conséquences quand les politiques exigent de tout savoir sur vous ? Projection documentaire, débat, conférences, ateliers et démonstrations pratiques ce samedi 18 Mars à l'Utopia Tournefeuille.
Sortons

En résumé : À l'Utopia Tournefeuille, de 14h à 18h, entrée libre et gratuite, accessible à tous, petits et grands

Épisodes précédents : « Citizen Four » (2015) et « Les nouveaux loups du web » (2016).

Pour la 3^ème année consécutive, à l'occasion du week-end ouvrant officiellement le Printemps, nous nous invitons et hackons le cinéma Utopia Tournefeuille pour proposer une cryptoparty la plus informative et accessible possible.

10h : Projection de Nothing To Hide

Projection payante et unique !

Dans son documentaire « Nothing to hide », Marc Meillassoux se pose la question des traces que nous laissons avec nos smartphones. Il revient sur le péché originel du web : la gratuité des services et leur monétisation par la publicité. Cette dernière a construit des outils de traçage dont nos gouvernants se sont emparés depuis 2001 à des fins très peu avouables.

Ponctués d'interventions de qualité (Jérémy Zimmermann qui co-fondât la Quadrature Du Net, Louis Pouzin dont les travaux sont à la base d'internet et Isabelle Falque-Pierrotin qui préside la CNIL). Le fil conducteur est une expérience : installer sur le smartphone d'un volontaire une application traçant son activité comme le font la plupart des traceurs inclus dans la majorité des applications mobiles, et demander à 2 spécialistes ce qu'ils peuvent deviner de la personne à partir des données récoltées.

À l'issue de la projection de ce documentaire, un débat avec le public sera animé par les participants à la cryptoparty. N'hésitez vraiment pas à poser vos questions, nos réponses profiteront à tous.

Très bonne nouvelle pour ceux qui ne pourront y assister, ce film sera disponible à la vente via Vidéo en poche. Si vous venez, pensez à prendre une clé USB pour le montrer à votre entourage.

Activités de 14h à 18h

Comme pour les éditions précédentes, nous occuperons le hall du cinéma Utopia Tournefeuille pour nos activités. Le hall est librement accessible au public. Et même vous pourrez nous payer à boire au bistrot à côté. N'hésitez pas à nous aborder ! Il y aura des mini-conférences, des démonstrations, des ateliers pour toutes et tous et une install party.

Mini-conférences

Comme à notre habitude, nous feront des mini-conférences selon notre format 5'+15' : Nous vous présentons un sujet en 5 minutes, et vous nous posez vos questions pendant 15 minutes, avec pourquoi pas des démonstrations.

Ces mini-conférences se suivent et se complètent pour permettre de comprendre au final des concepts plus complexes.

Parmi les sujets qui seront explorés (liste susceptible d'être modifiée) :

Qu'est-ce qu'une métadonnée ?
Comment fonctionne internet ?
Pourquoi doit-on chiffrer ?
Qu'est-ce qu'un mot de passe solide ?
Le fingerprinting, ou la ré-indexation des internautes
Sécuriser ses communications
Est-il possible de sécuriser mon ordinateur, même si je n'ai que Microsoft Windows dessus ?
Les petits secrets cachés de son smartphone
Que deviennent nos données à notre mort ? Comment confier mon identité post-mortem ?

Démonstrations

Nous avons la change que Benoît Salles, journaliste spécialisé téléphonie mobile pour Echos Du Net.net, soit parmi nous pour parler des téléphones portables, de ce que peuvent faire les applications et surtout des sales petites manies des téléphones pas chers.

Ateliers avec Combustible

Des membres de l'association Combustible seront là pour des ateliers d'initiations pour petits et grands sur la programmation ou la protection de la vie privée. L'association Combustible est spécialisée dans la médiation du numérique auprès des publics ados et seniors, via des outils comme Makey Makey et Scratch. L'idée est que la rencontre soit amusante, instructive et donne envie de mieux comprendre son ordinateur.

Ces ateliers permettent aux parents de profiter des mini-conférences, tout en ouvrant de nouveaux univers aux enfants. Idéal pour venir nous voir en famille !

Install party Linux avec Toulibre

Outre leur annuel Capitole Du Libre, l'association Toulibre organise régulièrement des Install Party ouvertes à toutes et à tous pour répondre à vos questions :

Qu'est-ce que Linux ?
Qu'est-ce qu'un logiciel libre ?
Comment s'en servir ?
Comment l'installer ?
Comment le maintenir ?
~~Comment je branche le lave-linge dessus~~
…Et même comment y participer !

Vous pouvez venir avec un ordinateur portable, une clé USB, ou même les mains dans les poches !

Cette install party est un classique de notre rendez-vous annuel, puisque Toulibre fut à l'initiative de la première Cryptoparty de Printemps à Tournefeuille. Si vous ne pouvez venir ce samedi, et que vous êtes intéressés par l'univers du logiciel libre, sachez que nos héros de l'association Toulibre organise des rendez-vous réguliers un peu partout sur l'agglomération toulousaine, donc surveillez régulièrement leur agenda.

Les autres cryptoparty à venir

Pour ma part :
Le vendredi 7 avril à 19h au Cinéma Au Fil des Arts à Prémian (Hérault), aura lieu la projection des web-documentaires « Do Not Track » par Brett Gaylor. Elle sera suivie d'une cryptoparty (format mini-conférences) et d'un pique-nique nocturne.
Prémian est à environ 20 km de Béziers, si vous avez l'occasion, n'hésitez pas à venir !

Peut-être il y en aurait-il une au THSF, et sûrement une autre d'ici Juin...

CPU Ex0049 Bonjour à toi, Enfant du Futur Immédiat : Maréchal-ferrant moderne

Da Scritch — 2017-02-28T12:38:00+01:00

En introduction à l'interview de Babozor, de la Grotte du Barbu, ce moment tellement nostalgique sur les villages d'antan qu'il m'a fallut retravailler le texte plusieurs fois pour éviter qu'on me prenne pour un maréchaliste.
Radio

Ceci est une partie du script de la release Ex0049 du programme CPU, diffusé le Jeudi 23/02 à 11h. Plus d'infos sur le site de l'émission.

Bonjour à toi, Enfant du Futur Immédiat, toi qui cherche qui pourrait reconstruire le support de tes petites roues.

De nos jours, les fablabs sont vus comme un concept novateur,... je me gausse !
Le fablab, ce lieu où l'on met à disposition les outils de conceptions dans les mains de bricoleurs profanes, le fablab, donc, est un concept qui a toujours existé.

Avant les grandes villes, il y avait les petites villes. Revenons au temps où Paris s'appelait Lutèce et tenait sur l'Île de la Cité, alors que Toulouse allait de la rue du Taur à la place du Parlement (mais insister sur le fait que notre belle ville rose était vachement plus grande que la capitale du Nord serait peut-être du chauvinisme).

Au temps de nos ancêtres les Gaulois (désolé, mais cette rubrique n'a pas été ré-écrite sous le filtre de la pluralité culturelle)... Donc nos ancêtres, dans chaque village, avait son homme à tout faire, et surtout battre le fer.

On l'appelait le Maréchal-Ferrant.

Et à l'époque, il frappait le fer dont on faisait les glaives, l'acier dont on faisait les chaines, la fonte dont on faisait les marmites, l'airain dont on faisait le bouclier arverne, le bronze dont on faisait les sesterces, les bardes quand ils faisaient du tapage et les poissonniers quand la DLC du produit faisait tilter son sens olfactif de l'hygiène. Oui, ils étaient déjà des hommes à tout faire, notamment la police municipale. D'ailleurs, il se murmure qu'à Béziers, Robert Ménard veut réinstaller une forge/salle d'interrogatoire à côté du laboratoire de la police scientifique qui analyse les ADN des crottes canines.

Aucun rapport : ma vanne était gratuite.

De l'eau a coulé sous le Pont-Neuf, il y eu la Révolution Industrielle, et le regroupement des industries dans un autre village qu'on appelle Le Cac Quarante.

Reconnaissons-le, les petites villes qui avaient leurs petites usines ont dépérit, quand ces industries furent fermées et délocalisées à plus de 100km. Faute d'emplois, les couples avec enfant déménagent, les écoles ferment, les commerces et services aussi. Restent pour les habitants qu'un lointain souvenir du marché couvert qui ne désemplissait pas, et parfois la Dépêche Du Midi livrée dans leur boîte aux lettres, le jour où le facteur dessert le canton. Oui parce que ni la téléphonie mobile ne passe, ni l'ADSL, et y'a plus personne pour savoir pourquoi les décodeurs TNT ne marchent plus. Quand au temps de rétablissement d'une coupure électrique, il est encore digne des années 1960s : parfois plusieurs jours...

Alors oui ! Les fablabs ruraux sont des paris de désenclavement, comme les municipalités qui paient l'aménagement d'un cabinet médical ou un miracle religieux pondu par les grenouilles de bénitier comme opération touristique.

Et rien que là, je viens d'envoyer tellement de clichés que notre invité doit avoir la main qui le démange de me foutre une torgnole, afin de me rappeler à la réalité des campagnes et que même maréchal-ferrant moderne, il a de la poigne.

Tout n'a pas disparu des villages :

Il reste des mécaniciens, des charpentiers, des électriciens et des rebouteux de Windows... Et ces gens-là ne voient pas forcément d'un bon œil une concurrence supplémentaire. Or, un village, c'est une communauté, un microcosme... Et beaucoup de susceptibilités à ménager.

Enfant du Futur Immédiat, créer un hackerspace ou un fablab est toujours un défi : celui de trouver les bras, le matériel, les locaux et le financement. Ce défi est encore plus ardu quand le porteur du projet vient de s'installer dans une communauté réduite. Mais si ce défi n'est pas tenté, jamais nous ne pourrons dire si la greffe prendra un jour.

CPU lit le Bulletin de Santé d'Internet par Mozilla

Da Scritch — 2017-02-22T06:04:00+01:00

Dernier volet sur trois. Avec le sommaire complet vers les sonores découpés. Allez-y, vous pouvez reprendre pour une diffusion !
Radio

Ci-inclus l'émission release Ex0048 du programme CPU, diffusé le Jeudi 16/2 à 11h. Plus d'infos sur le site de l'émission.

Si vous suivez notre émission via un lecteur de flux et que celui-ci est encore lié à ce blog, je vous recommande de basculer votre abonnement vers le site de l'émission.
C'est gratuit, sans pub, ni spyware.

Durant nos 3 précédentes émissions, nous avons lu par chapitres la version 0.1 du Bulletin de Santé d'Internet, dossier passionnant écrit, traduit et édité par la Mozilla Foundation. Nous remercions amplement les salariés et bénévoles qui nous ont permis d'adapter leur précieux travail. Il nous a semblé important de le faire, même si nous avions déjà ouvert ou couvert plusieurs thématiques. Parce que le travail de cette communauté à l'échelle mondiale donnera toujours un éclairage très différent sur les sujets tels que nous aurions pu les traiter.

Découpage par chapitres

Texte en anglais	Texte en français	Version sonore
How do we measure Internet health?	Comment mesurer l'état de santé d'Internet ?	sonore
Open innovation / Innovation ouverte
How open is it ?	C'est ouvert ?	sonore
People powered phones within range	Déploiement d’un réseau mobile communautaire	sonore
Your selfie at the Eiffel Tower	Votre selfie devant la tour Eiffel	sonore
Digital inclusion / Inclusion numérique
Who is welcome online ?	Qui est le bienvenu en ligne ?	sonore
Inside an Internet shutdown	Vivre une coupure d'accès à Internet	sonore
When the Internet doesn’t speak your language	Lorsqu'Internet parle une autre langue	sonore
Decentralization / Décentralisation
Who controls the Internet ?	Qui contrôle Internet ?	sonore
Building a better blockchain	Construire une meilleure chaîne de blocs	sonore
Giving artists control of their music	Redonner aux artistes le contrôle de leur musique	sonore
Privacy and security / Vie privée et sécurité
Is it safe and secure ?	Est-ce sûr ?	sonore
Dutch pranksters turn surveillance into art	De la surveillance à la création artistique	sonore
Let’s Encrypt: Making the Web safer	Un Web plus sûr avec Let's Encrypt	sonore
Web literacy / Éducation à Internet
Who can succeed online ?	Qui peut réussir en ligne ?	sonore
Teaching encryption in Harlem	Enseigner le chiffrement à Harlem	sonore
Why don't more women code ?	Pourquoi coder n'attire pas plus de femmes ?	sonore

Chacune des rubriques a été découpée sans les parties musicales ou identification à notre programme. Les sonores présentés ci-dessus sont donc redistribués en licence Creative Commons, Share Alike, By Mozilla. Texte adapté et lu par l'équipe de CPU : Gael Cérez, Virginie Vandeville et DaScritch, avec les moyens techniques de Radio <FMR>

La radio, c'est un sacerdoce

Da Scritch — 2017-02-13T17:53:00+01:00

Dans une radio underground, on fait tout pour que “ça marche”, même en cas d'inondation... Vous étonnez pas si on sonne pas toujours aussi bien que les “Grandes Radios”.
Radio

Mardi de la semaine dernière, Enflammée fut invitée au micro de Nostalgie Toulouse afin de parler de la nouvelle édition du Guide Michelin (ils doivent savoir que nous avions le nouveau palmarès en avance). Celle-ci s'est évidemment fait une joie de me faire râler sur leurs studios.

Elle n'a pas pu s'empêcher de me ~~troll~~ nananériser en m'envoyant des photos

Wouaaaah ! Ce micro est hyper-sensible, on entend tout !

Bien sûr que ce micro est hyper-sensible ! Un Neumann à trois chiffres avant le symbole €, sans compter la batterie de matériel derrière genre pré-amp à lampes et compresseur dbx, ça assure, surtout face à des pauvres Shure SM48 qui ont traversé tempêtes sans bonnettes.

Pendant ce temps là, le Mercredi, j'avais rendez-vous avec Gaël et Virginie pour enregistrer deux numéros de CPU, et un poil en urgence vu nos agendas respectif. Hélas, personne à la radio (que j'avais pourtant contacté à midi) ne m'avait prévenu qu'un vernissage était prévu, avec sonorisation. Notre studio de production habituel étant inutilisable, j'ai dû ressortir l'ancienne régie finale du placard en catastrophe, et j'ai eu la change de tomber sur notre régisseur Gabriel sur le départ, pour me fournir cable d'alim, micros, multicasques, enregistreur… bref un montage en catastrophe d'un studio de secours dans la cave mal isolée de la radio, et en moins de 15 minutes (et heureusement que j'ai une mallette avec des fournitures de secours genre bonnettes).

Note pour plus tard : en plus du petit carnet de direct, prévoir la lampe frontale

Étonnement, le ~~bordel~~ ambiant ne s'entend pas trop. La joie de réglages de finalisation un poil… agressifs.

N'utilisez jamais de tels réglages pour une émission musicale !

Mais ça pourrait être pire : je viens d'apprendre que nos amis de Radio Campus Toulouse sont inondés suite à des travaux de voirie, visiblement suite à une absence de filet d'alerte sur la conduite d'eau. Courage à eux !

Ah oui, vous trouverez en PJ notre deuxième émission CPU consacrée au Bulletin de Santé d'Internet car pas mal de gens n'ont toujours pas changé d'adresse dans leur lecteur de podcast, et sont donc passés du Supplément Week-End à CPU. Avec parfois des félicitations, ce qui fait plaisir :)

CPU Ex0046 Bonjour à toi, enfant du Futur Immédiat, comment va internet ?

Da Scritch — 2017-02-06T06:24:00+01:00

Ce texte est en introduction d'une série de trois émissions reprenant le Bulletin de Santé d'Internet v0.1 par la Mozilla Foundation.
Radio

Ceci est une partie du script de la release Ex0046 du programme CPU, diffusé le Jeudi 2/2 à 11h. Plus d'infos sur le site de l'émission.

Bonjour à toi, enfant du Futur Immédiat, et bonne année 2017, même si nous avons un peu de retard....
Nous t'avions promis de ne plus trop parler de politique... mais la promesse ne tenait que pour le domaine national. Car cette année, la plus grande puissance informatique et économique a intronisé comme président un DRH de télé-réalité. On ne va pas se priver de faire un jour un sujet sur les trolleurs.

Parallèlement, la Mozilla Foundation vient de terminer une mue qui a durée une année où sa sa communauté fut invitée à faire des choix. Un nouveau logo, mais surtout une mission revisitée : plutôt que vouloir mettre du web partout, jusqu'à écrire un OS de télé connectée, Mozilla va s'intéresser désormais à défendre des valeurs qui ont construit internet : le respect, l'échange, la neutralité, l'ouverture.

Soyez rassurés, ils font toujours Firefox...

Après avoir dévoilé son nouveau logo à la mi-Janvier, Mozilla Foundation vient de publier un bulletin de santé d'Internet, une initiative au code ouvert et libre visant à documenter et à analyser l’état de santé d’Internet en combinant des études provenant de multiples sources.
Nous, la rédaction de l'émission CPU, avons souhaité adapter radiophonique les 5 chapitres de ce rapport, car ce travail formidable est éclairant sur l'état technique, commercial, culturel et politique de notre planète.

Le Bulletin de santé d'internet 2017, version 0.1, est publié par Mozilla sous licence Creative Commons, avec attribution et partage dans les memes conditions.
À l'exception des parties musicales, cette émission est distribuée avec la même licence.
Cette émission est l'adaptation du texte original. Les vues et opinions exprimées dans notre programme sont de notre responsabilité et ne sont pas approuvées par Mozilla.

Pour quelques cryptoparties avant les présidentielles

Da Scritch — 2017-01-17T13:45:00+01:00

Les candidats à la mandature suprême vont nous faire une surenchère à la comédie sécuritaire. Et si on remettait le respect de la vie privée dans le débat des présidentielles, histoire de montrer qu'on ne va pas se laisser convaincre ? Deux cryptoparties/chiffrofêtes et un colloque sur les dystopies sont déjà au programme.
Sortons

Plusieurs événements sur la vie privée sont à venir, l'occasion d'expliquer au plus grand nombre.

Samedi 28 Janvier, Cryptoparty au Bar Le Farfadet

Comme nous avions fait en 2014, le 28 Janvier sera la Data Privacy Day, une journée mondiale pour la vie privée, en hommage à Aaron Swartz. Des cryptoparties un peu partout en France, dont à Paris, Lyon et Bordeaux. Et la question devient d'autant plus importante vu qu'à Washington, Orange is the new Black ne fait rire personne au vu des risques majeurs sur la vie privée.

Pour Toulouse, comme on sera Samedi, nous ferons étape dans l'après-midi, entre 16h et 19h au bar Le Farfadet, dans une formule entre café vie privée et mini-conférences.

Si vous êtes capables d'expliquer ce qu'est qu'un cookie ou pourquoi il faut des mots de passes différents, vous pourrez sûrement aider bien des gens à regagner leur vie privée !

Page de l'événement sur l'Agenda Du Libre, et autres événements liés à la même journée.

Le Farfadet, 19 bis rue du Faubourg Bonnefoy. Métro Marengo, Bus 38, 39, 42 arrêt Arago.
Énorme merci aux organisateurs de l'événement bordelais pour l'affiche !

Mercredi 1er Février, Journée d'échanges Dystopies de la communication

Le master de design de l'Université Jean-Jaurès (Toulouse III) prépare une journée de conférences ouvertes au public, sur les dark patterns, les designs de résistance, etc... Une journée d'intervention sera ouverte au public à la fac du Mirail, Amphithéâtre 3, bâtiment Olympe de Gouges.
Au programme :

9h30 : présentation
9h50 : La cryptographie à travers l'histoire (par votre serviteur). Où l’on parlera démilitarisation, amants infidèles, transferts monétaires, militantisme et escroquerie...
10h50 : Tactical Hacking - Communiquer en milieu périlleux (par Jules David, Ingénieur au CNES). Où l’on parlera de code morse, de satellites, de drones, de raspberry-pi et de laser...
14h : intervention de Mélanie Bourdaa, Maître de Conférences en Sciences de l'Information et de la Communication, Université Bordeaux-Montaigne, ISIC
15h20 : intervention de Yoan Richard, Artiste. De la condition des images avant qu'elles ne se forment : flux électrique (circuit bending) soit le l'encodage des données (data bending)

Mon intervention sera orientée histoire et impacts pour le public, et il n'est pas dit qu'elle sera triste…

Samedi 18 Mars : 3^ème Cryptoparty de Printemps à Utopia Tournefeuille

Pour la 3^ème année consécutive, les cinémas Utopia de Tournefeuille nous accueille avec l'association Toulibre et l'association Combustible pour organiser conférences et ateliers.

Nous aurons la chance d'avoir le documentaire « Nothing to hide » à présenter pour ouvrir les débats.
Nous voyons aussi avec le cinéma Utopia pour rediffuser des films (notamment « Citizen Four ») et avoir un programme de courts métrages. Et fait, je réfléchis à l possibilité de pirater les projecteurs des autres salles, mais ne leur en parlez pas ;)

Pourquoi faisons-nous ça ?

J'ai eu la chance de m'en expliquer devant le tribunal populaire de Paris Web.

CPU Ex0044 Bonjour à toi, Enfant du Futur immédiat : Qui est “root” ?

Da Scritch — 2016-12-02T13:23:00+01:00

ROOOOOOOOTS ! BLOODY ROOOOOOOOOOOOOOTS !
Radio

Ceci est une partie du script de la release Ex0044 du programme CPU, diffusé le Jeudi 1/12 à 11h. Plus d'infos sur le site de l'émission.

Bonjour à toi, Enfant du Futur Immédiat, toi qui télécharge plein de trucs sur internet et qui après se plaint de se retrouver avec plein de malwares qui pourrissent ta bécane.

Dans internet, il y a réseaux, et dans une typologie de réseaux, il y a les clients, c'est à dire toi avec ton ordinateur ou ton smartphone et des serveurs qui sont d'autres ordinateurs généralement nichés dans des datacenters. Bon, je schématise, mais commencez pas à me prendre la tête avec les détails sinon les gamins vont fuir.

Tout est dans cette relation client/serveur. Et parmi ces serveurs, il y a ceux qui sont totalement accessoires, et des serveurs qui sont vraiment important. S'ils sont compromis, tout internet tremble.
Par exemple, il y a les serveurs d'infrastructure, comme ceux gérant les noms de domaines, les DNS. Il y a les serveurs de services, du type Google, et il y a le serveurs qui distribuent des logiciels, comme ceux de Microsoft, d'Apple ou les distributeurs de système Linux.
Si un de ces serveurs sont compromis, ce sont des centaines de millions d'ordinateurs de part le monde qui pourraient être compromis.

Quand tu construis un logiciel qui devient important pour des millions d'utilisateurs, administrer un serveur devient donc une responsabilité qui est bien plus importante que celle du projet qu'il héberge : il peut faire tomber une infrastructure, tolère le moins de pannes possibles et demande une bonne rigueur de gestion pour son suivi.

Tout le problème, c'est de se rendre compte quand ta responsabilité te dépasse, quand le projet que tu héberges est devenu si important que tu ne peux plus te permettre du tout d'avoir le moindre souci sur les serveurs. Et là, il te faut une équipe de durs, de tatoués, d'administrateurs systèmes. Ce genre de gus dans un garage à ne pas avoir la main qui tremble quand il faut faire un reboot après une mise à jour. Le genre de personnes qui te disent NON si tu veux installer un serveur d'e-mails là où tu mets aussi ta base de données, ceux qui te retournent une claque si tu veux installer le wordpress du petit neveu sur ton serveur en production.

Oui, l'administrateur système de ton réseau peut sembler dur, mais il est à la racine de a sécurité.

C'est pour ça qu'on l'appelle root

Et root peut parfois se montrer gentil, laisser des privilèges et s'occuper de tout le reste et parfois faire feu de tout bois.

Alors oui, normalement, on peut facilement devenir root sur son ordinateur, et donc choisir qui deviendra root à ta place sur un serveur est une relation de confiance qui se noue dans la durée. Vous derrière , vous noterez que je n'ai pas dit relations BDSM, à cette heure-ci, il y a des enfants qui nous écoutent.

Mais revenons à nos gros serveurs et nos tests de pénétrations. Gérer une flotte de serveurs n'est pas simple, même si nous avons des outils de gestions qui simplifient la tache : la virtualisation d'infrastructure sur le cloud, la containerisation d'application via Docker ou encore les scripts d'administration de flotte tel Ansible.

Il y a aussi les gestions de mise à jour, les montées en version de logiciels, tout cela peut être fait d'une manière plus ou moins stable en fonction de l'existant. Et bien évidemment, il y a le rapport risques/bénéfices, l'équilibre subtil où le gain est tellement minime par rapport à l'investissement pour le petit chouia de sécurité en plus, qu'il peut compromettre l'équilibre du projet qu'il héberge.

Enfant du Futur Immédiat, un root se montre d'un bois solide mais flexible à la fois. C'est lui qui fait que l'arbre ne flanche pas complètement quand le sol se dérobe. Et crois-moi qu'une telle situation peut arriver à n'importe quel moment. Il faut tenter de l'éviter, et se préparer à y être confronté. Déléguer root sur son serveur si important, c'est s'assurer de meilleures nuits de sommeil.

CPU Ex0029 Bonjour à toi, enfant du futur immédiat : Hacker festif

Da Scritch — 2016-05-19T16:21:00+02:00

Réfugiés au fond du duplex du Tetalab, le Double-Dragon 2, notre émission en direct présente le programme du THSF, mais bien évidemment précédé de son monologue...
Radio

Ceci est une partie du script de la release Ex0029 du programme CPU, réalisé en direct le Jeudi 19/05 à 11h. Plus d'infos sur le site de l'émission.

Bonjour à toi, Enfant du Futur Immédiat, toi qui, je le sais, vient de planquer sous ton matelas un catalogue de composants électroniques.

Il y a 15 jours, nous te parlions du Fablab Festival. Aujourd'hui, nous sommes en direct depuis Mixart Myrys pour la 7^ème édition du THSF. Oui, j'ai bien dit en direct, c'est la première fois que CPU ne sera pas diffusé en simultanée entre la radio et le podcast.

Le THSF est l'abréviation du Toulouse Hacker Space Factory ; cette 7^ème édition est, comme les années précédentes à l'initiative du hackerspace Tetalab et de l'espace artistique autogéré Mixart Myrys. Et les festivités auront lieues comme d'habitude à Mixart Myrys, cette année entre le Jeudi 19 et le Dimanche 22 Mai 2016. Et donc c'est un festival qui met en avant la culture hacker et les hackerspaces.

Alors certes, un hackerspace est un endroit de bricole encore plus garage qu'un fablab. Ici, il est moins évident d'y trouver des machines industrielles de fabrication, et on travaille plus sur le bricolage et le détournement. Ainsi, dans une vidéo éducative réalisée par le Tetalab, on a découvert ce que donne une machine à laver en action en plein nuit, chargée avec les boules à LEDs.

Ben c'est vachement joli !

Ce sont aussi les mêmes qui ont remarqué qu'en branchant une Renault Twizi sur du 720V, ben il recharge nettement plus vite. Bon, il est vrai que les batteries chauffent tellement que l'habitacle commence à fondre. Mais on ne va pas s'arrêter à de si menus détails...

Des hackerspace sont nettement plus prestigieux et outillés qu'ils ont l'ambition de mettre un grand B à Bricole. Ainsi, de joyeux et entreprenants drilles qui fréquentent l'Electrolab, sis à Paris sont partis dans l'idée de construire un accélérateur à particules. Bon, il se trouve que projeter des particules de matière à très haute vélocité... définisse juridiquement une arme. Et donc les joyeux constructeurs vont devoir passer un permis de port d'arme... Je ne sais pas si vous avez déjà tenté de braquer une banque ou d'envahir un pays avec un accélérateur à particules, avant de générer un trou noir, vous avez intérêt à en tourner, des bobines à supraconduction...

Oui, un hackerspace peut devenir une arme. Et ça, les autorités égyptiennes l'ont très bien compris. Ainsi Tarek Ahmed sera présent ce soir pour raconter les déboires du hackerspace du Caire : plusieurs descentes de polices et un effondrement apparemment spontané de l'immeuble qui abritait le Cairo Hackerpsace. Mais, résilience des hackers oblige, ils ont réussi à monter un nouvel hackerspace qui tient dans une grande camionnette.

Alors oui, le hackerspace est une arme car il redonne le pouvoir de créer. Et depuis le container du Tetalab, désormais devenu un duplex, on a vu des choses peu conventionnelles comme le body-bouddhisme, un pong en led à 1 dimension et un casque d'immersion en réalité réelle pilotant une caméra de surveillance piéton...

Enfant du Futur Immédiat, le plaisir du THSF tient dans sa désinvolture. Ce festival n'a pas pour ambition de faire du lobbying politique, mais d'échanger et d'improviser en continu. Il y aura donc ce week-end des ateliers, des bricolages, des conférences, des performances artistiques, des concerts.... Et nous même où nous enregistrerons 4 programmes ce week-end.

CPU Ex0026 (O.S. Souverain) Facture et fait du prince

Da Scritch — 2016-04-15T12:36:00+02:00

Tu veux un O.S. Souverain ? Mais pas de soucis : imagines-tu seulement le temps et l'argent nécessaire avant d'arriver au Minimum Viable Product ? Et au final pour en faire quoi ? Le même outil qu'en Chine et en Corée Du Nord ?
Radio

Ceci est une partie du script de la release Ex0026 du programme CPU, diffusé Jeudi 14/04 à 11h. Plus d'infos sur le site de l'émission.

Bonjour à toi, Enfant du Futur Immédiat, toi qui nous écoute sûrement avec un ordinateur dont le système d'exploitation est conçu à l'étranger, géré par des sociétés ou des fondations américaines, donc forcément suspectes.

Le premier logiciel que charge un ordinateur à son démarrage est un bootloader, même dans un smartphone, console de jeu ou routeur wifi. Un bootloader est un logiciel qui va choisir et charger l'environnement que tu vas utiliser, puis il va lui passer la main.

Ce qui est la base sur lequel repose tout cet environnement est le système d'exploitation. Il a en charge de discuter avec le matériel, de gérer les fichiers, de donner la main aux différents logiciels qui sont lancés et de protéger les données de chacun.
Or, le fait que l'ordinateur soit contrôlé par un logiciel qui a été conçu hors du contrôle juridique français titille certains élus politiques. Et donc, profitant des discussions parlementaires du projet de loi « pour une République Numérique » un article 16 ter a été rédigé, demandant [d'étudier la faisabilité] de construire un système d'exploitation Frrrrançais, utilisant des algorithmes de chiffrement dûment contrôlés et certifiés NF.

Loin de nous de nous moquer d'une telle idée, issue de l'Assemblée Nationale. 575 élus du Peuple ne pourraient se tromper.
Non
On ne va pas rire

AHAHAHA ! Faire un OS Souverain !

Non mais, vous vous rendez compte du travail ?

Dire que ladite proposition nous a laissé perplexe de rire est encore en dessous de la vérité. C'est même suite à cet amendement que nous avions décidé de réouvrir le lourd dossier sur l'informatique d'initiative nationale, avec le fameux Cloud Souverain de sinistre mémoire.
Dans ce deuxième chapitre, cette heure sera donc exclusivement consacrée à en faire le devis.

Oui, un devis

D'abord, prenons le noyau du système d'exploitation, aussi nommé techniquement le kernel. Un kernel est le logiciel qui est à la base de tout, gère les abstractions, ouvre les canaux de communications avec le matériel, le réseau et entre les logiciels. C'est aussi lui qui distribue le temps de fonctionnement entre chaque logiciel.
En 2008, la Linux Foundation estimait le coût de développement du kernel Linux à 1,4 milliard de dollars si ce kernel avait été écrit par une structure commerciale. Sachant qu'en 8 ans, il y a encore eu de très nombreuses améliorations à ce kernel et que ce coût prend compte l'effort entre 1994 et 2008, on peut facilement l'estimer actuellement à 2 milliards de dollars.

Ensuite, il y a les utilitaires systèmes tels que les drivers qui permettent de gérer un écran ou une imprimante, ou ceux qui aident à gérer le système de fichiers et les bibliothèques qui regroupent les éléments primitifs utilisés par la plupart des logiciels. Sous Linux, toujours, on fait appel aux utilitaires de la distribution GNU, mais il y a aussi les drivers matériels écrits par des fabricants comme ARM, Sony ou NVidia. Les services de chiffrement de données pour les communications sur internet sont soutenus par OpenSSL. Apple soutient depuis 20 ans le service d'impression appelé CUPS...
Si nous devions mettre tout ensemble, on peut estimer facilement l'effort comme étant le double. On arrive donc à 2 + 4, environ 6 milliards de dollars.

Ensuite, si tu utilises un affichage fenêtré, de multiples drivers graphiques s'ajoutent encore, ainsi que la gestion de l'environnement de bureau, son design, la gestion du clavier, et surtout de la multitude de cartes graphiques et de résolution d'écran... Je te fais grâce de la traduction dans une autre langue que le Français, on devrait là aussi arriver à 4 milliards de dollars.

Donc, pour avoir un système d'exploitation de base, sans client e-mail, sans base de données, sans aucune suite bureautique, ni navigateur web, ni lecteur de média et même pas de jeu de patience ou de démineur... Le total de la douloureuse avoisine les 10 milliards sans compter la TVA, sans pouvoir en faire quoique ce soit, puisque le pare-feu Open Office pour protéger Albanel des cyber-rhumes n'est même pas là.

Et pour vous donner l'exactitude de mon analyse, le site Numérama a fait la même estimation de son côté à environ 1 Milliard. Seulement, comme l'exécution du projet sera forcément confiée à nos Glorieuses Nationales SSII, leurs commerciaux multiplieront par 10 la facture, et le débordement prévisible sera par 5.
Tant qu'il y a de l'argent public, il y aura des bénéfices à redistribuer aux actionnaires.

Mais soyons honnêtes : des systèmes d'exploitations hexagonaux, on en a eu. Depuis le Plan Calcul en 1966, nous avions de grands constructeurs informatiques nationaux comme Thomson, Alcatel, La Radiotechnique, Goupil, Honeywell Bull et la Compagnie Internationale pour l'Informatique. Mais à l'époque, les ordinateurs n'étaient pas forcés de communiquer avec le reste du monde. On vivait bien à l'abri des tempêtes de virus et de cyberguerres sur notre atoll, tous bronzés à Muruoa ; les ordinateurs Bull Micral carburaient au Prologue, et les Thomson MO5... ah ben non, lesdits Thomsons avaient bien un OS national, mais le basic était signé Microsoft.
Ahem. Démonstration par l'absurde que SuperDupont me savonne...

Finie l'époque d'un particularisme national digne des phares jaunes et des télés Secam ! De nos jours, qui peut concevoir un ordinateur sans échanger entre nous des documents textes ou des feuilles de calculs, sans croiser des bases de données, au final sans internet ?
L'ère de la culture informatique cocoricocardière et isolationniste, elle a fait long feu de subventions publiques.

Or, de nos jours, un service qui dépend du Premier Ministre, l'Agence nationale de la sécurité des systèmes d'Information (ANSSI), offre CLIP, une distribution Linux revue et annoncée comme sécurisée. Oui, l'article 16 ter a été rédigé en totale méconnaissance de ce qui se fait déjà, mais peut-être que la députée PS Delphine Batho à l'origine de l'amendement, souhaitait que l'OS en question porte son nom. Comme ça, on ne dira plus que Windows est cassé mais que Batho a coulé.

Enfant du Futur Immédiat, à l'heure où nous enregistrons cette release, le Sénat vient de retoquer l'article en question. Néanmoins, comme nous sommes assurés qu'on va probablement encore entendre parler longtemps de cette idée farfelue après le vote de la Loi République Numérique le 3 mai, il te faut retenir cette fable digne de La Fontaine : ce n'est pas parce que le client dit que c'est possible qu'il connaît ton métier.