Monthly Shaarli

All links of one month in a single page.

November, 2023

Accessibility of the section element | scottohara.me

A section tag start to be a generic région only when it is labelled. It provides semantics, but nothing else out of the box.

As developer it increase readability and allow to quickly set a specific landmark when needed.

Why SQLite may become foundational for digital progress | VentureBeat

“I ran a database company before this and I think the thing people like me never want to talk about is just about everyone has a few sub-10 gigabyte databases.” said Kurt Mackey, the CEO of Fly. “If you’re really in that category, you know this is super interesting because it’s SQL and it’s amazing for 10 gig databases.”

“[There’s] no need to get a database server up and running (or a docker container). It’s just a file. You can even send the database file to a coworker if you need some help with something.”

The software runs very fast without performance glitches, but there aren’t the same number of tools that can help support it. [...] I think the biggest complication for us is that there’s no tooling for it.

#idea #project

Markets To Build In (2019)
10 Weird HTML Hacks That Shaped The Internet
CSS { In Real Life } | Radial Gradients and CSS Trigonometric Functions

Using radial gradients to create shapes. They are similar in some ways to svgs.

CSS { In Real Life } | Preventing Scroll “Bounce” with CSS
:root {
  overscroll-behavior: none;
}

A codepen demo https://codepen.io/michellebarker/pen/vYbrpbX

A Few Ways CSS Is Easier To Write In 2023 — Smashing Magazine

CSS has gotten easier to write than it is different to write.

  • use :is to group multiple selectors such as a:hover and a:focus
  • using logical properties instead of marg
  • margin-trim can help by removing the last margin child element of a list for example. It is experimental, so Flexbox with the gap property
  • aspect-ratio to set only one dimension between the height and the width, while keeping proportions
  • .card:has(:hover, :focus) is easier and straightforward than a.card-link:hover > .card
  • an easier way to define color palette with --gray-dark: color-mix(in srgb, var(--primary-color), [#fff](./add-tag/fff) 25%);. It is more maintainable!
  • ch for managing line lengths; text-wrap: balance is a work in progress (65% of users can use it)

and more with cascade layers, container queries, <selectmenu> and CSS nesting

Famileo, le journal familial qui fait le bonheur des grands-parents

Envoyer à rythme régulier un magazine avec des photos à ses membres de la famille. Cela est surtout utile aux personnes absentes des réseaux sociaux et messageries en ligne.

Infographie des premières indentifications 2022

Les autres publications (infographies et baromètres) sont disponibles à l'adresse https://www.i-cad.fr/articles/publications

Icad - Accueil
Things you're allowed to do

This is a list of things you’re allowed to do that you thought you couldn’t, or didn’t even know you could. I haven’t tried everything on this list, mainly due to cost. But you’d be surprised how cheap most of the things on this list are (especially the free ones).

Split into categories:

  • Learning & Decision making
  • Interpersonal
  • Support and accountability
  • Making the most of your resources
  • Professional

Write on a post-it note affixed to a greeting card rather than on the greeting card itself, so the recipient can throw away the post-it and reuse your card.

The author shares many other lists.

CSS { In Real Life } | Why You Should Hold Onto Your Devices For Longer

e-waste is defined as used electronic devices with batteries or plugs that are at the end of their useful life.

The main thing you can do to prevent e-waste is to avoid upgrading unnecessarily and hold onto your devices for as long as possible. If a device is no longer needed, consider selling or donating it, or if it can no longer be used then take it to a recycling facility or return it to the manufacturer.

dbrgn/tealdeer: A very fast implementation of tldr in Rust.

I use it since months and satisfied about it :)

PUCE M3 : Ce dont personne ne parle - YouTube

Effectivement, cela se tient avec la technologie Apple Silicon: si les processus units sont les plus efficients du marché, alors ils sont prometteurs pour faire tourner de l'IA.

Apple livrerait donc l'IA en local; là où Microsoft ou OpenAI passe par le cloud.

Repeat yourself, do more than one thing, and... — programming is terrible
Blog Stéphane Bortzmeyer: Capitole du Libre 2023, et mon exposé sur la censure de l'Internet
Email vs Capitalism, or, Why We Can't Have Nice Things - Dylan Beattie - NDC Oslo 2023 - YouTube

Why emails is a mess? Because there are a lot of email service providers that does not follow the standard...

Kysely | Kysely

A query builder. It can be coupled to Prisma schema for better performance.

As much as I dig into it, I find raw SQL better (or with a SQL builder).

Fire Chicken Webring

An invite-only webring for personal websites.

from the blog post: https://arne.me/articles/we-need-to-bring-back-webrings

Sans le vote des retraités – Carnet de notes

Le danger de cette vision [que le vote de quelqu'un ne se vaut pas] c’est qu’une fois ouverte l’idée que les choix de tout le monde ne se valent pas, on peut les enfon­cer très loin.

7 types de base de données | Pragmatic Nerdz | Wutsi
The experience of being a woman at a tech conf – a WebSummit 2023 recap
html - Is a URL allowed to contain a space? - Stack Overflow

Past a URL and retrieves some information about it.

First: check if the url is "safe"

Pokédon: Read Mastodon on a Pokédex • Robb Knight
Google is embedding inaudible watermarks right into its AI generated music - The Verge

Maybe some tools to remove these watermarks will be developed soon.

No Bing, no Edge, no upselling: De-crufted Windows 11 coming to Europe soon | Ars Technica

To meet the demands of the European Commission's Digital Markets Act—slated to be enforced in March 2024—Microsoft must make its apps easier to uninstall, its default settings easier to change, and its attempts at steering people toward its services easier to avoid.

It includes Bing, default apps, Edge, etc...

Remi Mercier 🏔 in Elk: "I've been wondering a lot about agi..." | Elk

Any > 40-year old developers out there that'd like to share their perspective? How did you grow (technically, managing, etc...)? Picked up fields over others (embeded systems over web app, for instance)?

Responses:

  • I push others to do better without them noticing it
  • Technical skills become obsolete over time but human skills stay relevant. People, values and norms change so you have to relearn them too.
  • Keep learning, write a lot and communicate more.
  • I took every advice on the Internet and did the opposite: playing the pendulum between team lead and dev; more and more a specialist in nothing; being able to talk to stakeholders and convert their input into software is by far my most valued skill; being a former manager means I generally understands my boss pretty well.
  • I do more mentoring than I used to. I learned more about working in teams.
  • I learn that less code is much, much better than more.
  • I don't write many queries any more but I do write PowerShell and Typescript. I don't manage a server, it's hundreds. [...] I've taken on more senior roles by thinking beyond just databases.
  • The more paradigms and patterns you know, the better you’ll be at expressing yourself in your language of choice. Learn as many languages as possible. Don’t grow too comfortable; challenge yourself regularly.

Currently at: https://elk.zone/mastodon.social/@nicklockwood/111280337863596402

Programming is Forgetting: Toward a New Hacker Ethic - Allison Parrish | Open Transcripts

The author proposes a serie of question instead of sentences.

John Doe’s page

This website is a single HTML file. It simply uses the #anchor suffix (from 1992) and the :target CSS selector to show and hide pages/content.

This setup1 is databaseless, javascriptless, and buildshit-free, so you can edit your website with a text editor and upload it somewhere2 like a normal person.

Lost in Translation: Tips for Multilingual Web Accessibility | Ben Myers
  • use lang for the language of the page, then the other parts of the page with a different language
  • support different writing direction. Logical CSS properties help.
  • handle text expansion with adaptive layouts. Avoid to truncate the text.
  • apply a minimum width to avoid text shrinking in other languages. Also think about the height.
  • readable typography is important
  • make sure every user-facing string is translated such as alt-text, title or desc nodes in SVG.
  • different languages have different word order, so avoid string templates
  • ensure consistency of microcopy

    Microcopy is all the little bits of text that appear throughout the site: the nav links, the sidebar headings, the form field labels, stuff like that. When microcopy is written and used consistently, the site layout becomes much more predictable, and users won't have to guess

It means the atoms and some molecules in atomic design.

7 myths designers and developers believe about web accessibility - localghost
  1. The majority of your users don't have access needs
  2. Accessibility is optional
  3. Access needs come from permanent disabilities
  4. Accessibility is a barrier to good design
  5. Accessibility is hard to implement
  6. React apps are inherently inaccessible
    7 Automated testing will catch all accessibility problems
Les outils de surcouche d’accessibilité web : mensonges et boules de gomme - La Lutine du Web
CSS { In Real Life } | CSS Nesting is Here

and ho it differs from SCSS.

URL Lengthener: l62.ng
The Absolute Best Intro to Monads For Software Engineers - YouTube

It explains the Writer monad and the Option monad.

This pattern is used for future or promise by the way.

Quel est l'impact environnemental d'ouvrir ou non les liens dans un autre onglet ? - Greenspector

The browser uses the bfcache technique to handle back and forth in history.

Il semble qu'utiliser un seul onglet soit optimal. Ces différences restent petites.

How we turned into assholes — Joan Westenberg
Please, Expose your RSS

Make it visible :) It can be in the UI for human and the <head> for tools

Sorry Computer, You're Not a Teapot - The History of the Web
Afficher la fréquence du CPU et la température dans htop

It is possible to display the temperature and the CPU frequency with htop. Simply press F2 and enable both in the display options.

10 Minutes Email - E-mail de 10 min jetable
Firefox Development Is Moving From Mercurial To Git
Andrew M McCall - Golang, Javascript, PHP, Wordpress
S/I Webring - About

The idea of this webring is to allow anyone to have a cute little badge on their website that shows their relationship (whether platonic or romantic) with a certain character!

Fushra Pulse · GitHub

Smoothen the fork of Firefox

Bibi-binary - Wikipedia
The beauty of finished software | Jose M.

It’s a reminder that reliability, consistency, and user satisfaction can coexist in the realm of software development.

Hecto, Chapter 3: Raw input and output – flenker.blog – thoughts on stuff, views on things

Just for the expression:

Russian: Killing two rabbits with one shot
German: Killing two flies with one swat
Francais: Faire d'une pierre deux coups

zerocal - A Serverless Calendar App in Rust Running on shuttle.rs | Matthias Endler

Nice: a web service that creates a calendar event from a URL

Skipping skip links ⚒ Nerd

To my surprise they didn’t use skip links when they were presented one. [...] They didn’t understand the purpose of these links.

He explained that when he clicks on a link, for instance to an interesting article about skip links, he expects the first thing he encounters to be the article itself.

Instead of a "Skip to content", a "Skip to navigation" could be better.

Down and to the Right: Firefox Got Faster for Real Users in 2023 - Mozilla Hacks - the Web developer blog
Of Boxes and Trees - Smart Pointers in Rust | Matthias Endler

The author takes the example of a tree structure.

TL;DR; Start with lifetimes, if it is not enough and you don't need a specific guarantee: Box, then go for Rc or Arc if needed.

A Little Story About the `yes` Unix Command | Matthias Endler

How it is optimized to be the fastest possible.

UI Tips for Landing Pages & Apps by Jim Raptis
What Happened To Programming In The 2010s? | Matthias Endler
On Hard Work | Matthias Endler

The dedication, the urgency to reach your aims must come from within you.

Deploy Rust Code Faster | Matthias Endler

The author shares its point of view on Shuttle that needs little to nearly 0 configuration to get started.

Zerocal was the first project I deployed on Shuttle. The principle was very simple yet innovative: encode calendar data directly into a URL. [https://endler.dev/2022/zerocal/]

#project #idea improve the UI or make a custom one that calls the API
#project #idea use such API to generate other files. Contacts?

The New CSS Math: rem() and mod()

We can now calculate the remainder rem() and the modulo mod in css.

We will have to wait a bit though for browser support: https://caniuse.com/?search=rem() and https://caniuse.com/?search=mod()

Pourquoi sommes-nous tellement accros à Google Maps et Waze ?
Don't Use Fixed CSS height or width on Buttons, Links, or Any Other Text Containers | Ashlee M Boyer

Use padding, relative line-height and a flow layout instead.

Les données de l’inventaire forestier national confirment l’impact du changement climatique sur la santé des forêts françaises - Portail IGN - IGN

Pour 2023, l’IFN, véritable état des lieux de la forêt française, révèle des forêts de plus en plus affectées par le changement climatique, avec notamment une accélération de la mortalité des arbres, et une multiplication de crises entraînant un ralentissement du puits de carbone des forêts sur la dernière décennie.

silkenweb - crates.io: Rust Package Registry

This project looks interesting.

  • No VDOM
  • Rust syntax
  • CSS scoping
  • Routing & SSR & SSG
  • Tauri support
  • Htmx integration
Featurize your app
Iconbuddy — 180K+ open source icons
hubblo-org/scaphandre: ⚡ Energy consumption metrology agent. Let "scaph" dive and bring back the metrics that will help you make your systems and applications more sustainable !
Sean Tilley in Elk: "This one is for all the new people on #..." | Elk

The Fediverse has multiple services that provides alternatives:

  • Facebook replacement: Friendica
  • Instagram replacement: Pixelfed
  • YouTube replacement: PeerTube
  • Spotify replacement: Funkwhale
  • MeetUp replacement: Mobilizon
  • Reddit replacement: Lemmy
  • Podcasting replacement: Castopod
  • GoodReads replacement: BookWyrm
Fin du procès des «activistes d’ultragauche» : «Puisque la DGSI vous le dit, c’est que c’est vrai» – Libération
HTML Recipes

Nice to get it right the first time with a minimal example

HTML Tags Memory Test on CodePen

How many HTML tags do you know?

Vous avez perdu 6 mois de fichiers sur Google Drive ? Vous n’êtes pas seuls…
CSS { In Real Life } | Oh No, Overflow!
Julia Evans in Elk: "git discussion bingo card" | Elk

A git bingo: did you hear all of these?

Dalipas 🏳️‍🌈🇬🇹 in Elk: "Génial Louis Boyard !" | Elk
HTMHell Advent Calendar 2021 - HTMHell

Dedicated to HTML :)

Voyager | An Open-Ended Embodied Agent with Large Language Models

This should happen and it happens: an AI that play minecraft. A demo provides the different actions the AI is capable of.

Research Ideas · Gwern.net

A (huge) list of projects that can be implemented

Front end devs really don't understand accessibility | Go Make Things
CSS { In Real Life } | Choosing a Green Web Host

Green energy means renewable energy instead of carbon credits or offsets.
What is the water consumption of the data center?
What about the energy efficiency?

Green hosting can be found at https://www.thegreenwebfoundation.org/tools/directory/

How to Design More Intuitive Websites & Apps | OddBird

Using an object model helps while designing some web pages or content.

An object in a web project is something that has structure, instances, and purpose. Instances are all the specific occurrences of an object.
An instance of the object link can be "When to choose a progressive web app".

So, as we make our user experiences more object-oriented, we also make them more intuitive.” - Sophia Prater, ooux.com.

With this practice, 4 unintuitive objects are identified. The author use the example of a zoo website and they are:

  • isolated objects: they are disconnected from related objects. The penguin animals are not related to the demos and habitat from the list of all the animals. The habitat is also included on the map view of the zoo, but there are no links to the Animal or the demo on this map view either.
  • broken objects: ones that are not directly manipulatable. Demos are useful to show events to the user. As someone who would like to attend the penguin demo, I want to click on an individual demo to see more details, but it is not possible.
  • masked objects: styled to look the same, but are actually different. On the DisneyPlus web view, there is no way to differentiate between a series or a movie. As you want to see a movie (one shot) instead of a series (multiple shots), you have to check on the detailed view in a panel.
  • shapeshifter objects: opposite of masked ones, they are styled to look different, but are actually the same. Date formatting, links, and so on should look and behave the same across the website or the experience platform. They have to be consistent.
Reducing kernel-maintainer burnout [LWN.net]

It was widely agreed that nobody should feel that way, since no one can be expected to catch everything. How to communicate that to the community as a whole is unclear, though.

Ne pas savoir – Carnet de notes

Ceux qui risquent d’être happés par les mauvaises croyances sont ceux qui pensent savoir et affirment savoir alors que ce n’est pas le cas

Association P·U·R·R

L'association "Pour un RGPD respecté" est en cours de formation et va entrer en action. C'est une bonne nouvelle !

Blogroll • Robb Knight
HTML Web Components are Just JavaScript? | OddBird

A feedback from trying to reuse HTML: it still needs JS at the moment.

Personal - rootCompute:\
The stack of specifications - Design Issues

The internet works because

  • there is a stack of protocols built to make things work. Each protocol solves one thing.
  • all miraculously work together because these standards are open.

Tim takes the example of the network stack: Ethernet Packet, Internet Packet, TCP Packet, the port, and the email protocols.

Protocols and standards are everywhere. He takes more examples. When you publish a web page for example: it can be both human and machine-readable. It can be accessed through a URI and when someone follows a link to your web page, their browser opens a TCP/IP connection to TCP port 80 on the machine which is registered as serving the (www.whatever.com, etc) in question. All of that is because the URI specification says that what you can tell about a URI depends on the first bit, in this case HTTP. Tim explains in depth why these relationships exist.

An XML document is a less specified version of an HTML document. The namespace declaration gives a URI indicating the namespace used to interpret this XML though. And more...

An RDF document is based on XML and a triple: a value of some property of some object, or some relationship between some object and some other object. How to figure out what a triple means? A URI defines it, and its standard can be read while dereferencing it. The color example is great! So the stack for this document piles up from the Ethernet to the RDF MS 1.0 and RDF MS 1.0 definition of rdf:type.

A pattern is that each technology evolves into three stages: using numbers or strings, then using a URI, and then a dereferenceable URI. As we move on to later protocols, the protocols themselves become more diverse, so URIs were created instead of simple versions with numbers or strings. "The third stage of civilization is the one at which the identifiers can be looked up on the web.".

This stack prevents one from sending a nasty email to someone and then protesting that the message didn't mean anything. So if the stack is so strict, how does one send a nasty email message when one doesn't mean it? Many protocols have ways of breaking the chain, of including information that is not part of the meaning of the message.

For the email: an attachment. "So being able to refer to something without asserting it, whether you call it attachment, packaging, or quoting, is an important feature of a language. The fact that you can do this removes the last excuse for anyone claiming not to have meant whatever they did say in the main message!"

I'm a Spotless Giraffe. | Ben Myers
Artists Can Use This Tool to Protect Their Work From A.I. Scraping | Smart News| Smithsonian Magazine

There is an on going race between the AI that catches up the latest technology innovation and the innovation that blocks AI to grow :)
In our case, the artists can use the Nightshade to make noise to the AI input.

More about this technique: https://arxiv.org/pdf/2310.13828.pdfttps://arxiv.org/pdf/2310.13828.pdf

Le monde tel qu’il aurait du être. Vendredi 17 novembre 2023. – Carnet de notes

Alors on attend la suite et on verra ce qui tient de ce discours, une fois l'affaire tassée.

Parce que bon, si la fonction publique est tenue à la plus grande exem­pla­rité du fait des pouvoirs qu’elle détient; les ministres devraient en être le parfait exemple....

Using the Johnny Decimal System • Robb Knight

How to better organise files. I am aware of the PARA method, but this one also seems useful.

Why Rust in Production? | Corrode Rust Consulting

An argumentation for rust

Building a Web App in Rust - Dmitry Kudryavtsev

An experience with Axum.

CSS { In Real Life } | The Joy of Lists

The good old paper and a pen still work well. I am also so messy with my lists that I can write them on any old paper sheet or piece of.

It is valuable to offload what is in your mind, and see the current progress.

Veilid

A framework to build applications with privacy, safety, and user experience in mind.

It is developed and released by the Cult of the Dead Cow. The core is written in Rust.

A related article on the topic: https://www.engadget.com/americas-original-hacking-supergroup-creates-a-free-framework-to-improve-app-security-190043865.html

APIs.guru

2,529 APIs are listed at the time of consulting

The Node-Based UI for Svelte – Svelte Flow
Reprenons du terrain sur le Web toxique ! – Bilan 2023 de Framasoft – Framablog

Un état des lieux des différentes alternatives libres soutenues par Framasoft depuis des années.

Données personnelles : la CNIL recadre deux ministères après l’envoi de 2 millions de messages vantant la réforme des retraites
Matthias Ott in Elk: "If you have a personal website: how di..." | Elk

If you have a personal website: how did it change your life?

</> htmx ~ The #ViewSource Affordance
The right tag for the job: why you should use semantic HTML - localghost

Starting with the right HTML tags and using semantic HTML is a first easy step compared to retrofitting accessibility.

It related to landmarks, menus, checkboxes, buttons, headings, bold and italic texts,

Cameron's World

Old school GIFs put on website of the 2000

Retrouvez rapidement un animal perdu sur le réseau officiel PetAlert France

Make it accessible #idea #project

Give yourself a break: lessons from burnout - localghost

This article set the priority on humans, which is also a point of the agile manifesto

Cursorless is alien magic from the future - Xe Iaso

Programming by voice instead of keyboard

Welcome | manpageblog - a small and lightweight blog engine.
SQLite, la solution pragmatique en production pour le web

Le NoSQL est également plus adaptée pour le développement agile car les données ne sont pas structurées pendant les itérations.

Le SQL a réussi à traverser les âges car: il est simple, il est rapide et il est stable.

Les avantages de SQLite:

  • facilité d'administration: tout le contenu peut être visualisé par lecture d'un fichier.
  • facilité de déploiement: il est possible de pousser les BDD en production et de les migrer
  • simplicité: sqlite est intégré avec tous les langages de programmation
  • capacité: une BDD peut contenir plus d'un million de TB

Ses désavantages:

  • requêtes concurrentes:
  • les types de données limitées: NULL, INTEGER, REA L, TEXT, BLOB. Il n'y a pas de BOOL ni de dates.
  • les données sont faiblement validées: "abcd" dans INTEGER o 20 charactères dans VARCHAR(5) passent.
  • la sauvegarde des données est à faire soit même
  • l'hébergement n'est pas possible avec tous les hébergeurs
Documentation · BaseAdresseNationale/api-depot Wiki
Fintech is a scam. — Joan Westenberg

It's because after objectively examining the incentives and outcomes, fintech as an industry categorically fails to deliver meaningful progress to consumers. [...] It's about our obligations to each other and our duty to leave the world more equitable than we found it. Fintech, in its current form, categorically fails that duty.

Learn Lua in 15 Minutes
Briser les règles - Catherine DUFOUR
TypeScript and React: Enforcing Props for Accessibility - DEV Community

aria-label and aria-labelledby are exclusive. So they can be enforced for components in typescript:

type ToggleSwitchProps = {
  name: string;
  checked: boolean;
  handleToggle: () => void;
  size?: "sm" | "lg" | "base";
  classNames?: string;
} & ({ ariaLabel: string; ariaLabelledBy: never } | { ariaLabel: never; ariaLabelledBy: string });
CSS { In Real Life } | Owning Your Web
CSS { In Real Life } | Code Gardening

Maintaining, improving code, fixing bugs and delivering minor features. Small step by small steps.

Grading on a Curve: How Rust can Facilitate New Contributors while Decreasing Vulnerabilities

TL;DR security vulnerabilities introduced by new Rust contributors are largely less than C++ contributors. They use the amount of commits to measure it as experience. It confirms the claim of the

Namely, while it may still be true that Rust may feel like a more difficult language to learn, in at least some ways, new contributors benefit from its adoption, with their first contributions being less than 2% as likely to introduce vulnerabilities as C++, and first-time contributors appearing at a notably higher rate in the projects examined.

The results should not be used as is, as there are some effects:

  • does Rust increase the number of contributors or does Rust act as its own filter and
    reduce the rate of new contributors entirely
  • it is possible Rust developers are more experienced with programming in general. Note that the study focused on new contributors, not new maintainers.
  • at around 18,000 commits, a C++ developer will be less likely to introduce a vulnerability than an equivalently experienced Rust developer.
  • Finally, there is some limitation to these results in that they
    all come from Oxidation projects.
Cursed Rust: Printing Things The Wrong Way | Matthias Endler

Various way to print "Hello World!" in rust

Why Type Systems Matter | Matthias Endler

Advantages of types: they are here to help, improve readability, and provide context

Ten Years of Vim | Matthias Endler

If I can give you one tip, don't learn Vim by memorizing commands. Instead, look at your current workflow and try to make it better, then see how Vim can make that easier.

Introduction - Rust Design Patterns
Afraid of Makefiles? Don't be! | Matthias Endler

A quick guide on makefiles

Faster Rust Serialization

All that we did to get this speedup is implement the Serialize trait using one line for the body of the serialize method!

But implementing the trait directly loses the possibility to serialize the structure with the #derive(Serialize) macro.

Instead, you should implement it on wrapper types that act like formatters.

Also for efficiency: format_args! doesn't allocate or even apply the formatting! It only returns Arguments which is a formatter that borrows its arguments.

Naming Variables In CSS
  1. Consider mixing kebab-casing with camelCasing: --system-color-controlAccent: blue;
  2. Using namespaces can help to avoid collision. In the upper example: system is a namespace.
  3. Value typing hints to the use cases of the variable. In the upper example: color. It could be fontSize for example
  4. Descriptive names can use 2 patterns: icyBlue which is value-based or accent which is usage-based.
  5. Dark mode is simpler with usage-based variables

When to use between value- and usage-base?

Variables with value-based names can be useful for restricting the number of values in your interface. Using numbers can be useful, but sometimes overkill.

Usage-based tend to be useful to describe scopes of capability and utility within the project. The utility of a usage-based name comes in how it guides a developer or designer in its use.

There are often 3 levels of abstractions:

  • defining the values
  • different property for custom controls such as --color-accentColor
  • the CSS variable of use in the component such as --button-color
Chrome drops Web Integrity API plans deemed by many to be DRM

the company announced today it’s not going ahead with the proposed API.

See the first question heading of https://android-developers.googleblog.com/2023/11/increasing-trust-for-embedded-media.html?m=1

In Search Of The Ideal Privacy Icon — Smashing Magazine

Current icon ideas (but not satisfying):

  • padlock
  • detective (chrome incognito is a simplified detective icon)
  • zorro mask
  • shield

New ideas:

  • a blurred user icon
  • Venetian blind icon: an easy toggle to close and open the Venetian
  • the picket fence icon: prevent folks from looking in or hopping over.
Free Software Is Even More Important Now - GNU Project - Free Software Foundation

Those two nonfree programs have something else in common: they are both malware. That is, both have functionalities designed to mistreat the user.

If you use a program to carry out activities in your life, your freedom depends on your having control over the program.

Nonfree software was the first way for companies to take control of people's computing. Nowadays, there is another way, called Service as a Software Substitute, or SaaSS. That means letting someone else's server do your own computing tasks.

In some cases, nonfree software causes indirect harm (secondary injustice): it puts pressure directly on others to use this software (Teams, Skype, Zoom, ...), it encourages to develop the non-free software further. All the forms of indirect harm are magnified when the user is a public entity or a school.

Public agencies exist for the people, not for themselves. When they do computing, they do it for the people. They have a duty to maintain full control over that computing so that they can assure it is done properly for the people.

Shadow roots and inheritance | Kitty Giraudel

box-sizing does not work well with details and summary: it is implemented as shadow DOM in Chrome.

Secure Messaging Apps Comparison | Privacy Matters
ploum : « Si vous n’avez rien à cacher et que vous ne faite… » - La Quadrature du Net - Mastodon - Media Fédéré

Si vous n’avez rien à cacher et que vous ne faites rien de répréhensible, vous devriez chiffrer vos communications.

En ne le faisant pas, vous soutenez la thèse que seuls ceux qui ont qqch à se reprocher utilisent ce genre d’outils. Vous concourrez à la criminalisation de leur utilisation. Vous légitimez le soupçon généralisé sur les utilisateurs.

Utilisateur que vous deviendrez peut-être un jour.

Requests for Startups | Y Combinator
  • AI
  • Brick and Mortar 2.0
  • Carbon Removal Technologies
  • Cellular agriculture and clean meat
  • Diversity
  • Education
  • Energy
  • Enterprise Software: make the extensive cheap, knowledge workers, digitizing every industry
  • Financial services
  • Future of work
  • Government 2.0
  • Healthcare
  • Improving memory
  • Longevity and Ati-aging
  • One million jobs
  • Supporting creators
  • Transportation and Housing
  • Underserved Communities and Social Services
  • VR and AR

See also the past requests for Startups

  • Cleaner commodities
  • Computer security
  • Programming tools
  • Robotics
  • Safeguards against fake video
  • Voice apps
The Platform for Privacy Preferences 1.1 (P3P1.1) Specification

Even if this standard is not used for years, some ideas are interesting. How and which data is collected and used are pretty well standardized.

It can somehow interact with the GDPR.

More native than a Web app - Seirdy

When to use a GUI Toolkit, is it more native than the web? It means some criteria the author defines. Also what level of WCAG conformance can someone hope for?

CSS { In Real Life } | What to Blog About When You Don’t Know What to Blog About

Idea of writing:

  • Here’s a cool thing I made.
  • Here’s a cool thing someone else made.
  • Here’s something I just learned.
  • Here’s something I want to learn that looks cool.
  • Why I want to learn/use/do this thing.
  • Why I don’t want to learn/use/do the thing.
  • I’m in the process of learning something but I haven’t quite got it figured out yet.
  • Here’s something else I discovered while learning a thing.
  • Let’s learn a thing together!
  • Here’s a tip, tool and/or person that helped me recently. Maybe it’ll help you too.
  • Here’s a problem that’s been bugging me.
  • This is what I think about work/life/the industry/the world/this UI component right now.
  • Here’s an interesting thing someone else has to say. Here’s my take on it.
  • I’m feeling motivated! This is what’s motivating me.
  • I’m feeling unmotivated or burnt out. Here’s why.
  • This is what I’ve been reading/watching/listening to recently.
  • Here’s a list of things I could blog about.
Introducing b4 and patch attestation — Konstantin Ryabitsev

Git can be extended in many ways. The author of b4 created a cli tool to simplify the patches communicated by email for the linux kernel developers.

Le monde tel qu’il aurait pu être. Mercredi 22 novembre 2023 – Carnet de notes

Loin de rentrer dans cette logique du chan­tage à l’em­ploi, le gouver­ne­ment a déclaré, dans un discours plein de cohé­rence, qu’ils « visaient un système écono­mique durable et que ça ne passait pas par faire la promo­tion d’une consom­ma­tion de l’inu­tile », et que « sur le long terme nous avons tout inté­rêt au contraire à faire une force d’avoir des emplois centrés sur des besoins réels et un apport de valeur qui ne se voit pas que sur le chiffre d’af­faire ».

L'alliance du commerce pas contente à cause du spot du pub 😡 C'est peut être que vous vendez de la merde, inutile et superflu.

peertube-annuaire.nogafam.fr/

Un annuaire des chaînes Youtube dispnible sur Peertube est en cours de construction :)

Using SVG Sprites • Robb Knight

The technique is to group all SVG images in one big SVG; and then reference them across the website with:

<svg class="icon">
  <use xlink:href="#svg-id"></use>
</svg>
Clin d'oeil : désespéré, Reef en est réduit à manipuler Wikipedia pour contrer Free
Society for the Protection of Animals - Wikipedia

Make a german article of it

L'Echappée Belle

Une coopérative de développeurs de 6 personnes :)

Leur site est disponible depuis les sources sur github à https://lechappeebelle.team/. Ils ont déjà des expériences https://lechappeebelle.team/nos-experiences.html

TOML: Tom's Obvious Minimal Language
Configuration | pinia-plugin-persistedstate

Update the documentation of JSON.stringify/JSON.parse as serializer/deserializer.

#idea #project

007: CSS is not a natural disaster • Buttondown
Getting started with CSS container queries | MDN Blog
CSS { In Real Life } | Stop Using AI-Generated Images

TL;DR they degrade illustrators work.

AI can be used by artists to augment their work and explore an exciting, new, creative frontier. But the vast majority of “AI art” I’ve seen is not that. It’s theft. You don’t have a right to “free” art, in the same way you don’t have a right to have your car fixed for free.

Ça prend combien de place un cycliste ? – Carnet de notes
Signal >> Blog >> Privacy is Priceless, but Signal is Expensive

We estimate that by 2025, Signal will require approximately $50 million dollars a year to operate — and this is very lean compared to other popular messaging apps that don’t respect your privacy.

When you send a message, the Signal service temporarily queues that message for delivery. As soon as your message is delivered, that small bundle of encrypted data (i.e. your message) can be dropped from the queue. The storage of end-to-end encrypted files is temporary too, and any undelivered end-to-end encrypted data is automatically purged after a period of inactivity.

It also shows different service costs and why they are like that. It shows the care Signal has to privacy in its different services.

Usbek & Rica - 10 % des jeunes Français en faveur d’un régime autoritaire (et autres chiffres sur la société « idéale » de demain)

59 % des moins de 25 ans et 58 % des 25–34 ans sont persuadés que l’argent rend libre et contribue fortement au bonheur. Une proportion plus élevée que les autres tranches d’âge, à l’image des 50–59 ans qui sont 40 % à le penser.

Ce qui rend heureux c'est ce que tu n'as pas...

Kenneth John Bardsley in Elk: "" | Elk

"Okay, here's the scenario. You are a crew member on a starship."
"Cool."
"Space travel is slow, you'll be stuck with your crewmates a long time."
"So we must get along."
"Yes. Communicate, listen, share limited resources."
"I can do that. What's the starship called?"
"Earth."

Are we web yet? Yes, and it's freaking fast!

A list of libraries meant to build web apps or the environment around (logging, etc...)

Push Ifs Up And Fors Down

Two good rules of thumbs. I often use them in JS and Vue hints about avoiding v-if in v-for directives.

Neocities: Create your own free website!

Create your own free website.
Unlimited creativity, zero ads.

httpstat.us

This is a super simple service for generating different HTTP codes.
It's useful for testing how your own scripts deal with varying responses.

Custom response headers can be set, as the HTTP status code.

The Yesterweb - Reclaiming the Internet

A mission to accomplish: Working with the guidelines established by the manifesto and the social etiquette to progressively transform the culture of the internet and beyond.

There are three commitments to it:

  • The commitment to social responsibility and partisanship
  • The commitment to collective well-being and personal growth
  • The commitment to rehumanizing social relations and reversing the process of social alienation
Web Axe in Elk: "Related: 4 examples of web-accessible date pickers..." | Elk

The 4 examples are from the WAI, Deque, U.S. Web Design System et Tommy Feldt.

Stop Saying Best Practice

Instead, it could be better to use:

  • community pattern: everyone else is doing it. Everyone sees it they know exactly how and why it is there.
  • readability pattern: created for the sake of making more readable code. The only true goal is writing code that anyone can reason quickly about.
  • performance pattern: squeeze the code for maximum performance, and it can degrade readability.
  • guardrail pattern: it exists to avoid known foot guns such as magic number

Often people see "best practices" as community, readability, or guardrail patterns. It is also time as professional that we use a richer vocabulary.

Why doesn't Canada have more trains? - by Johnny Renton
HTML First
Node to Rust, Day 24: Crates & Valuable Tools | Candle Homepage

Recommended rust crates and resources can be found at the end of the guide

Building a website like it's 1999... in 2022 - localghost

The headlines of the content picture well what content is in this post:

  • The web used to be weirder
  • Animated GIFs (WordArt)
  • Music
  • Cursor trails
  • Webrings
  • Guestbooks
Why Unique ID Attributes Matter
The elegance of endurance: what centuries-old enterprises can teach modern culture. — Joan Westenberg
The Big O of Code Reviews

About the complexity of the PRs. The less complex the better.
There are analogy to O(1), o(n), O(n×m) and O(n!)

Epoch

About the Unix epoch. It provides usages in different languages and a description of the Year 2038 and the 32-bit timestamp format.

There is only one form of passive income worth celebrating. It’s a UBI. — Joan Westenberg

As author Sam Harris said, “In a world of true abundance, you shouldn’t have to work to justify your life.”

UBI stands for Universal Basic Income.

Proponents of UBI — and I count myself among them — argue that it offers a safety net that enables individuals to pursue education, start businesses, or engage in creative endeavours without the fear of financial ruin, creating a more innovative, entrepreneurial, and dynamic society.

UBI is grounded in the principle of shared prosperity and the intrinsic value of each individual, irrespective of their economic contribution.

Experiments in Finland and Canada have shown that providing a basic income does not significantly diminish people’s desire to work. Instead, it affords them the flexibility to pursue work that is meaningful and suited to their skills rather than being trapped in the cycle of low-paying or unsatisfying jobs.

With a correct basic income, you can safely strive for the progress of humanity.

Everything wrong with tech in 2023 (in no particular order) — Joan Westenberg
Git Notes: git's coolest, most unloved­ feature - Tyler Cipriani

Notes stow metadata about anything tracked by git—any object: commits, blobs, and trees.

The git project itself offers an example of git notes in the wild. They link each commit to its discussion on their mailing list.

Other folks are using notes for things like:

  • Tracking time spent per commit or branch
  • Adding review and testing information to git log
  • And even fully distributed code review

Review notes are used by Gerrit (Wikimedia) and many google projects. For example:

commit d1d17908d2a97f057887a4afbd99f6c40be56849
Author: User <user@example.com>
Date:   Sun Mar 27 18:10:51 2022 +0200

    Change the thing

Notes (review):
    Verified+1: SonarQube Bot
    Verified+2: jenkins-bot
    Code-Review+2: Reviewer Human <reviewerhuman@wikimedia.org>
    Submitted-by: jenkins-bot
    Submitted-at: Tue, 14 Jun 2022 21:59:58 +0000
    Reviewed-on: https://gerrit.wikimedia.org/r/c/mediawiki/core/+/774005
    Project: mediawiki/core
    Branch: refs/heads/master

There is also an extension from Google to git notes dedicated to code review: https://github.com/google/git-appraise. Request review, comment and review and merge are included.

Its authors have declared it a “fully distributed code review”—independent of GitHub, GitLab, or any other code forge.

Git notes are however a pain to use. Mhmhmhm #idea #project on top of the git note commands?

For commits, you can make viewing and adding notes easier using fancy options in your gitconfig3. But for storing notes about blobs or trees? Forget it. You’d need to be comfortable rooting around in git’s plumbing first.

Much of the value of git repos ends up locked into forges, like GitHub. Git notes are a path toward an alternative and it could make it possible to distribute the history of an entire project.

Why I Love Programming | Matthias Endler
  1. Automating stuff gives you superhero strengths
  2. Coding is fun (and we can forget the rest)
  3. Sharing is fun too
  4. Elegant, creative solutions
  5. Talk to a machine
  6. Standing on the shoulders of giants
Being a Professional Programmer | Matthias Endler

The difference between professional and hobby is accountability. In professional programming, you're expected to get the job done.

If a skill becomes obsolete, it's not a skill.

Professional programmers have to balance constraints: deadlines, budgets, and code quality for example.

At the end one of the most important fact is communication.

lexi-sh/rs-natural: Natural Language Processing for Rust
Little Helpers | Matthias Endler

We take all of this for granted because the devices rarely fail, but it's really amazing when you think about it. It's only been a few decades since much of this was tedious, time-consuming, manual labor.

About automation:

That means we have more time to focus on the fun stuff, like playing with the cat.

htmx, Rust & Shuttle: A New Rapid Prototyping Stack

Ok not bad at all. I still think Rust is not meant for prototyping, but let's give it a try.

Let’s reinvent the wheel ⚒ Nerd

Both Figma and Photoshop are for people who believe the web looks like an image.

Semantic HTML is a must. Because there is UX with HTML :D

Another thing our design tools really don’t give a shit about is accessibility. And to be honest, I think most of our industry doesn’t really care about accessibility as well.

Looks also valid to me.

The specialists who helped the architect in making sure it was certified did nothing else than ticking boxes. And this is exactly what most of us do when we think we make our sites accessible. We tick the WCAG boxes.

On the Uniting Power of a Commitment to HTML Conformance · Jens Oliver Meiert

TL;DR nearly no website have valid HTML. We need validators and ways to integrate them in our development processes. It could allow us to tackle more serious challenges—like advancing accessibility—with collective vigor.

Maybe Cypress and test the different pages?
There is an NPM package dedicated to HTML checking https://www.npmjs.com/package/html-validate

bufferhead-code/nextjs-use-php: Use PHP code right within your React / Next.js App. With "use php";

because it is possible

Humans TXT: We Are People, Not Machines.

It's an initiative for knowing the people behind a website. It's a TXT file that contains information about the different people who have contributed to building the website.

A txt file is simple and fast to create and can be embedded easily with a <link type="text/plain" rel="author" href="./humans.txt">

It completes robots.txt or security.txt

Why Do We Interface?

In this micro-book I take a historical look at interfaces to build an understanding of how they allow us to utilize information in such powerful ways that they can fundamentally change what it means to be human.

Politique de confidentialité des Chaînes - EEE

À propos des chaînes sur Whatsapp

Référentiel général de l'écoconception des services numériques - RGESN

Réalisé par l'Arcep, il regroupe des critères formulés en questions sur des thématiques. Le critère est accompagné d'un niveau d'impact et d'une fiche pratique est associé afin de mettre en oeuvre et de tester ledit critère.

dav1d - dav1d is an AV1 decoder - VideoLAN

Dav1d is a new AV1 cross-platform decoder, open-source, and focused on speed, size and correctness.

It uses software instead of hardware to be compatible.