Monthly Shaarli
December, 2023
La contre-tribune a plus de 2500 signatures à l'heure actuelle...
Another ode to the web
For papers submitted since the 1st December 2023
HTML is not replacing PDF but will be an additional format available for arXiv users.
The goal is to convert all papers on arxiv to HTML files.
It will moreover allow easier analysis through HTML parsing.
A simple StartPage built for custom needs
Avec le pass culture de la BCN (en lien avec https://shaarli.lyokolux.space/?XsLbsA), il est possible de consulter le contenu des journaux avec cette extension.
Programmers want to write fast apps. But the market doesn’t care.
And the list goes on for th rest of the characteristics: reliability, lightweight, etc...
Programmers have power though.
Des retours du service numérique Flus, developpé à partir de FreshRSS
- Pornopulence
- Protopie
- Méta-modernisme
- Croivance
- Circlusion
- Bombes à carbone
- Littérature cosy
- Long-termisme
- Désinfluence
- Pétromasculinité
I am a…
- remote-first,
- freelance,
- full-stack (what do these labels even mean anymore?)
- developer
- at it professionally since 2017, and,
- as a hobbyist since 2008 (it’s been a while huh?)
I’m currently working with an independent review platform for education technology products worldwide.
A list of things
It is a gambling at the side project casino: “It’s a career for gamblers. Every time you write a book, you’re throwing the dice again, and you don’t know whether it’s going to crash and burn or be a big success.” - George R.R. Martin
The effort put into an internet project is often detached from its results.
Ayush made 25 products in 25 weeks https://ayushchat.com/25-in-25
As another emailer explained, tiny projects can provide the creative insights that give large projects direction: “My small projects help inform how my big project is working, where my main project is the tree trunk and the tiny projects are its branches.”
You used to put side projects on a CV to land a career in tech. Now, side projects can be your tech career.
😄
This new release is quite neat.
Le trajet est possible sans la carte... c'est du foutage de gueule
Source of markup ghosts:
- proprietary markup introduced by browser vendors
- specs which didn*t see uptake like HTML3
- use case specific markup on devices like WebTV or early smartphones
Some old tags:
<audioscope>
to display the sound over time. A demo https://www.youtube.com/watch?v=tM7YVhar2Dg<au>
for authors<blackface>
for double-weight boldface... in HTML 🤡<center>
oh shit<font>
and color attributesdingbat
attribute to embed emojis, extended unicode entities, icon fonts and custom things. Now it is used as<
for example and does not rely on the attribute anymore.<multicols>
....<person>
in HTML 3, but it opens the door for so many other tags. Now instead we can rely on<a rel="author">
or withme
and more
The web of things is built on the web of documents, which is built on the web of computers controlled by Domain Name owners, which itself is build on a set of interconnected cables. This is an architecture which provides a social backing to the names for things. It allows people to find out the social aspects of the things they are dealing with, such as provenance, trust, persistence, licensing and appropriate use as well as the raw data. It allows people to figure out what has gone wrong when things don't work, by making the responsibility clear.
The value of this architecture is that each layer leverages the social components of the lower layer's architecture
Let's take a look at how to spin up a simple Node server and use custom elements as templates in three popular formats
As always it depends of the need.
Principles:
- Know what motivates you
- Not everybody needs to (or wants to) progress
- The way up (or sideways. Or backward.): all roles are relative
The levels of experience in a company, range from Engineer I to III, then Senior engineers (and there are a variety of it).
Other potential sideways steps: Developer relations, Sales engineering, or specialist consultancy roles.
Find the most followed accounts on mastodon
Well because the prices does not go down.
About type, name, value and TTL
Safari is using the web to create a desktop app in a very convenient way!
There’s a HTML file and a Service Worker that keeps it working offline
More about it on https://adactio.com/journal/20716
The 5 major problems of the current Internet.
Thoughts of the web and hyperlinks
eine neue Literaturgattung, bei der sich die tradierten Strukturen von Erzählungen in offene, für den Leser unerwartete Strukturen auflösen. Vielfältige Rezeptionswege werden durch die Möglichkeit, im Text zu springen, möglich. Der Leser wird dabei durch seine Auswahlentscheidungen zum Mitproduzenten des Textes.
Rigid hypertext is streetscape and corporate office: simple, orderly, unsurprising. We may find the scale impressive, we admire the richness of materials, but we soon tire of the repetitive view. We enter to get something we need: once our task is done we are unlikely to linger. We know what to expect, and we rarely receive anything more.
Baseline is a new term that defines a feature broad adoption. There are two stages:
- The new feature is available in all last versions of the browsers
- The new feature is widely available after 30 months after the first stage
We can then speak of baseline 2023 that groups all features usable in the considered browsers.
Limitations:
- the browsers considered are Safari, Firefox, Chrome and Edge. The rest is unknown even if they are listed on caniuse.com
- it does not take screen readers and accessibility tools in consideration as part of "availability"
Text on the image: "If a Monkey hoardet more bananas than it could eat, while most of the other monkeys starved, scientist would study that monkey to figure out, what was wrong with it. When humans do it, we put them on the cover of forbes."
Les outils SimpleMobileTools se sont fait acheté par une entreprise opposée au RGPD :/
A list of the projects connected to the fediverse
Note of Tim Berners-Lee.
He lists various Ways of Dealing with Ambiguity:
TODO
Note of Tim Berners-Lee
L'aviation, qui ne survit que grâce à l'absence de taxe sur le carburant...
I am also anxious about this situation
The overwhelming motivation behind it seemed to be “I made something, here it is”. Sharing things for the sake of showing them to the world. Somebody had created something, then put it online so you could see it. Visit their website (wait for the dial-up to finish), and it’s yours.
Large companies find HTML & CSS frustrating “at scale” because the web is a fundamentally anti-capitalist mashup art experiment, designed to give consumers all the power. — Mia, with valuable secrets 🤫 (@TerribleMia) November 24, 2019
You can stand out of the crowd by simply treating the web platform as what it is: a way to deliver content to people.
The best growth hack is still to build something people enjoy, and then attach no strings to it. You’d be surprised how far that can get you.
I'm a digital freelancer, writer, uncle, internet troublemaker, and fond admirer of the French Goodbye.
A newsletter that highlights blogs and their authors.
Because the federation is disturbing for casual users, it seems normal to
remind ourselves of what social media used to be: a way to connect around shared interests, talk to friends, and discover new content. No grifts, no viral fame, no drama.
The barrier to be free on the web is highly correlated to the level of expertise.
You could loosely map some of them by how easy it is to get started if you have no technical knowledge. [...] The more independence a technology gives you, the higher its barrier for adoption.
Owning, control and independance on the web should be just as easy as signing up for a cellphone plan.
Which actors appeared in both shows, movies or series?
A related post in their blog explains it https://rknight.me/crossover/
The blog of the developer of https://a.singlediv.com/
Great explanation of the rel attributes that provide:
- information to the resource linked
- behaviors while navigating
Create an accessible <marquee>
tag
They found were Lo-Fi Girl is 😁
Either a <table>
or a grid layout?
Another font made for digital readability
Ja klar, bei manchen Sachen sollte man das mit ARIA Elementen anreichern, aber bei vielem könnte man es verbessern indem man einfach die richtigen HTML Tags/Attribute verwendet.
Use Cases anzeigen und sie durchsuchen können.
Beispielen:
- Accordion:
<details>
/<summary>
<dialog>
- Definitionsliste:
<dl>
/<dt>
/<dd>
- Definition steht im Paragraph
<dfn>
- Listen:
<ol>
/<ul>
- Mehr Kontekt
<time>
,<kbd>
,<abbr>
- Separator zwischen Paragraphen:
<hr>
- Abkürzung:
<address>
<quote>
/<blockquote>
/<cite>
- semantische Struktur der Seite:
<article>
/<section>
mit o. ohne Heading /<footer>
/<header>
/<main>
/<aside>
/<nav>
Emails are not good enough: they can change.
Je l'utilises déjà pour mon blog est j'en suis bien satisfait. Il est possible de convertir ces polices d'écriture en .woff2 pour les optimiser pour le web.
It looks interesting for new projects
Une autre série d'image
https://www.cedricdelsaux.com/dark-lens-welcome-to-the-dark-corporation
A source of thruth. It informs which account has the owner.
Sticker sure la voiture: "Bought it before we knew how awful he is."
Funny that this blog uses Bear as software to power the posts
- No link text
- Non-active element in tab order
- Missing link
alt
attribute - No
alt
text - Nested list not nested correctly
- Duplicate labels used
- Positive
tabindex
value - Invalid
aria-describedby
- No label for button element
- Invalid
aria-labelledby
The values of HTML are not exactly the ones of HTML first.
https://html-first.com/
The author recommends to include instead:
- HTML that is actual HTML, i.e., that is valid (common sense, until you start checking)
- HTML that makes full use of HTML features, i.e., that’s not XHTML–HTML
- HTML that is used according to purpose (aka semantic HTML)
- HTML that is accessible
#futurBilletDeBlog
#idea #browserExtension a view source with automatic indentation
Trusted types are interesting indeed. They won't fit all cases though: what happens if I want to insert HTML? These are cases though, and the majority could use these.
It states that every method should either be a command that performs an action, or a query that returns data to the caller, but not both.
More formally, methods should return a value only if they are referentially transparent and hence possess no side effects.
Even in single-threaded programs, it is sometimes arguably significantly more convenient to have a method that is a combined query and command. Martin Fowler cites the pop() method of a stack as an example.
The lh unit is even more useful [for icon sizes] though because it is relative to the computed line height.
.flow > * + * {
margin-block-start: var(--flow-space, 1em);
}
La plateforme officielle de signalement de spam
Make a UI for it
Before the social media craze or publishing platforms, and long before ‘content creator’ was a job title, blogs served as one of the primary forms of online expression and communication. [...] We had webrings, forums, and carefully curated link pages instead.
At their core, they all have one characteristic in common: they’re there because their owners wanted to carve out their space on the internet. And I think you should do the same. Let’s talk about why that is.
- Platforms aren’t forever homes
- SEO Writing is dead, storytelling is back
- Communities > Followers
How to ramp up quickly?
The first step is to find someone on the team and ask for 30 minutes with them. In that meeting you have a simple agenda:
- For the first 25 minutes: ask them to tell you everything they think you should know. Take copious notes. Only stop them to ask about things you don’t understand. Always stop them to ask about things you don’t understand.
- For the next 3 minutes: ask about the biggest challenges the team has right now.
- In the final 2 minutes: ask who else you should talk to. Write down every name they give you.
Repeat the above process for every name you're given. Don’t stop until there are no new names.
With the latest changes in MacOS, we can now build Progressive Web Apps for all devices.
Hypertext systems should take about 1/4 second to move from one place to another. If the delay is longer, people may be distracted; if the delay is much longer, people will stop using the system. If the delay is much shorter, people may not realize that the display has changed.
It is funny how thoughts about speed and user experience were already there before the 2000's.
Issue: Links on the web are often quite slow
One solution is to abandon hypertext links. [...] Have a one-page view.
Another strategy is to exchange one large delay for many small ones. We can sometimes arrange a Web site to to bundle large parts of the data in a package that is pre-loaded at the entrance. Within the site, link response is quick because time-consuming sound, graphic, video, and applets have been pre-loaded onto the user's computer.
A better solution, for sophisticated hypertexts that must provide crisp performance, may be to use the Web as a way to provide access to, and information about, hypertexts that can be downloaded (or purchased) as a unit and then performed on the user's machine.
Two types of anxiety: the one that fills you with terror and the other one that tends to rush you.
A solution is framing: how to look at the situation.
A framework proposes to frame a presentation or an oral intervention with the following scale:
- Practicing / Perfection
- Enthusiasm / Audience
- Prepared / Flawless
- One of many / The big one
- Sharing Enthusiasm / Giving a presentation
The right side of this scale is what people normally imagine when they hear public speaking. It is however the wrong framing.
The positive frame would move to the left side of the spectrum. It is just practice, being enthusiastic, only preparation is needed, this is one of many public speaking so get ready for the next one too.
The trick is to switch the focus from yourself and the audience to the ideas in the talk.
The reason it doesn’t matter is because the audience is not the point. And you aren’t the point either. It’s the content. It’s the idea.
A lightweight frameworks for HTML templating
To remember it, Meta approches one of the most important admin system to talk privately with him.
(In context of web gardening)
- Many hypertexts do not require elaborate navigational apparatus.
- Rigid hypertext structure is costly.
- The shortest path is not always the best.
- Large hypertexts and Web sites must often contain both parks and gardens.
- Use punctuation sparingly; unwanted interruptions are tiresome and intrusive.
- The boundaries of parks should be especially clear, lest readers see them as mere wilderness.
- Rigid structure makes a large hypertext seem smaller. Complex and intricate structure makes a small hypertext seem larger, inviting deeper and more thoughtful exploration.
At times, wilderness is exactly what readers want: a rich collection of resources and links. At times, rigid formality suits readers perfectly, providing precisely the information they want, no more and no less. Indeed, individual hypertexts and Web sites may contain sections that tend toward each extreme.
Often, however, designers should strive for the comfort, interest, and habitability of parks and gardens: places that invite visitors to remain, and that are designed to engage and delight them, to invite them to linger, to explore, and to reflect.
A list of awesome as we like them 😄
Les documents publiés par la CNIL sont pleins de ressources.
Il faut simplement prendre le temps de les trouver.
Un des points les plus difficiles du RGPD : savoir si on est sous-traitant, responsable de traitement, co-responsable de traitement (ou les 3 à la fois!).
Pour te souvenir quelles obligations s'appliquent à qui, enregistre ce post pour plus tard.
Ce que je trouve le plus utile, c'est que la CNIL a mis l'article du RGPD à chaque ligne. Revenir aux sources, c'est la base.
Maintenant, tu pourras utiliser cette checklist pour vérifier que tu n'as rien oublié dans tes contrats.
Note of Tim Berbers-Lee.
Put a frame around "engineering" and " ownership"
:has
has a lot of possibilities with drag'n'drop. Here the developer uses 3 items: mushrooms, potions and .
For example: dragging some items to make parts of the site grow. https://lynnandtonic.com/assets/images/thoughts/case-study-2022-mushroom-header.mp4
See https://lynnandtonic.com/assets/images/thoughts/case-study-2022-david-rose.mp4 for more real interactions.
A potion adds color: https://lynnandtonic.com/assets/images/thoughts/case-study-2022-home-potions.mp4
The matching expression ([^\\])"(.*)([^\\])":
should use: $1$2$3:
It seems to be the best package manager as it also includes a way to manage node versions.
It avoid to rely on both npm and nvm for example.
Chat has its limits though. For information to be synthesized into knowledge, the rate of messaging needs to be slowed down to make room for less reactive, more deliberate, long-form expression.
That are Forums.
Discord today is equal parts group chat and forum.
with limitations:
- Discord is not web-readable and thus only minimally linkable
- Discord mixes different thread concepts (chat-channel threads vs forum-channel threads)
- Discord's finances are dubious
- Discord is closed source.
Messages are living information artifacts. As content blobs they can morph through many different forms, from ephemeral musings to everlasting tomes of shared understandings.
I like the flow from thought to chat to thread to article: https://user-images.githubusercontent.com/583842/273896083-c035f6d7-47b2-43e4-abe6-4d42a5f54c76.png
So the author introduce the Commune app (see https://shpong.com/):
While in v0.x_pre-alpha it is essentially Linen (or Discourse Bot Kit), but for Matrix instead of Discord/Slack. Hook your existing Matrix instances up with Commune to give your channels web-public threading superpowers. [...] It's a Reddit-like site that operates a network of sub-communities.
Du fait de la passion:
- L’inclinaison excessive pousse les individus à se donner dans un domaine/sujet sans véritablement compter leurs heures.
- Briller à travers les passionnés#
- Un sas de créativité
- Avoir de l'expertise
- Enfermement dogmatique
- Un chemin personnel
- c'est hors-norme
- Un risque de briser la diversité
NoiseCapture is a free and open-source Android application that allows users to measure and share the noise environment. Each noise measure is combined with its GPS track so that the result can be displayed in interactive maps within the application, but also on this page.
Because it is complex and powerful.
Comment OpenOffice est devenu LibreOffice suite à un fork de la cokmunauté.
Use
<button>
if you can count on JavaScript being available, and flipping the switch has an immediate effect.
Use<input type="checkbox"
if you want to progressively enhance the control, and flipping the switch will only take effect when the user submits it.
The post explains how.
« L'apartheid était légal.
L'holocauste était légal.
L'esclavage était légal.
Le colonialisme était légal.
La légalité est une question de pouvoir, pas de justice.
»
Lol
French ISPs were required to implement DNS blocking. In response, some users switched to third-party DNS providers, a hole that Canal+ now wants to plug. Through a lawsuit filed at a Paris court, the broadcaster hopes to compel Cloudflare, Google, and Cisco to implement similar DNS blocking measures.
An example of linktree
These bugs highlight the risk of unknown unknowns, i.e. stability issues in our stability monitoring itself that we are blind to
Une brève sans paywall est disponible sur FranceInfo https://www.francetvinfo.fr/politique/gouvernement-d-elisabeth-borne/anticor-l-association-anticorruption-denonce-le-refus-implicite-de-sa-demande-de-renouvellement-d-agrement_6268371.html
Ce qu'ils créent est génial ! Un don est bien efficace.
C'est par là pour débloquer officiellement les fonds d'écran https://framasoft.org/fr/#support
The butterflies are often represented dead instead of alive.
A blog hosted on Chris Siebenmann::CSpace with a wiki
Hey! My name is Simone Silvestroni. This is the personal website where I document thoughts, opinions, and how I work with technology to translate ideas into an enjoyable experience.
13% wider than the classic Times New Roman
Tiny devs
Voilà comment on traite ces alliés?
IO relève également que « les États-Unis représentent la moitié des 92 cas d'ingérence dans des entreprises françaises par extraterritorialité du droit (lawfare) relevés par la DGSI depuis 2020 jusqu'à fin 2022 », et que « la Chine se situe au deuxième rang de ce palmarès, mais très loin du nombre de cas attribués aux États-Unis ».
Using a single metric always results in Goodhart's law: when a measure becomes a target, it ceases to be a good measure.
By using "Focus on Impact", people started to focus only short terms.
I believe I have observed a novel form of this law: when a company slogan becomes an article of faith, it ceases to be a good slogan.
The slogan “Move Fast and Break Things” was used until it was serially and irreparably misunderstood.
Use SVGs instead of icon fonts for the reasons explained in the articles.
system-ui
is a good typography because it falls back on the system font (that is readable). It means 0 bandwidth cost.
They're nice and useful tools :)
They can be extended to browser extensions if they need to.
It can be a meme: instead of talking about semantics, UX is trendy and can be used as trendy shit word instead.
UX HTML is more accessible, less error-prone, more maintainable because it uses the right tags and attributes. Yes it is semantic at the end.
So UX of HTML matters.
- Universality
- Open Standards
- Open Web Platform (OWP)
- Open Government through Open Data
- Openness with personal data on the Social Net
- Open Platform
- Open Source
- Open Access
- Open Internet and Net Neutrality
Too many websites could generate nice reports as documents, but had no way to access the data behind it to check and build on the results.
Exactly.
Law 1: Utility Classes Consume the Design System, They Don’t Create It
Law 2: Utility Classes Cover Only the Low-Hanging Fruit
Law 3: Utility Classes Complement, not Supplant, Semantic CSS
Signal has open-sourced a SQLite extension that provides better support for non-latin languages (Chinese, Japanese, etc) in the Full-Text Search (FTS) virtual table.
We pile up things to read later that we
Here's the funny thing: In trying to learn everything, we learn very little. We stuff ourselves with information but don't digest it. It's a sign of our times – we want to know more but feel empty.
But at the same time, each saved item is a reminder of our finite nature in contrast to the infinity of knowledge available.
It is a planning fallacy: we overestimate our future time and resources. A way to solve lies is by aligning our aspirations with our actions. [...] "we need to cultivate a habit of selective engagement, where we consciously choose what to consume based on its relevance and value to our personal and professional growth, creating space for thoughtful engagement with content that truly matters rather than mindlessly accumulating information."
Compléter l'outil, à voir aussi selon les besoins.
Et puis un outil un peu plus gros qui n’est qu’une idée, car j’en ai marre que les outils existants tombent ou deviennent des usines à gaz :
– former une BDD des groupes/artistes de musique, et y intégrer les albums à paraître. Le tout où on peut s’abonner à tel ou tel artiste, et ça donne un flux RSS ou un ICS personnalisé qui nous envoie un rappel lorsque l’album sort. Comme ça, ça m’évitera de louper des trucs.
Dans un premier temps, ça sera un outil perso pour suivre mes artistes préférés, vu que ça me demandera déjà pas mal de veille, mais à terme pourquoi ne pas faire un système collaboratif où quelqu’un peut proposer une date pour un album à paraître pour n’importe quel artiste. Évidemment, dans ce cas, une source sera exigée et une validation manuelle à faire (par moi). L’idée est surtout de proposer des flux RSS/ICS pour tout le monde.
Thoughtful designers lead visitors not only to the answer to their question but to better questions as well.
Highways are judged by efficiency: distance, cost, safety, and time. Garden paths play a different role; they lead us through the best routes, not the shortest. They may bend to pace our journey, curving here to reveal a view, twisting there to lead us through a shady grove or a sunny clearing.
Make an OSS version of it for the web: why not building on the web for the web?
A website about web, links and hypertext... well it is a garden when someone can lost itself a bit.
The URL could become https://www.htmhell.dev/adventcalendar/2023/ later on
I'm sorry, did you forget the last 200 years of technological progress advancing productivity yet leading us to work even longer hours? If we want to work less, we need unions, not tech.
👍
A more readable clock
An original website
A list of blog posts related to the default apps of the author.
I played the game myself with https://blog.lyokolux.space/posts/2023-11-20-default-apps/
A way to render the highlighted blocks (Tip, Note, Important, Warning, Caution) following the proposal of https://github.com/orgs/community/discussions/16925
Generate a static book from markdown sources
I like the model: Subject - Predicate - Object
Such as: Xerxes - Parent - Brook.
It can be modeled as such:
parent(xerces, brooke).
parent(brooke, damocles).
- Illegal cab company
- Illegal hotel chain
- Fake money for criminals
- Plagiarism machine
The problems lasted weeks and it is now solved in one day after being public...
It's amazing how quickly Microsoft can fix things if issues are made public: Yesterday we've reached out to Microsoft Germany along with the press release asking them - again - to fix the issue of tutanota.com emails going to Spam in Outlook. The issue was then fixed within one day (after we had been in direct contact for three weeks without any success)!
Metaphosr of the web as Dark Forest, cozy web, dark web, corporate web, etc...
And there are The Towns, the IndiWeb or the small web. There is the fun !
Let's create a holiday card generator by learning how to get access to a user's webcam and compose a screenshot.
An acronym standing for "Publish (on your) Own Site, Syndicate Elsewhere".
It seems great :D
The mere exposure effect is a cognitive bias where individuals show a preference for things they’re more familiar with. Repeated exposure to a stimulus increases liking and familiarity, even without conscious recognition. Essentially, the more we encounter something, the more we tend to prefer it, based on familiarity alone.
Plus je suis stressé et plus je m’éparpille, une façon de canaliser mon cerveau qui bouillonne, une tentative pour étouffer ce qui remue au fond par un ensevelissement de tâches plus ou moins f·utiles. La beauté de ce mécanisme c’est que même en étant pleinement conscient de cela, je n’ai pas pour autant une prise dessus. Alors je lâche-prise justement, j’accepte cette période, surtout si je sais qu’elle est bornée par une date clé. Savoir qu’il va y avoir un après est déjà libérateur.
Shit. I have to change some apps of my android phone.
How to log performance information client-side.
A data collection adventscalender
This CSS file intends to warn developers about possible risks and mistakes that exist in HTML code. It can also be used to roughly evaluate a site's quality by simply including it as an external stylesheet.
A proposal for a good README format
- Name and description
- Installation
- Configuration and use
- Deployment
- Testing (unit tests? Lol)
- How to contribute
- Licence
- Roadmap (future changes)
- Author(s) / Contributors
- add a demo link
- AND A FUCKING SCREENSHOT!