I keep forgetting, but the alt attribute of the <img> element is not just useful for users who are visually impaired. It is also useful when the image is not displayed in the browser for whatever reason. For example: the src attribute does not contain a valid path to an image.
Notes
Brief notes from Arpit Agrawal on everything he is reading, learning and observing.
-
-
John Mayer on how trying and not doing it well enough is a wonderful technique for being yourself:
Failing to sound exactly like the person you want to sound like is a wonderful way to sound like yourself. So I’m not necessarily thinking this thing from scratch, going, Okay, I’m gonna, like, do Jerry-esque things, but I’m still gonna sound like me. No, it’s more like, I want to sound just like Jerry, and then the way I naturally, obviously don’t — that’s your personality. Music doesn’t let you lie. […] You try to sound like who you want to sound like, and you just will always end up sounding like you.
I like this advice. It is an interesting take on the learning by copying method.
-
I just purchased Josh Comeau’s new course, Whimsical Animations. The course page itself has some delightful animations.
PS: I also discovered Gochi Hand, a cute handwritten font, on the course page.
-
Just like a word document can be displayed in a word processing application, a web page is simply an HTML document that can be displayed in a web browser. The only difference is that a web page can embed a variety of different types of resources such as styles, fonts, images, scripts, and so on.
-
Stupid #CSS question because I’m losing my mind here: why isn’t calc(.5*a) working? What am I missing? It doesn’t seem to be working in any browser.
Ana is trying to use
calc(.5 * a)as a part of the relative color syntax, presumably to create semi transparent outlines. But it is not working becausecalc(.5 * a)is an invalid property value. As Valtteri Laitinen replied, it should actually bealphain there instead ofa..class {outline-color: rgb(from currentcolor r g b / calc(0.5 * a)); /* ❌ invalid */outline-color: rgb(from currentcolor r g b / calc(0.5 * alpha)); /* ✅ valid */} -
I re-read Heydon Pickering’s post on the HTML article element in the middle of writing the markup for a new website.
Heydon’s writing is so sharp and funny. Unmistakably theirs. No one else writes quite like them, and I’m here for it.
-
I was reading Manuel Matuzovic’s article on meta theme color and came across this snippet:
index.html <style>:root {--theme: blue;}</style><meta name="theme-color" content="var(--theme)" />I wish it was possible to access custom properties outside the
<style>tag in the<head>. It would keep things DRY. -
Thanks to Kevin Powell, today I learned that the
text-underline-offsetproperty is named so because it only applies to underlines and not othertext-decoration-linevalues likeoverlineandline-through.<a href="https://example.com">Example</a>a {text-decoration-line: underline overline; /* We can set multiple line-decoration properties at once */text-underline-offset: 16px; /* Only impacts underline */}