Links
CSS Findings From Photoshop Web Version
A few weeks ago, Adobe released a web version of Photoshop that is built with the web technologies like WebAssembly, web components, P3 colors, and a lot more. I thought it would be interesting to see how the CSS was written for such a massive app like Photoshop.
CSS relative color syntax
Create new colors based on another color's channels and values. In Chrome 119 is a very powerful color feature from CSS Color Level 5. Relative color syntax creates a smooth path for color manipulation within CSS, offering ways for authors and designers to lighten, darken, desaturate, adjust opacity, and more!
We're Bringing Responsive Video Back!
Responsive video is a web standard again, and it has been working in Safari for well over a decade, meaning iOS users can already benefit from responsive video. Start using it wherever it makes sense for you!
Scroll-Driven State Transfer
In my fourth article about scroll-driven animations, I explore how we can transfer the state of one element to a completely different place on a page by connecting them with a unique identifier in CSS via a
timeline-scope
.
The Three Cs: 🤝 Concatenate, 🗜️ Compress, 🗳️ Cache
In the current landscape, bundling is still a very effective strategy. Larger files compress much more effectively and thus download faster at all connection speeds. Further, queueing, scheduling, and latency work against us in a many-file setup.
Videos
I asked people to make this simple layout and was surprised by the results
I asked my Discord community to create a layout based on a .jpg, and had almost 100 submissions where people used flexbox, grid, and even tables to create the layout, so I thought it'd be a fun learning opportunity to take a look at the different approaches, looking at all their strengths and weaknesses, and seeing if we can't find a "best" approach.
Sponsor
Sponsored by Cloud Four
Thanks to Cloud Four for sponsoring this week’s newsletter! They solve complex responsive web design and development challenges for ecommerce, healthcare, fashion, B2B, SaaS, and nonprofit organizations.
If you’d like to help with the costs of running Friday Front-End, you can back our Patreon for as little as a dollar a month.