Benjamin SmedbergDec 11
Jen Simmons

Web developers and designers,

If you had a chance to instantly learn something about web technology — tech that already shipped, maybe even long time ago — what would you want to learn?

What’s still confusing?
What just doesn’t make sense?
Or what’s something you just haven’t had time to master yet??

Could even be something small — like “why does this one CSS value work like this?!”

Dec 11 at 10:14pmWeb
Show threadjlinDec 11
@jensimmons I'd like to learn Fortran (instantaneously) - that feels very useful.
Show threadjlinDec 11
@jensimmons oops that's not web tech
Show threadJen SimmonsDec 11
@jlin It’s still a hilarious idea. If we are going that far back, I have a list of what I wish I knew from the 80s-90s.
Show threadSteve BarnesDec 11

@jensimmons –

I think I'd say service workers remain the potentially most interesting thing I've made note to try really grasping but keep deciding to put aside in light of the technical landscape.

Show threadZ(achary) YaroDec 12
@Starfia @jensimmons Yes! I love some of the clever things I have learned to do with service workers, but if I want simple offline caching à la app cache, it always ends up feeling overcomplicated.
Show threadSteve BarnesDec 12

@ZMYaro –

That's the most typical use. I'm pretty sure WebKit still supports the early App Manifest, but I think it's something of an outlier in that. I can look it up and do it, but not without feeling like there's a handful of general concepts underpinning it that I ought to understand.

Show threadEric JDec 11
@jensimmons I’m still sort of pretending to understand grid. I just throw around values until something works. No idea what minmax() means.
Show threadPhilMcfaceDec 11
@jensimmons websockets is something I’m trying to learn atm
Show threadAnton Andreasson GistedtDec 11
@jensimmons CSS anchoring and how it differs from positioning.
Show threadCarol McKay (she / her)Dec 11
@naton @jensimmons it eventually clicked for me that anchoring IS positioning, but responsive to the layout/device being used.
Show threadChris ArmstrongDec 11
@jensimmons subgrid for me, haven’t had time to properly get my head around it though I know it’s potentially really powerful
Show threadRenaud BerthierDec 11
@jensimmons XSLT, because I have a hunch this tech may be very underused for some cases. I wonder about performance compared to current template engines (in SSR).
Show threadPhil DokasDec 12

@jensimmons Robust overviews of the incredible new things in CSS.

* Flexbox and grid: an overview (like a flow chart, written out) of how to approach deciding which layout mechanism to use (e.g. template? manual? flexbox?)

* Typography: similarly, just a huge comprehensive guide through all the new tools. There are so many! Many are standalone but they all work towards similar goals of beautiful, powerful typographic support.

* New territory: more guides on new things like view-transitions.

Show threadJustin FerrellDec 12
@jensimmons I am asked about the new(ish) color functions in #CSS a lot and I never have a good answer for how we can use them. In my line of work (ad agency) we are almost always given a style or brand guide with a list of hex values and I haven’t been able to get my head around how the new CSS color functions help us, even though they seem awesome. I’m usually first to be like WE CAN USE THIS but color functions haven’t clicked for me.
Show threaddamianwalshDec 12
@developerjustin @jensimmons Client has a couple of colours and now wants to add more for some reason. OKLCH makes it easy to apply colour theory to select new colours that work in harmony with the existing primary brand colour by adjusting the hue angle. Or they have some tints and shades defined for the primary but not the other colours. Those lightness and saturation (chroma) values from the primary can be applied to the others.
Show threadPaweł GrzybekDec 12

@jensimmons There have been so many changes related to colours in CSS recently, it is out of my head. I would love to understand it all.

Also, going a little bit deeper. I think I have a solid understanding of the HTTP protocol, but nothing beyond the very basics. I would like to understand it deeply, including v2, v3 and all the other things around it.

Show threadKevin Boyd (he/him) 🇨🇦Dec 12

@jensimmons @awoodsnet websockets!

I guess it's more that I'd like an opportunity to play with them. But barring that, instantly learning about them is good too. :)

Show threadFuqiao XueDec 12
@jensimmons Service Workers
Show threadCurtis Bridges Dec 12
@jensimmons CSS stacking context. It just won’t click.
Show threadZ(achary) YaroDec 12
@jensimmons +1 to service workers, and also CSS grid. For both, I would find it specifically valuable to learn simpler ways to achieve common use cases. I think those are the APIs I most frequently find myself overcomplicating things with or not realizing a useful feature exists.
Show threadAdële 🐁!Dec 12

@jensimmons CORS always give headaches when I have to set them.

https://fetch.spec.whatwg.org/#http-cors-protocol

Fetch Standard

Show threadNathan SnelgroveDec 12
@jensimmons a lot of the new CSS stuff has been coming so fast that I worry I won’t be able to keep up. Filters, shapes, if statements, and functions in CSS?!? I need so many explainers.
Show threadozamidasDec 12

@nathansnelgrove @jensimmons wait what????

So now CSS is gonna be turing complete???
Sounds like a new avenue for exploits

Show threadKatrin K.Dec 12

@jensimmons width and height calculations by the browsers. when does a width: 100%; help, when is it useless? why does height:100%; in some cases use an ancestor’s height, but in others not? how does the block formatting context play into this?

over the years i’ve read about edge cases and things to keep in mind. some form of case-based cheat sheet would be great.

Show threadRaiXDec 12
@jensimmons haven’t had time to go into the details of subgrid yet, but look useful
Show threadJesseDec 12
@jensimmons If I'm doing it for the fun factor I would say the Web MIDI API 🙂
Show threadOlliewDec 13

@jensimmons

cross-origin() and referrer-policy() CSS URL modifiers. Haven't properly read up on them yet and I'm not sure when I'd use these or what their use case is.

The CSS contain property. I've read the entire MDN page and still don't fully get it.

Show threadOllie BoermansDec 13
@jensimmons I have a pile of links relating to view transitions to study. Those instantly yes please.
Show threadDave EverittDec 14
@jensimmons I'm still not completely clear how (not why) unitless line-height works better than using "lh"? Or whether it's best to pin everything to multiples of a line-height defined to fit a grid?
Show threadalwillisDec 17
@cubeExplorer Take a look at https://every-layout.dev/layouts/stack/
The Stack

A composable CSS layout primitive.

Show threadalwillisDec 17
@cubeExplorer And also this showing why unit-less line-height is usually what you want: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/line-height#prefer_unitless_numbers_for_line-height_values
line-height - CSS | MDN

The line-height CSS property sets the height of a line box in horizontal writing modes. In vertical writing modes, it sets the width of a line box. It's commonly used to set the distance between lines of text. On block-level elements in horizontal writing modes, it specifies the preferred height of line boxes within the element, and on non-replaced inline elements, it specifies the height that is used to calculate line box height.

MDN Web Docs
Show threadTorbDec 15
@jensimmons Get a *good* grip on accessibility. Always felt bad about not knowing enough, but the more I learn the bigger and more daunting it seems.
Show threadDerek MartinDec 16
@jensimmons setting up Docker