Raindrop.io Bookmarks 12/31/2024

2024年12月31日 著

• align-content: The Simplest Way to Center Content with CSS

  "Block layouts have been part of CSS since the beginning, but they've always lacked proper alignment controls. Now, with align-content support in block layouts, we can distribute content vertically with the same flexibility we've enjoyed in flex and grid."

• Using iframes to embed arbitrary content is probably a bad idea - tempertemper

  "Apple's Safari, when full keyboard access is turned on, includes the iframe in the tab index the first time it is encountered. Subsequent attempts to tab onto the iframe won't work and it will behave just like Firefox, Chrome, and Chromium-based browsers."

• Dataviz accessibility principles, demonstrated by the 2024 presidential election dashboards. by Sarah L. Fossheim

  "Comparing the outcomes of my tests from 2024 with those from 2020, it feels like not much has changed. The charts are still not accessible to people using assistive tech, interaction is not accessible to keyboard-only users, the layouts are not zoomable, there are issues with the colors, explanations are lacking, and some of the dashboards had up to 800+ automatically detectable errors."

• Declarative Shadow DOM | 12 Days of Web

  "Web components have always promised reusable, isolated, and standards-based solutions for building modern web applications. Yet, challenges like server-side rendering (SSR), static site generation (SSG), performance, and accessibility have often kept developers reliant on frameworks and custom solutions. Declarative Shadow DOM bridges these gaps, unlocking the full potential of web components for the modern web platform."

• CSS content-visibility | 12 Days of Web

  "content-visibility makes it easy to hide content, completely skip rendering, and to opt-in to greater performance when we find ourselves in situations filled with content."

• Animating Entry Effects | 12 Days of Web

  "The transition property allows for a constituent property transition-behavior, which may be set to allow-discrete, which will allow CSS to animate between discrete values."