Have you ever heard of the brand new reading-order
CSS property? Do you continue to marvel when to make use of JavaScript mills? Or must you test when to make use of the translate
HTML attribute?
Activate the Internet Weekly tune and discover some solutions under. Get pleasure from!
James listens to “Neil Cicierega – 300MB”
Here is a remix of a pc business from 1992, by the man who sang “The Final Showdown of Final Future”.
Do you wish to share your favourite music with the Internet Weekly neighborhood? Hit reply; there are three extra songs left within the queue.
For those who take pleasure in Internet Weekly, share it with family and friends.
A fast “repost” actually helps this indie publication out. Thanks! ❤️
This publish, which is 13 years previous, nonetheless makes me chuckle with some programming phrases I have never heard earlier than. My favorites:
- yoda situations
- ninja feedback
- refuctoring
Alex argues that ECMAScript mills (perform* fn
) and async mills (async perform* fn
) are nice for cleansing up code. And what ought to I say? Ignore the bizarre yield
assertion for a second; for particular duties, they’re nicer to learn than callbacks, customized loops, or recursion.
I’ve nonetheless to digest this text as a result of it is a bit over my head. Do you discover the wobbly borders on this highlight impact above? 👆 I’ve at all times thought that these results are achieved with canvas magic, but it surely seems that that is CSS.
The one JS working on the web page is for updating the mouse place. The remainder is a mix of filter
, mix-blend-mode
and a few background
methods. #wat
I am going to need to play with this extra!
So. Figma launched a brand new product at their flagship convention — Figma Websites
. The thought is to take a Figma design and convert it into an internet site. Sounds promising, proper?
The outcomes, nevertheless, weren’t “fairly” with unsemantic markup, div
soup, and random ARIA utilization. Adrian examined the generated websites and picked up the neighborhood suggestions.
To create customized CSS shapes, you could have used the clip-path
property. Possibly it is simply me, however creating complicated clip-path
guidelines with the path()
perform is a) very difficult and b) not responsive.
There’s now a brand new, responsive, and CSS-friendly clip-path
perform: form()
.
With form()
, you may outline customized paths with CSS percentages and even customized properties!
By way of form()
browser help, Firefox will be a part of Webkit and Chromium in just a few months!
If you wish to study extra, our buddies at Apple have you ever lined.
And when you’re on the lookout for a fast option to convert your difficult path
coordinates to CSS form()
features, Temani has constructed a useful “SVG to CSS” converter!
Wowza! Would you take pleasure in getting Internet Weekly straight to your inbox?
I do not bear in mind when or how I found elle’s website, however man, do I really like this. It is bizarre, stunning, artistic! It is how the web used to and ought to be! ❤️
PS. Do you know there’s an Web Cellphone e book?
Years in the past, I used to reply Stack Overflow questions to assist out individuals and study new and random issues. In fact, the built-in gamification and ensuing karma factors have been welcome, too. Over time, I’ve answered 128 and requested 2 questions.
At the moment, I do not reply or open StackOverflow fairly often. And I aren’t alone with that. Stack Overflow utilization is declining. Who’s guilty? In fact, it is AI.
Here is Gergely’s prediction:
In January, I requested if LLMs are making Stack Overflow irrelevant. We now have a solution, and sadly, it is a “sure.” The query appears to be when Stack Overflow will wind down operations, or the proprietor sells the positioning for comparative pennies, not if it’ll occur.
Now, Stack Overflow wasn’t the friendliest place on earth, but it surely absolutely was each nerd’s finest buddy after they have been in a debugging disaster. Seeing it disappear is unhappy.
You in all probability know that you may visually reorder components utilizing flexbox or grid. And when you’re coping with tough responsive designs, reordering components with CSS is useful. Nevertheless, there’s an issue with grid/flex reordering.
For those who shuffle components round with CSS, the visible order not displays the supply order. Then, individuals seeing your website will expertise one thing completely different from these utilizing a keyboard or a display screen reader.
Chrome 137 has now shipped new CSS properties that may assist with this very previous drawback: reading-flow
and reading-order
. For instance, a fast reading-flow: flex-visual;
will help hold the main target and studying order intact no matter whether or not you reverse your rows or columns.
I am into this! It is unlucky that Apple and Mozilla nonetheless want to present an announcement on a property delivery already Chromium. Let’s hope all engines agree on this being a good suggestion.
I am often not enthusiastic about these wild CSS-only tasks. Do not get me fallacious, the tasks are sometimes spectacular, however technically, they’re primarily primarily based on checkbox hacks or wild field shadows.
This CSS-only Minecraft sport isn’t any exception; nevertheless, the buttons additionally can help you rotate, zoom, and regulate the digital camera place. It is utilizing a intelligent trick to do it. Can you work it out?
Do you turn into unsure and insecure when somebody asks you why you are doing one thing? In fact, it is determined by the scenario, however generally a easy why? can completely put me off-balance. To illustrate my boss writes me an electronic mail asking “Stefan, why did you …”, I am going to instantly react to this single phrase pondering I’ve achieved one thing fallacious.
Mandy describes methods to ask questions with out difficult individuals like me.
From the limitless MDN information archive…
Have you learnt there’s an HTTP response header to manage and clear the browser cache? Now you do!
Have you ever ever thought-about individuals studying your website with translation instruments? Right here in Germany, I do know many individuals who use Chrome’s translate button; heck, I generally hit it myself. However how do these translation instruments know what to translate? They do not, and if you wish to keep away from damaged content material, it’s important to give some steering. You’ll be able to learn extra about it on the weblog.
For those who’re counting on native dialogs, you may admire this one. requestClose
is a cancellable option to shut dialog components, and it simply went into the baseline.
Our buddies from the Evil Martians (the oldsters behind oklch.com) launched a brand new shade palette generator. What’s cool about it?
It makes use of the APCA distinction ratio as a substitute of the WCAG one and supplies colours in oklch
. Good!
Over the past months, I discovered that I will be deeply offended when somebody dumps a half-assed LLM response on me. It disappoints me as a result of this habits reveals an absence of respect. It is no shock I deeply agree with Tim right here.
If all you do is dump the output of a immediate on somebody, higher ship them the immediate […] or do nothing in any respect.
❤️ If that’s the case, be a part of 23 different Internet Weekly supporters and provides again with a small month-to-month donation on Patreon or GitHub Sponsors.
Beloved this electronic mail? Hated this electronic mail? I wish to hear about it!
For those who suppose one thing wants enchancment or one thing sparked some pleasure, reply to this electronic mail as a result of I wish to know extra!
And with that, care for your self – mentally, bodily, and emotionally.
I am going to see you subsequent week! 👋