Container queries are going to solve this long-standing issue in web design where we want to make design choices based on the size of an element (the container) rather than the size of the entire page. So, if a container is 600px wide, perhaps it has a row-like design, but any narrower than that it has a column-like design, and we’ll have that kind of control. That’s much different than transitioning between layouts based on screen size. We can already size some things..

• 0 Comment

When I came up in web development (2005-2010 were formative years for me), one of the first lessons I learned was to have a clean foundation of HTML. “What Beautiful HTML Code Looks Like” is actually one of the most popular posts on this very site. The image in that post made its way to popular pages on subreddits every once in a while. Now, while I still generally write HTML like that by default when working on sites like this one, I also work on projects that don’t..

• 0 Comment

Logging, on its own, is a key aspect of any application. Logging helps developers comprehend what it is that their code is doing. It also helps save developers hours of debugging work. This tutorial is about implementing logging in a Node.js application using Pino-logger. With logging, you can store every bit of information about the flow of the application. With Pino as a dependency for a Node.js application, it becomes effortless to implement logging, and even storin..

• 0 Comment

CSS is on a tear lately. Again, I’ve heard of a brand new thing I’ve never seen before, and again it’s via Miriam: CSS Conditionals. 🎉 CSSWG just resolved to adopt @tabatkins when/else proposal into the next level of CSS Conditionals. Here's the proposal:https://t.co/IXEOK7xKcL— Miriam (But Terrible) (@TerribleMia) September 15, 2021 There is already such a thing as logic in media queries. In fact, a media query is already logic. @media (min-width:..

• 0 Comment

There is a new thing coming in CSS: @layer. As with all new things, it takes time to really wrap your head around it. And despite me tapping at my keyboard about it, full disclosure, I’m not sure my mind is fully there yet. Fortunately, smart people are on the case! This comes from Miriam Suzanne, who is really on a tear with influencing important new CSS stuff. I’ve been hearing about all this, but then all the sudden it just dropped in experimental browsers: ..

• 0 Comment

CSS ::before and ::after pseudo-elements allow you to insert “content” before and after any non-replaced element (e.g. they work on a <div> but not an <input>). This effectively allows you to show something on a web page that might not be present in the HTML content. You shouldn’t use it for actual content because it’s not very accessible in that you can’t even select and copy text inserted on the page this way —  it’s just decorative content. ..

• 0 Comment

(This is a sponsored post.) The web’s premier conference is online this fall, October 11–13, 2021: An Event Apart Full Summit. If you already know how good of a conference this is (i.e. that some of the web’s biggest ideas debut at AEA) then just go buy tickets and please enjoy yourself. You can buy literally any combination of the three days. That coupon code, AEACSST21, is good for $100 off if you buy two or more days. That’s only half! If you’d like to ..

• 0 Comment

This is a good tweet from Harry: Simple yet significant thing all developers should keep in mind: CSS resources (fonts, background images) are not requested by your CSS, but by the DOM node that needs them [Note: slight oversimplification, but the correct way to think about it.]— Harry Roberts (@csswizardry) September 10, 2021 I like it because, as he says, it’s the correct way to think about it. It helps form a mental model of how websites work. Just to s..

• 0 Comment

I’ll never forget one of Karen McGrane’s great lessons to the world: truncation is not a content strategy. The idea is that just clipping off text programmatically is a sledgehammer, and avoids the kind of real thinking and planning that makes for good experiences. Truncation is not a content strategy. pic.twitter.com/sMfVCWUGJV— Karen McGrane (@karenmcgrane) October 10, 2014 Truncation is not a content strategy pic.twitter.com/F3kjgOOnbv— Karen McGr..

• 0 Comment

It’s not every day you see a new processor for building websites that reinvents the syntax for HTML and CSS and JavaScript. That’s what imba is doing. That’s an awful lot of vendor lock-in, but I guess if you get over the learning curve and it helps you build performant websites quickly, then it’s no different than picking any other stack of processing languages. I would hope their ultimate goal is to compile to native apps across platforms, but if not,..

• 0 Comment