Scott Jehl

Independent Web Designer/Dev. Accessibility & Performance Fan. Author, Speaker, Mediocre surfer. Working on a Web Components course!

Alum: WebPageTest, Filament Group, jQuery

Website: https://scottjehl.com/
Web Components Demystified: https://scottjehl.com/learn/webcomponentsdemystified/
Blog: https://scottjehl.com/posts/
Web Performance Course: https://www.webpagetest.org/learn/lightning-fast-web-performance/

Public Key

npub133e0khgx56jygttzm705s8l377g7j2zcnuj8e7yn92h59c9keheqe6rqrd

NIP-05 Address

[email protected]

Profile Code

nprofile1qqsgcuhmt5r2dfzy943dl86grlcl0y0f9pvf7frulzfj4t6zuzmvmuspz3mhxue69uhhyetvv9ujuerpd46hxtnfduqs6amnwvaz7tmwdaejumr0dsjr6l6d

Publishing to

relay.damus.io

nos.lol

Author Public Key

npub133e0khgx56jygttzm705s8l377g7j2zcnuj8e7yn92h59c9keheqe6rqrd

Show more details

Last Notes

2024-07-21 22:37:56

Let's say you needed a responsive <audio> element that endlessly plays either a chicken cluck or a t-rex roar, depending on the viewport width. But also, you wanted that audio selection to be responsive not only on page load (which comes natively for <audio> now (...you're welcome, I guess?)) but after that as well, such as whenever you resize the window? Well, that'd make two of us then https://scottjehl.com/sandbox/video-media/reallyrwdaudio

2024-06-28 16:15:00

My book, Responsible Responsive Design, turns 10 this year! As tech books go, I like to think it has aged pretty well. Many of the technical problems & solutions it covers have of course evolved, but the goals of building for broader web access and faster performance remain relevant as ever.
I'm exploring ideas for its future, but from now until I mention otherwise, 100% of my royalties will be donated to Moms Demand Action & Everytown for Gun Safety. Happy 10, RRD!
https://bookshop.org/p/books/responsible-responsive-design-scott-jehl/20097181?ean=9781952616426
https://media.mstdn.social/media_attachments/files/112/694/633/207/678/822/original/e2dffacac758d054.png

2024-06-26 17:34:38

A nice series of replies today has led me to feel comfortable about recommending the data- prefix for any custom attributes you use on custom elements (web components).
3 nice reasons:
1) no chance of future collisions with standards,
2) clarity that the attribute is not for standard HTML behavior
3) built-in property/attribute syncing for getting and setting with myElement.dataset is really convenient.

2024-06-26 16:30:56

Curious if there's any writing out there that I may have missed about attribute naming conventions/choices for custom elements? Current practices with attributes across WC frameworks and published components seems to be... just make up a reasonable name that isn't already a global HTML attribute. But what if that name collides with a future standard global attribute and ends up breaking things? Prefixes are common with element names but not attributes. Why? Any thoughts on this out there? Thx!

2024-06-20 17:11:39

- reply

Like, yes, they make stuff up sometimes. They also can for example, in 10 literal seconds, list 20+ family-friendly activities happening in NYC on a given saturday–a task that would have taken an hour sifting through bookmarks and searches. (Swap in a thousand other use cases.) Just seems like the output is the smallest problem among a lot of very big ones that make me not want to use LLMs, yet it gets so much attention?

2024-06-20 16:58:34

There's a lot about AI/ML that feels deeply problematic/worrying/dire to me but the frequent dismissive takes I see about the value and usefulness of these tools' output just doesn't match what I typically observe when I use them. I'm not sure what to make of that mismatch.

2024-06-07 23:04:27

- reply

I wanted to add: finding the right role in tech right now is atypically hard. It took me a while to find the right fit (I originally started talking with this particular team last fall!). If you've been looking, hang in there! And anecdotally, I think things have started to pick up again too. 👊

2024-06-07 22:47:29

Just signed an offer! Super excited for this next phase in my career. Can't wait to share more soon. Let's get this weekend started 🥳

2024-05-29 22:44:57

New on my blog:
A Responsive Video Wishlist.
In this post I return to my bs with some responsive video features on my wishlist, and 4 WhatWG issues for their specific discussion: https://scottjehl.com/posts/rwd-video/

2024-05-20 18:09:00

There's a shift underway in front-end development. The largest companies in the world are now building on Web Components, and they are hiring! I want this course to help designers and devs prepare for this next phase of the web. Help spread the word! 📣
https://www.kickstarter.com/projects/scott-jehl/web-components-demystified
https://media.mstdn.social/media_attachments/files/112/474/284/179/806/996/original/090462f234335a77.png

2024-05-18 22:21:49

So damn impressive to see some of the more complex things that are being built on top of web components right now. Being able to inspect the DOM in Photoshop's web UI and see how it's all composed of web components with their svg icons and aria attributes all working in sync... it's just amazing!

2024-05-17 21:25:09

In watching talks this week about all that has recently landed or is on the way right now, I don't recall a time when useful features were standardizing and landing in browsers at anything near the speed we're seeing now. So many JS workarounds are being replaced with simple, often elegant declarative alternatives. Great to see

2024-05-13 16:01:42

xhtml is for closers

2024-05-09 15:56:24

🥳 ANNOUNCEMENT! 🥳
I just launched a campaign to crowdfund my next online course:
**Web Components Demystified**. Coming this Summer! Build fast, dynamic, resilient apps for the next phase of the web!
The campaign has 29 days left. Please help make this project happen and help me spread the word! Thank you so much.
https://www.kickstarter.com/projects/scott-jehl/web-components-demystified

2024-04-20 02:17:17

Friday at 8PM is a great time to soft-launch a thing right? 🥳
This is something I aim to make! I'm excited. It'll mainly be about Web Components, but in the context of building resilient, fast, accessible websites. A holistic take!
I'm planning a different approach for it, using a presale (soon) to gauge interest and shape the scope of what I end up making. I'll appreciate some help making noise about it soon, but for now it's a coming soon page and email collector :)
https://scottjehl.com/learn/webcomponentsdemystified/

2024-04-05 05:15:36

- reply

As an aside, I'd love to see frontend engineer interviewers ask folks how they'd do things like this. "How would you build [popular app] if you could only use HTML and CSS? Which features would require you to use JS to pull off even in a basic way? Can you envision a fictional future standard that would make this easier?"
It would reveal a lot about a candidate's knowledge of web standards, and ideally select for folks who can help us all move away from JS over-reliance!

2024-04-05 04:53:53

- reply

...really wanted to find a way to get that second demo's behavior without JS but I didn't get there. I even tried making the qwerty keyboard out of loads on radio inputs at one point.
...don't try that.

2024-04-05 04:48:23

- reply

There's another linked fork in there that adds a few lines of JS to validate the exact letter matches so that the pattern attribute can drive the tan colors. It made me wish HTML and CSS validation had a little finer grain, ...or that the pattern attribute accepted and exposed capturing parentheses to selectors? :)

2024-04-05 04:40:42

I was tinkering a bit today and it turns out you can pull off a decent amount of Wordle's gameplay with just HTML and CSS. Fun little form validation and CSS selector refresher experiment, anyway.
https://codepen.io/scottjehl/details/LYvQxqa