# Site

This file helps language models discover the most useful content on this site.

## Home

- [roland.](https://rolandfranke.nl): Roland Franke's personal blog. Discover a creative frontend developer with expertise in HTML, CSS, React, and accessibility, dedicated to build inclusive and innovative web experiences. Explore projects, professional experience, and insights on modern web development.

## About

- [Hi, I'm Roland 👋](https://rolandfranke.nl/about): About Roland Franke — frontend developer focused on semantic HTML, modern CSS, accessibility and thoughtful web experiences.

## Frontend-stories

- [Frontend Stories](https://rolandfranke.nl/frontend-stories): Explore CSS, JavaScript, and frontend insights. Tips, techniques, and ideas for building accessible, modern web experiences.
- [CSS display masonry](https://rolandfranke.nl/frontend-stories/css-display-masonry): CSS Masonry should be part of display: grid to streamline layouts, avoid fragmentation, leverage Grid's features, and provide a consistent developer experience.
- [CSS field-sizing: content Is Finally Baseline](https://rolandfranke.nl/frontend-stories/css-field-sizing-content): Learn how CSS field-sizing: content lets inputs and textareas size themselves to their content without JavaScript.
- [Using the CSS light-dark() Function for Easy Theme Colors](https://rolandfranke.nl/frontend-stories/css-light-dark-color-function): A simple introduction to the CSS light-dark() function and how it makes light and dark mode styling much easier.
- [CSS Unveils Its New Logo](https://rolandfranke.nl/frontend-stories/css-unveils-its-new-logo): Rebeccapurple becomes the official CSS logo color! Explore the new repo for formats and future variants, including CSS4, CSS5, and beyond. 💜
- [CSS Wrapped 2024](https://rolandfranke.nl/frontend-stories/css-wrapped-2024): Discover how CSS evolved in 2024 with subgrid, anchor positioning, and more, streamlining layouts and boosting developer ergonomics.
- [Drawing Connections with CSS Anchor Positioning](https://rolandfranke.nl/frontend-stories/drawing-connections-with-css-anchor-positioning): A practical exploration of CSS Anchor Positioning and the anchor() function to visually connect related elements without extra markup.
- [Redirecting to: /frontend-stories/exploring-the-new-search-element-in-html/](https://rolandfranke.nl/frontend-stories/exploring-the-new--search-element-in-html)
- [Exploring the new search element in HTML](https://rolandfranke.nl/frontend-stories/exploring-the-new-search-element-in-html): Discover the new <search> element in HTML, how it improves semantics and accessibility, and where to use it in your projects.
- [Mastering Layouts with CSS Grid](https://rolandfranke.nl/frontend-stories/mastering-layouts-with-css-grid): Explore my CSS grid system that's kept layouts flexible and responsive for years, with named columns and custom constraints for consistent design.
- [Scroll snap api suggestion](https://rolandfranke.nl/frontend-stories/scroll-snap-api-suggestion): "Snapflyover" describes elements briefly entering but not stopping in the snap zone, providing visual or interactive feedback during scroll snapping.
- [Scroll Spy with Pure CSS using scroll-target-group](https://rolandfranke.nl/frontend-stories/scroll-spy-with-pure-css): How the new CSS scroll-target-group and :target-current let you build a table of contents scroll spy without JavaScript.

## Sitemap

- [Sitemap](https://rolandfranke.nl/sitemap): Sitemap of Roland Franke's personal website, listing all pages and frontend stories for easy navigation.