#ProgressiveEnhancement

Inautilo

@inautilo.bsky.social

1 day ago

Building dynamic toggletips using anchored container queries Anchored container queries are only available in Chrome 143 upwards right now, but here’s Daniel Schwarz to show you how to use progressive enhancement to build up to using that new capability in the...

#Development #Techniques
Building dynamic toggletips · A prime example for anchored container queries ilo.im/16bc8d by Daniel Schwarz

_____
#ModernCSS #AnchorPositioning #ContainerQueries #Toggletips #Popover #ProgressiveEnhancement #WebDev #Frontend #CSS

Inautilo

@inautilo.bsky.social

2 days ago

Beyond border-radius: What The CSS corner-shape Property Unlocks For Everyday UI — Smashing Magazine For years, developers have been hacking around the limitations of `border-radius`, using clip-path, SVG masks, and fragile workarounds just to get anything other than round corners. The new `corner-shape`...

#Development #Guides
Beyond CSS ‘border-radius’ · What the new ‘corner-shape’ delivers to everyday UIs ilo.im/16bc4i by Brecht De Ruyte

_____
#ModernCSS #Cards #Buttons #Batches #Tags #ProgressiveEnhancement #Browsers #WebDev #Frontend #CSS

Michaël Vanderheyden

@th3s4mur41.me

2 weeks ago

Why we teach our students progressive enhancement | Blog Cyd Stumpel With new CSS features seemingly coming out every week, I’ve been doing more and more progressive enhancement (PE) in my projects. It’s also a big part of what we teach our students at the Associate De...

Progressive enhancement should be a core part of how developers are taught.
@cydstumpel.nl explains perfectly why starting with a solid #HTML baseline and enhancing with CSS/JS leads to resilient, accessible experiences.

Great read: cydstumpel.nl/why-we-teach...

#WebDev #ProgressiveEnhancement

Inautilo

@inautilo.bsky.social

1 month ago

Nice Select · February 3, 2026 Building a modern custom select with base-select.

#Development #Demos
Nice Select · Pushing customizable HTML ‘select’ to an extreme ilo.im/16actc by Adam Argyle

_____
#ModernCSS #HtmlSelect #Accessibility #ProgressiveEnhancement #Browsers #WebPerf #WebDev #Frontend #HTML #CSS

Inautilo

@inautilo.bsky.social

1 month ago

When will CSS Grid Lanes arrive? How long until we can use it? Anytime an exciting new web technology starts to land in browsers, developers want to know “when in the world am I going to be able to use this?” Currently, the finalized syntax for Grid Lanes is...

#Development #Previews
When will CSS Grid Lanes arrive? · “It’s going to arrive sooner than you think.” ilo.im/16a21t by Jen Simmons

_____
#ModernCSS #CssGrid #Layout #Masonry #Polyfill #ProgressiveEnhancement #Browsers #WebDev #Frontend #CSS

Inautilo

@inautilo.bsky.social

1 month ago

Better defaults for popovers - Manuel Matuzovic I recently added a rule to my reset style sheet UA+ that I wanted to share with you.

#Development #Techniques
Better defaults for popovers · A small anchor-repositioning with a big effect ilo.im/169wki by Manuel Matuzović

_____
#ModernCSS #Popover #Buttons #AnchorPositioning #HtmlDialog #ProgressiveEnhancement #WebDev #Frontend #CSS

Inautilo

@inautilo.bsky.social

2 months ago

Introducing the <geolocation> HTML element  |  Blog  |  Chrome for Developers Discover the new way to request user location data.

#Development #Introductions
Introducing the HTML ‘geolocation’ element · What it does and how to use it ilo.im/169tah by Mari Viana, Minh Le and Thomas Steiner

_____
#HTML #Geolocation #FeatureDetection #Polyfill #ProgressiveEnhancement #Chrome #Browser #WebDev #Frontend #Releases

Inautilo

@inautilo.bsky.social

2 months ago

4 CSS Features Every Front-End Developer Should Know In 2026 · January 7, 2026 Toolbelt worthy, powerful, and game-changing CSS you need for 2026.

#Development #Techniques
4 must‑know CSS features in 2026 · “Toolbelt worthy, powerful, and game-changing CSS.” ilo.im/169nsr by Adam Argyle

_____
#ModernCSS #Staggering #Scrolling #Typography #TypeSafety #Animations #ProgressiveEnhancement #WebDev #Frontend #CSS

Inautilo

@inautilo.bsky.social

2 months ago

A Production-Ready Web Component Starter Template :: Aaron Gustafson Creating a new web component from scratch involves a lot of boilerplate—testing setup, build configuration, linting, CI/CD, documentation structure, and more. After building — and refining/rebuilding...

#Development #Templates
Web component starter template · The essentials to ship production-ready components ilo.im/169jml by Aaron Gustafson

_____
#WebComponents #CustomElements #Accessibility #ProgressiveEnhancement #Encapsulation #ShadowDOM #Testing #Npm #WebDev #Frontend

Inautilo

@inautilo.bsky.social

2 months ago

Dialog view transitions · Medienbäcker Thomas Günther Combining view transitions and the dialog element, possible?

#Development #Techniques
Dialog view transitions · Smooth animations for native HTML dialogs ilo.im/1698lv by Thomas Günther

_____
#HtmlDialog #ViewTransitions #API #ProgressiveEnhancement #Browser #WebDev #Frontend #DOM #HTML #JavaScript

Inautilo

@inautilo.bsky.social

3 months ago

How to load CSS (fast) Loading styles on the web is something that looks trivial at first. You just add a <link rel=stylesheet> to your page (or <style> for inline styles) and you're done. But if you wanted to load CSS fast,...

#Development #Approaches
Loading CSS (fast) · How Compression Dictionaries boost CSS delivery ilo.im/16950n by Yoav Weiss

_____
#CSS #CriticalCSS #CompressionDictionaries #ProgressiveEnhancement #Chromium #Browser #WebPerf #WebDev #Frontend #Backend

Inautilo

@inautilo.bsky.social

3 months ago

GitHub - tomayac/input-switch-polyfill: A polyfill for <input type="checkbox" switch> A polyfill for <input type="checkbox" switch>. Contribute to tomayac/input-switch-polyfill development by creating an account on GitHub.

#Development #Launches
Input switch polyfill · A polyfill to turn checkboxes into modern switches ilo.im/16938w by Thomas Steiner

_____
#Switch #Forms #Polyfill #ProgressiveEnhancement #Browser #WebDev #Frontend #HTML #CSS #JavaScript

Inautilo

@inautilo.bsky.social

3 months ago

Speculation rules improvements - HTMHell A collection of bad practices in HTML, copied from real websites.

#Development #Techniques
Speculation rules improvements · What’s new and next with the Speculation Rules API ilo.im/168vcy by Barry Pollard

_____
#Prefetching #Prerendering #API #ProgressiveEnhancement #Chrome #Browser #WebPerf #WebDev #Frontend #JavaScript

Inautilo

@inautilo.bsky.social

3 months ago

Enhancing Web Components Safely with Self-Destructing CSS | Scott Jehl, Web Designer/Developer Applying the self-destructing CSS pattern to an old web components anti-pattern

#Development #Techniques
Web components with self-destructing CSS · A safer approach to loading web components ilo.im/168hrq by Scott Jehl

_____
#Visibility #Content #WebComponents #ProgressiveEnhancement #GracefulDegradation #WebDev #Frontend #HTML #CSS #JavaScript

Inautilo

@inautilo.bsky.social

4 months ago

meyerweb.com In which I turn inline asides into robustly enhanced sidenotes with CSS and just a touch of JS.

#Development #Approaches
Custom asidenotes · Practical side notes using a custom HTML element ilo.im/1680ot by Eric A. Meyer

_____
#SideNotes #Content #Blog #WebComponents #ProgressiveEnhancement #WebDev #Frontend #HTML #CSS #JavaScript

Frontend Dogma

@frontenddogma.com

5 months ago

A Progressive Enhancement Challenge You want to hide an interactive element that you don't need anymore after JavaScript loads/runs. Can you do it without a

A Progressive Enhancement Challenge, by @chriscoyier@front-end.social (@frontendmasters.com):

frontendmasters.com/blog/a-progressive-enhan...

#progressiveenhancement #javascript #html #featuredetection #support

Inautilo

@inautilo.bsky.social

5 months ago

#Development #Proposals
The future of HTML range inputs · Demos for the proposed ‘rangegroup’ element ilo.im/167dpi by Brecht De Ruyte

_____
#HTML #Forms #RangeGroup #Slider #Accessibility #ProgressiveEnhancement #Browser #API #WebDev #Frontend

Inautilo

@inautilo.bsky.social

5 months ago

What You Need to Know about Modern CSS (2025 Edition) If you thought 2024 was packed with amazing new CSS, well, you're right. But so is 2025 and it keeps looking bright. Check out our list of the best stuff with easy-to-reference examples.

#Development #Overviews
What to know about modern CSS in 2025 · There is more this year than there was last ilo.im/16711o by Chris Coyier

_____
#ModernCSS #BrowserSupport #ProgressiveEnhancement #Polyfill #Browser #WebDev #Frontend #HTML #CSS #JavaScript

Frontend Dogma

@frontenddogma.com

6 months ago

Why You Should Test Your Page Without JavaScript, by (not on Mastodon or Bluesky):

www.sitepoint.com/test-your-page-without-j...

#javascript #support #progressiveenhancement #accessibility

Scripter

@scripter.bsky.social

7 months ago

HTML-First, Framework-Second: Is JavaScript Finally Growing Up? Instead of starting with a framework, smart frontend developers now begin with HTML and enhance it progressively with JavaScript.

HTML-First, Framework-Second: Is JavaScript Finally Growing Up?
thenewstack.io/html-first-f...
#HTML #JavaScript #ProgressiveEnhancement #Frameworks #Browser #WebPerf #WebDev #Frontend

Miguel Carvalho

@miguelcarvalho.xyz

8 months ago

Feature-detect inline!

If the browser groks OKLCH you get vivid color, else safe fallback.

#ProgressiveEnhancement

Frontend Dogma

@frontenddogma.com

8 months ago

Custom Select (that comes up from the bottom on mobile) You've got A LOT of control over the design of select menus now, and it can be done as a progressive enhancement.

Custom Select (That Comes Up From the Bottom on Mobile), by @chriscoyier@front-end.social (@frontendmasters.com):

frontendmasters.com/blog/custom-select-that-...

#html #forms #css #animations #progressiveenhancement

Louise-Esperance Honore

@louiseesperance.bsky.social

8 months ago

Weekend reflection: Progressive enhancement should be the foundation of accessible design. Build core functionality that works with keyboards and screen readers first, then layer visual enhancements on top. #ProgressiveEnhancement #AccessibleDevelopment #WebDesign

Rasmus Fløe

@phloe.co

9 months ago

Wow, nice.

Do you use it as #ProgressiveEnhancement and leave Saf and FF users without the anims?

I work at DR (danish equiv to BBC) - and the ppl making decisions expect the same exp on all browser versions - 2 😞

So any time I can point to another Public Service org using PE is a win for me 🙂

DanQ.me

@blog.m.danq.me.ap.brid.gy

10 months ago

[Article: Dynamic Filters in Pure CSS]

CSS is powerful and performant. Let's implement client-side list filtering (with the user's choice of AND and OR modes) in CSS, without a line of JavaScript.
Read more: https://danq.me/2025/05/07/dynamic-filters-in-pure-css/

#article #css #programming […]

Web Directions

@webdirections.org

11 months ago

Jeremy Keith's HTML web components pattern uses meaningful HTML as a base, enhancing it with lifecycle features for progressive enhancement, making we…re functional. #WebComponents #ProgressiveEnhancement watch @scottjehl.com from @webdirections.org Dev Summit '24. Watch More: bit.ly/4iM2Rch

James Nash

@cirrus.mstdn.social.ap.brid.gy

1 year ago

Pleased to be sneaking some #ProgressiveEnhancement into the #DesignSystem we're building at Investec.

Currently making an Accordion component using #HTML <details> & < summary>, which requires zero client-side #JS. Until #interop2025 brings ::details-content support to Firefox & Safari, the […]

ayo

@ayo.run

1 year ago

Idea for the **ultimate** optimization on Cozy.

Currently the scraper only lives on the server, which is good for zero-js scenarios.

Now thinking to download the scraper when user is idle (probably when reading) so subsequent requests for scraping (when you click a link or submit a url via […]