Links - Juan Fernandes - Freelance Web DesignerSharing links to articles I've read2026-07-04T15:28:18Zhttps://www.juanfernandes.uk/Juan Fernandesinfo@juanfernandes.ukA few developer console trickshttps://gomakethings.com/a-few-developer-console-tricks/CSS Custom Properties Beyond the :roothttps://matthiasott.com/notes/custom-properties-beyond-the-rootExpanding Grid Cards with View Transitionshttps://chriscoyier.net/2023/04/11/expanding-grid-cards-with-view-transitions/Batching Life Changeshttps://chrisburnell.com/article/batching-life-changes/Is It Time To Replace Sass?https://thinkdobecreate.com/articles/is-it-time-to-replace-sass/Giving context to a blogrollhttps://minutestomidnight.co.uk/blog/giving-context-to-a-blogroll/A CSS native way to prevent orphan texthttps://gomakethings.com/a-css-native-way-to-prevent-orphan-text/How Do You Vertically Centre an Element in CSS? (Even More) Easily!https://css-irl.info/how-do-you-vertically-centre-an-element-in-css/Local link targets must be focusable to prevent accessibility issueshttps://www.stefanjudis.com/today-i-learned/relative-html-links-focus-issues/Exposed RSShttps://chriscoyier.net/2024/01/13/exposed-rss/Sharing linkshttps://hidde.blog/sharing-links/Using abbr Element with title Attributehttps://adrianroselli.com/2024/01/using-abbr-element-with-title-attribute.htmlThe gotchas of CSS Nestinghttps://kilianvalkhof.com/2023/css-html/the-gotchas-of-css-nesting/6 Quick tests you can do to test your forms for accessibilityhttps://karlgroves.com/6-quick-tests-you-can-do-to-test-your-forms-for-accessibility/Creating Scroll-Triggered Animations by combining Scroll-Driven Animations, Custom Properties, Style Queries, and Transitionshttps://www.bram.us/2023/06/15/scroll-triggered-animations/Fetching Webmentions With Netlify and Eleventy Edgehttps://martinschneider.me/articles/fetching-webmentions-with-netlify-and-eleventy-edge/Testing My Eleventy-Website With Cypress and Netlifyhttps://martinschneider.me/articles/testing-my-eleventy-website-with-cypress-and-netlify/Time to First Byte: What it is and How to Make Improvementshttps://calibreapp.com/blog/time-to-first-byte12 Modern CSS One-Line Upgrades - Modern CSS Solutionshttps://moderncss.dev/12-modern-css-one-line-upgrades/Bulletproofing your CMShttps://www.nicchan.me/blog/bulletproofing-your-cms/Progressively enhancing a link into a button with vanilla JavaScripthttps://gomakethings.com/progressively-enhancing-a-link-into-a-button-with-vanilla-javascript/Better form UX with the CSS property `field-sizing`https://blog.stephaniestimac.com/posts/2024/01/css-field-sizing/A quick introduction to CSS @scopehttps://www.bram.us/2023/08/22/a-quick-introduction-to-css-scope5 key design system elements to build trust and maximise uptakehttps://adamsilver.io/blog/5-key-design-system-elements-to-build-trust-and-maximise-uptake/Reducing Complexity in Front End Developmenthttps://css-irl.info/reducing-complexity-in-front-end-development/Positioning anchored popovershttps://hidde.blog/positioning-anchored-popovers/I turned off analyticshttps://rachsmith.com/i-turned-off-analytics/No Analyticshttps://snook.ca/archives/opinion/no-analyticsNicer Text Wrapping with CSS text-wraphttps://codersblock.com/blog/nicer-text-wrapping-with-css-text-wrap/What happened with the Web Monetization API?https://chriscoyier.net/2024/01/24/what-happened-with-the-web-monetization-api/The article element and screen readershttps://www.matuzo.at/blog/2023/article-screen-readers/More than blogrollshttps://sebastiandedeyne.com/more-than-blogrolls/The details element and in-page search - Manuel Matuzovichttps://www.matuzo.at/blog/2023/details-find-in-page3 questions to evaluate design patterns and avoid unnecessary work that degrades UXhttps://adamsilver.io/blog/3-questions-to-evaluate-design-patterns-and-avoid-unnecessary-work-that-degrades-ux/Join the 11ty International Symposium on Making Web Sites Real Goodhttps://www.zachleat.com/web/11tyconf/Ditch the developer Swiss Army Knifehttps://gomakethings.com/ditch-the-developer-swiss-army-knife/4 Ways to Improve Mobile Accessibilityhttps://karlgroves.com/4-ways-to-improve-mobile-accessibility/What’s The Perfect Design Process?https://www.smashingmagazine.com/2023/06/perfect-design-process/Inside .githttps://jvns.ca/blog/2024/01/26/inside-git/CSS! CSS! CSS!https://www.matuzo.at/blog/2023/css-css-cssThoughts on a Global Design Systemhttps://chriscoyier.net/2024/02/05/thoughts-on-a-global-design-system/RSS Feed Styleshttps://dbushell.com/2024/02/06/rss-feed-styles/The Indie Web and the joy of being weirdhttps://gomakethings.com/the-indie-web-and-the-joy-of-being-weird/How to create rounded gradient borders with any background in CSS A solution!https://benfrain.com/how-to-create-rounded-gradient-borders-with-any-background-in-css/Blockquotes in Screen Readershttps://adrianroselli.com/2023/07/blockquotes-in-screen-readers.htmlWhen to use CSS text-wrap: balance; vs text-wrap: prettyhttps://blog.stephaniestimac.com/posts/2023/10/css-text-wrap/Pull request descriptionshttps://sebastiandedeyne.com/pull-request-descriptionsOwn Your Web – Issue 9: We ❤️ RSShttps://buttondown.email/ownyourweb/archive/issue-09/Eleventy Starter Project Updateshttps://css-irl.info/eleventy-starter-projects-updates/Super Fast Buildshttps://dbushell.com/2024/02/14/super-fast-builds/New and Improved Green Web Hosting Directory from the Green Web Foundationhttps://css-irl.info/new-and-improved-green-web-hosting-directory/Let's create a Web Component from scratch!https://gomakethings.com/lets-create-a-web-component-from-scratch/How to make external links accessiblehttps://blog.pope.tech/2024/01/02/how-to-make-external-links-accessible/Don’t Disable Form Controlshttps://adrianroselli.com/2024/02/dont-disable-form-controls.htmlAnimated SVG Logohttps://antfu.me/posts/animated-svg-logomastodon-post Web Componenthttps://darn.es/mastodon-post-web-component/Static Site Generators and CMS'shttps://gomakethings.com/static-site-generators-and-cmss/Decision timehttps://adactio.com/journal/20564Why Markdown is a great design toolhttps://www.benjystanton.co.uk/blog/why-markdown-is-a-great-design-tool/Read laterhttps://minutestomidnight.co.uk/blog/read-later/Automatic Mastodon post embedshttps://coryd.dev/posts/2024/automatic-mastodon-post-embeds/Tailwind is badhttps://gomakethings.com/tailwind-is-bad/Don't disable buttonshttps://gomakethings.com/dont-disable-buttons/Cut the Introhttps://robinrendle.com/notes/cut-the-intro/100 things you can do on your personal websitehttps://jamesg.blog/2024/02/19/personal-website-ideas/More Things You Can Do on Your Websitehttps://rknight.me/blog/more-things-you-can-do-on-your-website/Piccalilli Linkshttps://piccalil.li/blog/piccalilli-links/Own Your Web – Issue 10: Links Worth Sharinghttps://buttondown.email/ownyourweb/archive/issue-10/Now's the time to own and host your own contenthttps://coryd.dev/posts/2024/nows-the-time-to-own-and-host-your-own-content/Where I’m at on the whole CSS-Tricks thinghttps://chriscoyier.net/2024/02/28/where-im-at-on-the-whole-css-tricks-thing/Tailwind vs. Semantic CSShttps://gomakethings.com/tailwind-vs.-semantic-css/Capo.js: A five minute web performance boosthttps://frontendmasters.com/blog/capo-js-a-five-minute-web-performance-boost/How to create a responsive grid system with CSS Gridhttps://gomakethings.com/how-to-create-a-responsive-grid-system-with-css-grid/Which CSS framework should I use?https://gomakethings.com/which-css-framework-should-i-use/AI and accessible front-end components: is the nuance generatable?https://hidde.blog/ai-for-accessible-components/The path to becoming a publisher - Piccalillihttps://piccalil.li/blog/the-path-to-becoming-a-publisher/Automated weekly links posts with raindrop.io and Eleventyhttps://localghost.dev/blog/automated-weekly-links-posts-with-raindrop-io-and-eleventy/Deploy an Eleventy site to Cloudflare Pages efficiently with GitHub's action cachehttps://jonas.brusman.se/deploy-eleventy-to-cloudflare-with-githubs-action-cache/Simplify sharing with built-in APIs and progressive enhancementhttps://set.studio/simplify-sharing-with-built-in-apis-and-progressive-enhancement/Sliders degrade UX (so do this instead)https://adamsilver.io/blog/sliders-degrade-ux-so-do-this-instead/Adding Search to an Eleventy Site Without Client-side JavaScripthttps://www.philiprenich.com/blog/adding-search-to-an-eleventy-site-without-client-side-javascript/Progressively Enhanced HTML Accordionhttps://adrianroselli.com/2023/08/progressively-enhanced-html-accordion.htmlSome little ways I’m using CSS :has() in the real worldhttps://piccalil.li/blog/some-little-ways-im-using-css-has-in-the-real-world/How layout position impacts three big web performance levershttps://performance.shopify.com/blogs/blog/how-layout-position-impacts-three-big-web-performance-leversSharing links via RSS, sharing links via APIshttps://coryd.dev/posts/2024/sharing-links-via-rss-sharing-links-via-apis/Using an Eleventy event to optimize component JavaScripthttps://coryd.dev/posts/2024/using-an-eleventy-event-to-optimize-component-javascript/Don’t use paracetamol to fix bad UXhttps://adamsilver.io/blog/dont-use-paracetamol-to-fix-bad-ux/CSS Button Styles You Might Not Knowhttps://dbushell.com/2024/03/10/css-button-styles-you-might-not-know/Following Linkshttps://blog.jim-nielsen.com/2024/following-links/Own Your Web – Issue 11: Welcome to the IndieWebhttps://buttondown.email/ownyourweb/archive/issue-11/Leaving Netlifyhttps://minutestomidnight.co.uk/blog/leaving-netlify/Surfacing most used tags in Eleventyhttps://coryd.dev/posts/2024/surfacing-most-used-tags-in-eleventy/11ty Linkrollshttps://another.rodeo/linkroll/Fetching Package Dependents from GitHubhttps://rknight.me/blog/fetching-package-dependents-from-github/You don't have to be a “content creator” to have a website.https://ohhelloana.blog/just-get-a-website/You Want border-color: transparent, Not border: nonehttps://frontendmasters.com/blog/you-want-border-color-transparent-not-border-none/How I Eleventyhttps://declanbyrd.co.uk/journal/2024/how-i-eleventy/The 'IndieWeb' feels like coming homehttps://daught.me/blog/2024/indie-web/Welcome to the IndieWebhttps://matthiasott.com/notes/welcome-to-the-indiewebWe Need to Talk About Your Eleventy Post Dateshttps://rknight.me/blog/eleventy-post-dates/Lightweight search in Eleventyhttps://coryd.dev/posts/2024/lightweight-search-in-eleventy/Time to Ditch Analytics? Tracking Scripts and Web Sustainabilityhttps://css-irl.info/time-to-ditch-analytics/When to Nest CSShttps://cloudfour.com/thinks/when-to-nest-css/Better type layouts with CSShttps://gomakethings.com/better-type-layouts-with-css/Readable code tips: Introductionhttps://rosswintle.uk/2024/03/readable-code-tips-intro/The IndieWeb is the new and the old webhttps://www.alexhyett.com/newsletter/the-indie-web-is-the-new-and-the-old-web/Own Your Web – Issue 12: Finding Your Rhythmhttps://buttondown.email/ownyourweb/archive/issue-12/Subgrid is herehttps://css-irl.info/subgrid-is-here/CSS color-scheme-dependent colors with light-dark()https://web.dev/articles/light-darkUsing Gitea/Github actions for triggering Echohttps://lewisdale.dev/post/using-gitea-github-actions-for-triggering-echo/The Discovery Phase in UX Projectshttps://www.nngroup.com/articles/discovery-phase/Building Dynamic Progress Bars using only CSShttps://www.amitmerchant.com/dynamic-progress-bars-using-css/How would you build a complex app with vanilla tech?https://gomakethings.com/how-would-you-build-a-complex-app-with-vanilla-tech/disabled vs aria-disabled on form elementshttps://www.stefanjudis.com/notes/disabled-vs-aria-disabled-on-form-elements/Using Eleventy to Gobble Up Everything I Do Onlinehttps://rknight.me/blog/using-eleventy-to-gobble-up-everything-i-do-online/Best practices for writing CSS and JavaScript with a teamhttps://gomakethings.com/best-practices-for-writing-css-and-javascript-with-a-team/Front-end development’s identity crisishttps://ellyloel.com/blog/front-end-development-s-identity-crisis/Have we forgotten how to build ethical things for the web?https://www.nicchan.me/blog/have-we-forgotten-how-to-build-ethical-things-for-the-web/CSS variableshttps://gomakethings.com/css-variables/5 Things Designers Need to Know for a Smooth Handoffhttps://www.figma.com/blog/5-things-designers-need-to-know-for-a-smooth-handoff/An advanced way to use CSS variableshttps://gomakethings.com/an-advanced-way-to-use-css-variables/Embeds and Quotations in Writinghttps://blog.jim-nielsen.com/2023/embeds-and-quotations/Your Cache Headers Could Probably be More Aggressivehttps://macarthur.me/posts/more-aggressive-cache-headers/My wander pagehttps://jamesg.blog/2024/04/08/wander/Web dev craftsmanshiphttps://gomakethings.com/web-dev-craftsmanship/Git Freshhttps://tylersticka.com/journal/git-fresh/Figma prototypes vs HTML prototypeshttps://adamsilver.io/blog/figma-prototypes-vs-html-prototypes/Enhancing pagination with a page selectorhttps://coryd.dev/posts/2024/enhancing-pagination-with-a-page-selector/The joy of incremental website improvementshttps://jamesg.blog/2024/03/04/incremental-website-improvements-joy/Blockin’ botshttps://ethanmarcotte.com/wrote/blockin-bots/Own Your Web – Issue 13: Nowhttps://buttondown.email/ownyourweb/archive/issue-13/Faster Connectivity !== Faster Websiteshttps://blog.jim-nielsen.com/2024/faster-bandwidth-and-websites/How to display language-specific quotes in CSShttps://www.stefanjudis.com/today-i-learned/how-to-use-language-dependent-quotes-in-css/A Cheatsheet for User Interview and Follow Ups Questionshttps://stephaniewalter.design/blog/a-cheatsheet-for-user-interview-and-follow-ups-questions/Index images, videos and news with specialized sitemapshttps://www.stefanjudis.com/today-i-learned/image-video-news-sitemaps/Blogging Anonymouslyhttps://flamedfury.com/posts/blogging-anonymously/link-peek Web Componenthttps://darn.es/link-peek-web-component/Re-creating the ‘His Dark Materials’ Logo in CSShttps://css-irl.info/recreating-the-his-dark-materials-logo-in-css/Will Web Components replace React and Vue?https://gomakethings.com/will-web-components-replace-react-and-vue/Adding options to your Web Componenthttps://gomakethings.com/adding-options-to-your-web-component/Your first Web Componenthttps://gomakethings.com/your-first-web-component/Eleventy Nested Paginationhttps://www.codeflood.net/blog/2024/04/17/11ty-nested-pagination/Deploying An 11ty Project To Shared Hostinghttps://flamedfury.com/posts/deploying-an-11ty-project-to-shared-hosting/Progressively enhancing a Web Componenthttps://gomakethings.com/progressively-enhancing-a-web-component/JSON RSS feed I quickly created a JSON feed for this websitehttps://minutestomidnight.co.uk/blog/json-rss-feed/Don’t use the maxlength attribute to stop users from exceeding the limithttps://adamsilver.io/blog/dont-use-the-maxlength-attribute-to-stop-users-from-exceeding-the-limit/The different ways to instantiate a Web Componenthttps://gomakethings.com/the-different-ways-to-instantiate-a-web-component/My approach to HTML web componentshttps://adactio.com/journal/21078Web Component lifecycle methodshttps://gomakethings.com/the-web-component-lifecycle-methods/What are you interested in?https://chrisburnell.com/note/slash-interests/A quick light-dark() experimenthttps://daverupert.com/2024/05/light-dark-experiment/Securing client-side JavaScripthttps://adactio.com/journal/21104User Interviews 101https://www.nngroup.com/articles/user-interviews/Building a Localised Site with 11ty, Sanity & Netlifyhttps://www.ryangittings.co.uk/blog/jamstack-localisation-11ty-netlify-sanity/How to get different Web Components to talk to each other (part 2)https://gomakethings.com/how-to-get-different-web-components-to-talk-to-each-other-part-2/How to get different Web Components to talk to each other (part 1)https://gomakethings.com/how-to-get-different-web-components-to-talk-to-each-other-part-1/A Brief Note on Highlighted Texthttps://adrianroselli.com/2024/05/a-brief-note-on-highlighted-text.htmlThe /interests Directoryhttps://chrisburnell.com/note/interests-directory/Why use Web Components over traditional DOM manipulation?https://gomakethings.com/why-use-web-components-over-traditional-dom-manipulation/Interests: A New Sitelethttps://rknight.me/blog/interests-a-new-sitelet/View transitions and stacking contexthttps://www.nicchan.me/blog/view-transitions-and-stacking-context/Target=_blank implies rel=noopenerhttps://www.stefanjudis.com/today-i-learned/target-blank-implies-rel-noopener/How to listen to multiple events in a Web Component with the handleEvent() methodhttps://gomakethings.com/how-to-listen-to-multiple-events-in-a-web-component-with-the-handleevent-method/RSS is Good, Isn’t It?!https://css-irl.info/rss-is-good-isnt-it/Some of my Eleventy Filtershttps://chrisburnell.com/article/some-eleventy-filters/Web Security Basics: XSShttps://www.matuzo.at/blog/2022/web-security-basics-xssBuried Bookwormhttps://chrisburnell.com/note/buried-bookworm/Futuristic Progressive Enhancementhttps://blog.jim-nielsen.com/2024/futuristic-progressive-enhanement/CSS is fun againhttps://pdx.su/blog/2023-10-25-css-is-fun-again/Design interviewshttps://robinrendle.com/notes/design-interviews/Slash Pageshttps://rknight.me/blog/slash-pages/Upgraded to Eleventy v3https://ttntm.me/blog/upgraded-to-eleventy-v3/But what about the shadow DOM?https://gomakethings.com/but-what-about-the-shadow-dom/Thinking Big and Smallhttps://blog.jim-nielsen.com/2024/thinking-big-and-small/Dynamic Content Includeshttps://chrisburnell.com/article/dynamic-content-includes/More Indieweb Automationhttps://minutestomidnight.co.uk/blog/more-indieweb-automation/A Multiplicity of Writinghttps://shellsharks.com/multiplicity-of-writingRe: Blocking Botshttps://minutestomidnight.co.uk/blog/re-blocking-bots/Misconceptions about CSS Specificityhttps://www.bram.us/2024/05/05/misconceptions-about-css-specificity/The key to side project successhttps://samdking.co.uk/blog/mvp/Progressively Enhanced Popover Toggletipshttps://css-irl.info/progressively-enhanced-popover-toggletips/The prefers-reduced-transparency media featurehttps://www.matuzo.at/blog/2023/100daysof-day103The New CSS Math: rem() and mod()https://danielcwilson.com/posts/mathematicss-rem-mod/Old Dogs, new CSS Trickshttps://mxb.dev/blog/old-dogs-new-css-tricks/The different ways to build a resilient website or web apphttps://gomakethings.com/the-different-ways-to-build-a-resilient-website-or-web-app/Your site or app should work as much as possible without JavaScripthttps://gomakethings.com/your-site-or-app-should-work-as-much-as-possible-without-javascript/Layout Updatehttps://chrisburnell.com/note/layout-update-may-2024/External links and target="_blank"https://ttntm.me/blog/external-links-and-target-blank/A simpler way to build dynamic user interactionshttps://gomakethings.com/a-simpler-way-to-build-dynamic-user-interactions/Updating to Eleventy v3https://mxb.dev/blog/eleventy-v3-update/Exit Animationshttps://chriscoyier.net/2023/10/30/exit-animations/“Just” One Linehttps://blog.jim-nielsen.com/2024/just-one-line/Why You Should Use px Units for margin, padding, & Other Spacing Techniqueshttps://ashleemboyer.com//blog/why-you-should-use-px-units-for-margin-padding-and-other-spacing-techniquesAnimation With Registered Custom Propertieshttps://www.matuzo.at/blog/2023/100daysof-day104The challenge with Netlify, Vercel, Cloudflare, and so onhttps://gomakethings.com/the-challenge-with-netlify-vercel-cloudflare-and-so-on/Modular CSS and different ways to structure your stylesheetshttps://gomakethings.com/modular-css-and-different-ways-to-structure-your-stylesheets/Managing My Motivation, as a Solo Devhttps://mbuffett.com/posts/maintaining-motivation/Maybe Don’t Name That Landmarkttps://adrianroselli.com/2024/06/maybe-dont-name-that-landmark.htmlBasic, beautiful, and buildlesshttps://www.baldurbjarnason.com/2024/basic-beautiful-buildless/Compounding complexity in modern web developmenthttps://gomakethings.com/compounding-complexity-in-modern-web-development/Quick Trick: Using border-image to Apply and Overlay Gradienthttps://frontendmasters.com/blog/quick-trick-using-border-image-to-apply-and-overlay-gradient/Consent, LLM scrapers, and poisoning the wellhttps://ericwbailey.website/published/consent-llm-scrapers-and-poisoning-the-well/No No-JavaScripthttps://dbushell.com/2024/06/22/no-no-javascript/Every website and web app should have a service workerhttps://gomakethings.com/every-website-and-web-app-should-have-a-service-worker/Feature detect CSS @property supporthttps://www.bram.us/2024/07/03/feature-detect-css-property-support/Google Spamhttps://dbushell.com/2024/07/03/google-spam/Highlighting Blogging on Mastodonhttps://matthiasott.com/notes/highlighting-blogging-on-mastodon/Vivaldi is quite goodhttps://gomakethings.com/vivaldi-is-quite-good/Surprising Facts About New CSS Selectorshttps://cloudfour.com/thinks/surprising-facts-about-new-css-selectors/OKLCH for better color in the browserhttps://www.learnwithjason.dev/blog/oklch-better-color-css-browser/Poisoning the AI wellhttps://gomakethings.com/poisoning-the-ai-well/Is AI part and parcel of web dev?https://remysharp.com/2024/07/12/is-ai-part-and-parcel-of-web-devFeature detect CSS @starting-style supporthttps://www.bram.us/2024/07/11/feature-detect-css-starting-style-support/No JavaScript, No Problemhttps://gomakethings.com/no-javascript-no-problem/HTML & CSS for a One-Time Password Inputhttps://chriscoyier.net/2023/12/04/html-css-for-a-one-time-password-input/Helping to get quality code into production as an interaction designerhttps://www.benjystanton.co.uk/blog/helping-to-get-quality-code-into-production-as-an-interaction-designer/You probably dont need HTML importshttps://gomakethings.com/you-probably-dont-need-html-imports/Forms without an accessible name are not exposed as ARIA landmarkshttps://www.stefanjudis.com/today-i-learned/forms-require-an-accessible-name/The many ways to hide things in the DOMhttps://gomakethings.com/the-many-ways-to-hide-things-in-the-dom/Building a Custom Filter for Eleventy Collectionshttps://ttntm.me/blog/building-a-custom-filter-for-eleventy-collections/Be Careful Using ‘Grid’https://adrianroselli.com/2024/07/be-careful-using-grid.htmlCommunication Practices for Increasing UX Maturityhttps://www.nngroup.com/articles/communication-practices/Quick Tip: How to Animate Text Gradients and Patterns in CSShttps://www.sitepoint.com/css-animate-text-gradients-patterns/Web content, the social contract and copyrightshttps://www.stefanjudis.com/blog/web-content-and-copyrights/Three modern CSS properties your website must havehttps://bejamas.io/hub/guides/modern-css-properties-your-website-must-have5 CSS snippets every front-end developer should know in 2024https://web.dev/articles/5-css-snippets-every-front-end-developer-should-know-in-2024A modern CMShttps://gomakethings.com/a-modern-cms/The other shoe dropping on 'AI' and office workhttps://www.baldurbjarnason.com/2024/the-other-ai-shoe-dropping/Using Figma variables for breakpointshttps://uxdesign.cc/using-figma-variables-for-breakpoints-eff321435306Rebuilding The Webhttps://flamedfury.com/posts/rebuilding-the-web/Losing is part of being a designerhttps://adamsilver.io/blog/losing-is-part-of-being-a-designer/Instabilityhttps://robinrendle.com/notes/instability/Why you need a killer web design proposal and how to write onehttps://stuffandnonsense.co.uk/blog/why-you-need-a-killer-web-design-proposal-and-how-to-write-oneDisplays May Be Ultra-Wide, But That Doesn't Mean Your Web Page Should Behttps://martech.zone/optimal-web-page-width/Offloading JavaScript With Custom Propertieshttps://heydonworks.com/article/offloading-javascript-with-custom-properties/Cascade Layers are uselesshttps://www.matuzo.at/blog/2023/cascade-layers-are-uselessOwn Your Web – Issue 15: Home Sweet Homehttps://buttondown.email/ownyourweb/archive/issue-15/Just Build Websiteshttps://blog.jim-nielsen.com/2024/just-build-websites/Vanilla CSS and efficiencies over Sasshttps://gomakethings.com/vanilla-css-and-efficiencies-over-sass/Bye bye build stepshttps://gomakethings.com/bye-bye-build-steps/Design Patterns that Encourage Junk Datahttps://css-irl.info/design-patterns-that-encourage-junk-data/Highlight Text When a User Scrolls Down to That Piece of Texthttps://frontendmasters.com/blog/highlight-text-when-a-user-scrolls-down-to-that-piece-of-text/Struggle and processhttps://robinrendle.com/notes/struggle-and-process/Flat files and data portabilityhttps://gomakethings.com/flat-files-and-data-portability/A feed for everything and everything in a feedhttps://coryd.dev/posts/2024/a-feed-for-everything-and-everything-in-a-feed/How to detect when attributes change on a Web Componenthttps://gomakethings.com/how-to-detect-when-attributes-change-on-a-web-component/The area elementhttps://heydonworks.com/article/the-area-element/My Failed Personal Site Redesignhttps://blog.jim-nielsen.com/2024/my-failed-peronsal-site-redesign/font-size Limbohttps://sebastianlaube.de/en/blog/font-size-limboHow to avoid optional form fields with a conditional revealhttps://adamsilver.io/blog/how-to-avoid-optional-form-fields-with-a-conditional-reveal/Things to Do Before Asking “Is This Accessible?”https://adrianroselli.com/2024/08/things-to-do-before-asking-is-this-accessible.htmlWhat about searching flat files?https://gomakethings.com/what-about-searching-flat-files/80 / 20 accessibilityhttps://marcus.io/blog/80-20-accessibility10 Figma Keyboard Shortcuts: A Cheat Sheet for UX Designershttps://designlab.com/blog/10-figma-keyboard-shortcuts-a-cheat-sheet-for-ux-designersheading-anchors Web Componenthttps://darn.es/heading-anchors-web-component/Blog Posts vs. Social Postshttps://blog.jim-nielsen.com/2024/blog-vs-social-posts/New Workflow for Publishing Notes: Content in Dropbox, Code in GitHubhttps://blog.jim-nielsen.com/2024/notes-site-via-content-in-dropbox/The aside elementhttps://heydonworks.com/article/the-aside-element/Paragraphshttps://www.scottohara.me/blog/2024/08/29/paragraphs.htmlGardening and codehttps://gomakethings.com/gardening-and-code/The secret inside One Million Checkboxeshttp://eieio.games/essays/the-secret-in-one-million-checkboxes/Dynamic Importing with Eleventyhttps://www.trovster.com/blog/2024/08/dynamic-importing-with-eleventyOrganising Eleventy Filters, Shortcodes and more…https://www.trovster.com/blog/2024/08/organising-eleventy-filters-shortcodes-and-moreHourly Billing Is Stopping Your Growthhttps://www.kyleprinsloo.com/articles/stop-billing-hourlyDifferent ways to use “--patch” in Githttps://tekin.co.uk/2024/08/the-many-uses-for-git-patchSanding UIhttps://blog.jim-nielsen.com/2024/sanding-ui/Popover API is Herehttps://frontendmasters.com/blog/popover-api-is-here/Personal Websites Are As Vulnerable As Ushttps://blog.jim-nielsen.com/2024/personal-website-vulnerability/Basic accessibility mistakes I often see in auditshttps://gomakethings.com/basic-accessibility-mistakes-i-often-see-in-audits/Good formshttps://daverupert.com/2024/09/good-forms/Auto Layout in Figma: to use or not to use?https://rafaltomal.ck.page/posts/auto-layout-in-figma-to-use-or-not-to-useRemoving link underline styles between icons and texthttps://chriskirknielsen.com/blog/remove-link-underline-styling-between-icon-and-text/Animating height with only CSShttps://gomakethings.com/animating-height-with-only-css/The role of Web Components in your site or apphttps://gomakethings.com/the-role-of-web-components-in-your-site-or-app/Should form labels be wrapped or separate?https://www.tpgi.com/should-form-labels-be-wrapped-or-separate/Putting the “Person” in “Personal Website”https://blog.jim-nielsen.com/2024/person-in-personal-website/Going beyond pixels and (r)ems in CSShttps://techhub.iodigital.com/articles/going-beyond-pixels-and-rems-in-css/relative-length-units-based-on-fontA 4-step framework for crafting meaningful designshttps://uxdesign.cc/a-4-step-framework-for-crafting-meaningful-designs-ea9fca9b39b8As little code as possiblehttps://gomakethings.com/as-little-code-as-possible/Top 10 Graphic Design Trends For 2024https://graphicmama.com/blog/graphic-design-trends-2024/What Else Can We Do With Design Tokens?https://alwaystwisted.com/articles/what-else-can-we-do-with-design-tokens.htmlGetting Started With Style Dictionaryhttps://alwaystwisted.com/articles/a-design-tokens-workflow-part-1.htmlWeb Components and FOUChttps://gomakethings.com/web-components-and-fouc/Outputting to Different Formats with Style Dictionaryhttps://alwaystwisted.com/articles/a-design-tokens-workflow-part-2.htmlDoing what’s required: Indicating mandatory fields in an accessible wayhttps://www.tpgi.com/doing-whats-required-indicating-mandatory-fields-in-an-accessible-way/A CSS project boilerplatehttps://piccalil.li/blog/a-css-project-boilerplate/View transitions: Handling aspect ratio changeshttps://jakearchibald.com/2024/view-transitions-handling-aspect-ratio-changes/How SVG Line Animation Workshttps://css-tricks.com/svg-line-animation-works/Playing with Infinity in CSS https://codersblock.com/blog/playing-with-infinity-in-css/Syndicating to Blueskyhttps://adactio.com/journal/21570Eleventy Transform speeds local development...a lot!https://www.bobmonsour.com/posts/fast-as-hell/Asking the right questions to frame the problemhttps://benholliday.com/2015/07/28/frame-the-problem/Never half-ass two thingshttps://www.benjystanton.co.uk/blog/never-half-ass-two-things/How to Conduct a Design Audit in 2023: A Beginner’s Guidehttps://designlab.com/blog/how-to-conduct-a-design-auditHow to usability test your product (if you want bad UX)https://adamsilver.io/blog/how-to-usability-test-your-product-if-you-want-bad-ux/Using the ':not()' pseudo-class to remove styles from ':last-child'https://blog.stephaniestimac.com/posts/2024/12/not-pseudo-class/Using the Popover API for HTML Tooltips Can it be done?https://frontendmasters.com/blog/using-the-popover-api-for-html-tooltips/Royal Mail? More like Royal FAILhttps://adamsilver.io/blog/royal-mail-more-like-royal-fail/Turn off AI features by default (to reduce their climate impact)https://hidde.blog/please-make-ai-opt-in/Cool People Link to Text Fragmentshttps://dbushell.com/2024/12/05/url-fragment-text-directives/bluesky-replies Web Componenthttps://darn.es/bluesky-replies-web-component/A Design Tokens Workflow (part 4) - Converting Tokens with Style Dictionaryhttps://alwaystwisted.com/articles/a-design-tokens-workflow-part-4.htmlA Design Tokens Workflow (part 3) - Beyond JSON: Exploring File Formats for Design Tokenshttps://alwaystwisted.com/articles/a-design-tokens-workflow-part-3.htmlDon’t Use aria-label on Static Text Elementshttps://benmyers.dev/blog/dont-use-aria-label-on-static-text-elements/Every token is a featurehttps://daverupert.com/2024/12/every-token-is-a-feature/Responsive design is dead. Long live fluid design!https://medium.com/design-bootcamp/responsive-design-is-dead-long-live-fluid-design-5c1609a8bf33Slash Pages?https://chriscoyier.net/2025/01/04/slash-pages/Default Apps 2024https://www.stefanjudis.com/blog/default-apps-2024/Custom attributes in Web Componentshttps://gomakethings.com/custom-attributes-in-web-components/A quick and easy guide to Markdownhttps://piccalil.li/blog/a-quick-and-easy-guide-to-markdown/More ways to instantiate Web Componentshttps://gomakethings.com/more-ways-to-instantiate-web-components/Anchor Positioning and the Popover API for a JS-Free Site Menuhttps://css-irl.info/anchor-positioning-and-the-popover-api/Five Basic Things About JavaScript That Will Help Non JavaScript-Focused Web Designershttps://frontendmasters.com/blog/5-things-designers-can-do-with-javascript/The wrong way to do Web Componentshttps://gomakethings.com/the-wrong-way-to-do-web-components/Gotchas in Naming CSS View Transitionshttps://blog.jim-nielsen.com/2025/view-transition-name-gotchas/Best Practices for Optimizing Imageshttps://www.speedcurve.com/blog/best-practices-for-optimizing-imagesUsing an 11ty Shortcode to craft a custom CSS pipelinehttps://nooshu.com/blog/2025/01/12/using-an-11ty-shortcode-to-craft-a-custom-css-pipeline/CSS light-dark()https://12daysofweb.dev/2024/css-light-dark/Don’t Wrap Figure in a Linkhttps://adrianroselli.com/2025/01/dont-wrap-figure-in-a-link.htmlAdding a Copy Button to Code Blockshttps://ttntm.me/blog/adding-a-copy-button-to-code-blocks/Securing Buy-In for Your Design System: A Lifecycle Approachhttps://www.supernova.io/blog/securing-buy-in-for-your-design-system-a-lifecycle-approachEvery dependency is a potential vulnerability https://gomakethings.com/every-dependency-is-a-potential-vulnerability/The Times You Need A Custom @property Instead Of A CSS Variablehttps://www.smashingmagazine.com/2024/05/times-need-custom-property-instead-css-variable/Filtershttps://adactio.com/journal/21241Cool URIs Don’t Change — But Humans Dohttps://blog.jim-nielsen.com/2024/cool-uris-and-humans/Investigating INP issueshttps://www.stefanjudis.com/blog/investigating-inp-issues/Decline of web craftsmanshiphttps://www.dan-davies.co.uk/decline-of-web-craftsmanshipNot so short note on aria-label usagehttps://html5accessibility.com/stuff/2024/05/22/not-so-short-note-on-aria-label-usage-big-table-edition/Accessibility in Design Systems: A Comprehensive Approach Through Documentation and Assetshttps://www.supernova.io/blog/accessibility-in-design-systems-a-comprehensive-approach-through-documentation-and-assets“Dots” Custom Element (aka Web Component)https://dbushell.com/2024/06/12/docs-custom-element-web-component/Opinions for Writing Good CSShttps://andrewwalpole.com/blog/opinions-for-writing-good-css/Why toggle switches suck (and what to do instead)https://adamsilver.io/blog/why-toggle-switches-suck-and-what-to-do-instead/Organising NPM Build Scriptshttps://www.trovster.com/blog/2024/06/organising-npm-build-scriptsWhy are my live regions not working?https://tetralogical.com/blog/2024/05/01/why-are-my-live-regions-not-working/Simple, fast build tooling with live reload for a non-framework websitehttps://www.alistairshepherd.uk/writing/simple-build-tooling/The anchor elementhttps://heydonworks.com/article/the-anchor-element/Proxying an Image CDN with Cloudflare workershttps://www.alistairshepherd.uk/writing/cloudflare-worker-image-proxy/Anchor Links and How to Make Them Awesomehttps://codersblock.com/blog/anchor-links-and-how-to-make-them-awesome/Manual ’till it hurtshttps://adactio.com/journal/21397Relative Color Syntax — Basic Use Casehttps://frontendmasters.com/blog/relative-color-syntax-basic-use-cases/The article elementhttps://heydonworks.com/article/the-article-element/Iterative Building and Decision Makinghttps://blog.jim-nielsen.com/2024/iterative-building-and-decision-making/How to add links with a keyboard shortcut in Sublime Texthttps://gomakethings.com/how-to-add-links-with-a-keyboard-shortcut-in-sublime-text/Fine-tuning Text Inputshttps://garrettdimon.com/journal/posts/fine-tuning-text-inputsDouble-Pagination in Eleventyhttps://chriskirknielsen.com/blog/double-pagination-in-eleventy/How to redesign a website: step by step guidehttps://www.justinmind.com/web-design/website-redesignCustomising checkbox question pages with the GOV.UK Prototype Kit and Nunjuckshttps://www.benjystanton.co.uk/blog/customising-checkbox-question-pages-with-the-gov.uk-prototype-kit-and-nunjucks/User journey mapping: guide with tools and exampleshttps://www.justinmind.com/ux-design/user-journey-mapPrompting the Wrong Questionhttps://blog.jim-nielsen.com/2024/prompting-the-wrong-question/Processes and rules make code review less intimidatinghttps://www.stefanjudis.com/blog/processes-and-rules-make-code-review-less-intimidating/Creating Design System-Friendly Snowflakes with Utility Classeshttps://alwaystwisted.com/articles/creating-design-system-friendly-snowflakes-with-utility-classes.htmlStyling web componentshttps://gomakethings.com/styling-web-components/CSS logical propertieshttps://gomakethings.com/css-logical-properties/Modern layouts with CSShttps://gomakethings.com/modern-layouts-with-css/::pseudo-elements?https://dbushell.com/2025/05/23/pseudo-elements/The problem with good designhttps://adamsilver.io/blog/the-problem-with-good-design/More myself onlinehttps://gomakethings.com/more-myself-online/How to write error messages that actually help users rather than frustrate themhttps://piccalil.li/blog/how-to-write-error-messages-that-actually-help-users-rather-than-frustrate-them/Naming conventions for CSS classeshttps://gomakethings.com/naming-conventions-for-css-classes/My Figma design systemhttps://www.adhamdannaway.com/portfolio/figma-design-systemLimitation Breeds Creativity: A Study in Composition with Custom Propertieshttps://css-irl.info/limitation-breeds-creativity/Worrying about the future of interaction designhttps://www.benjystanton.co.uk/blog/worrying-about-the-future-of-interaction-design/:nth-next-sibling? No need.https://chriskirknielsen.com/blog/nth-next-sibling-no-need/The order of accessible name computation stepshttps://www.stefanjudis.com/today-i-learned/the-order-of-accessible-name-computation-steps/Optimize for optionality and build towards checkpointshttps://sebastiandedeyne.com/optimize-for-optionality-and-build-towards-checkpointsThe world we're designinghttps://gomakethings.com/the-world-were-designing/Building Search Index with Eleventyhttps://arielsalminen.com/2025/building-search-index-with-eleventy/Modular CSS ReduxSVG Optimization and Accessibility Basicshttps://dbushell.com/2025/06/25/svg-optimization-and-accessibility-basics/Easy dark mode for your website or web apphttps://gomakethings.com/easy-dark-mode-for-your-website-or-web-app/My favourite 3 lines of CSShttps://piccalil.li/blog/my-favourite-3-lines-of-css/Controlling spacing in modern CSS layoutshttps://gomakethings.com/controlling-spacing-in-modern-css-layouts/Croissant! Building a No-Framework Web Apphttps://dbushell.com/2025/07/11/croissant-no-framework-web-app/A revisit of the Every Layout sidebar with :has() and selector performancehttps://piccalil.li/blog/a-revisit-of-the-every-layout-sidebar-with-has-and-selector-performance/Stop animating everything!https://gomakethings.com/stop-animating-everything/Getting the index in a for...of loophttps://gomakethings.com/getting-the-index-in-a-for...of-loop/Why I’m Writing Pure HTML & CSS in 2025https://joeldare.com/why-im-writing-pure-html-and-css-in-2025We migrated our site to Eleventy and increased performance by 24%https://etch.co/blog/we-migrated-our-site-to-eleventy-and-increased-performance-by-24-percentBuilding my new website: A modern approach to font fallbacks with font property adjustments - Nic Chanhttps://www.nicchan.me/blog/building-my-new-website-part-6-font-fallbacks/Why GOV.UK's Exit this Page component doesn't use the Escape keyhttps://beeps.website/blog/2024-10-09-why-govuk-exit-this-page-doesnt-use-escape/Prototyping Magic Tricks and Softwarehttps://blog.jim-nielsen.com/2024/prototyping-magic-and-software/The blockquote elementhttps://heydonworks.com/article/the-blockquote-element/7 Simple Button Design Tips That Make a Big Impacthttps://medium.com/design-bootcamp/7-simple-button-design-tips-that-make-a-big-impact-3cefcdc2d9a2Your CSS reset should be layeredhttps://www.mayank.co/blog/css-reset-layer/The <details> and <summary> elements are getting an upgrade - Stephanie Stimac's Bloghttps://blog.stephaniestimac.com/posts/2024/10/html-details-and-summary-update/What’s the deal with WebKit Font Smoothing?https://dbushell.com/2024/11/05/webkit-font-smoothing/Styling the Shadow DOM with Web Componentshttps://gomakethings.com/styling-the-shadow-dom-with-web-components/Styling Web Component shadow DOM elements with inline styleshttps://gomakethings.com/styling-web-component-shadow-dom-elements-with-inline-styles/Style your underlineshttps://adactio.com/journal/22084How I set up a fake web design company to test an ideahttps://stuffandnonsense.co.uk/blog/how-i-set-up-a-fake-web-design-company-to-test-an-ideaUnderlines and line heighthttps://adactio.com/journal/22085Balancing Text In CSShttps://ishadeed.com/article/balancing-text-css/Semantic classes > BEMhttps://gomakethings.com/semantic-classes-bem/What the Internet Was Like in 1999https://cybercultural.com/p/internet-1999/Conditional favicon in Eleventy using passthrough copy | chriskirknielsenhttps://chriskirknielsen.com/blog/conditional-favicon-with-eleventy-passthrough-copy/Just use HTMLhttps://gomakethings.com/just-use-html/“Your” vs “My” in user interfaceshttps://adamsilver.io/blog/your-vs-my-in-user-interfaces/A tiny bit-o-CSS for Stable Scrollbar Gutters—zachleat.comhttps://www.zachleat.com/web/stable-scrollbar-gutters/Prevent scrollbar jumphttps://gomakethings.com/prevent-scrollbar-jump/DIY Netlifyhttps://gomakethings.com/diy-netlify/Let’s see Paul Allen’s CSS Resethttps://dbushell.com/2025/09/12/css-reset/My plugin for Markdown-It: CodeWrap | chriskirknielsenhttps://chriskirknielsen.com/blog/markdown-it-codewrap/What are OKLCH colors?https://jakub.kr/components/oklch-colors?utm_campaign=Issue-621&utm_medium=RSS&utm_source=CSS-WeeklyUX Design Patterns - A Step-By-Step Guide - Digital Presenthttps://digitalpresent.io/ux-design-patterns/Basic keyboard shortcut support for focused linkshttps://ericwbailey.website/published/basic-keyboard-shortcut-support-for-focused-links/Going Buildlesshttps://mxb.dev/blog/buildless/Creating reusable codehttps://gomakethings.com/creating-reusable-code/Just use a buttonhttps://gomakethings.com/just-use-a-button/Don’t be afraid of a long list of radio buttons (and why I broke this UX law)https://adamsilver.io/blog/dont-be-afraid-of-a-long-list-of-radio-buttons/Styling External Links Using :has and an Attribute Selectorhttps://tylergaw.com/blog/has-attribute-external-links/Review your own git pull requestshttps://gomakethings.com/review-your-own-git-pull-requests/Revisiting Image Maps | CSS-Trickshttps://css-tricks.com/revisiting-image-maps/Easier layout with margin-trimhttps://webkit.org/blog/16854/margin-trim/The split layout with modern CSShttps://gomakethings.com/the-split-layout-with-modern-css/Blocking entire countries because of scrapers • Cory Dransfeldthttps://www.coryd.dev/posts/2026/blocking-entire-countries-because-of-scrapersThe Browser’s Little White Lieshttps://blog.jim-nielsen.com/2026/browsers-white-lies/4 common layouts made easy with modern CSShttps://gomakethings.com/4-common-layouts-made-easy-with-modern-css/Getting Creative With HTML Dialog | CSS-Trickshttps://css-tricks.com/getting-creative-with-html-dialog/Minification doesnt matter muchhttps://gomakethings.com/minification-doesnt-matter-much/Better max-width queries | Trys Mudfordhttps://www.trysmudford.com/blog/max-width-queries/Inverse text-sizing based on text-length with attr()https://daverupert.com/2025/06/fittext-too-attr-boogaloo/Owning your data • Cory Dransfeldthttps://www.coryd.dev/posts/2026/owning-your-dataAn aspect ratio CSS utility classhttps://gomakethings.com/an-aspect-ratio-css-utility-class/The :has() CSS pseudo-classhttps://gomakethings.com/the-has-css-pseudo-class/My favorite way to write code in 2026 (on becoming a TDD addict)https://gomakethings.com/my-favorite-way-to-write-code-in-2026-on-becoming-a-tdd-addict/Eleventy: How to Work Around the “git Last Modified” Performance Bottleneck · Jens Oliver Meierthttps://meiert.com/blog/eleventy-git-last-modified/Why frontends fail when you approach them like a backend / Marijke Luttekeshttps://marijkeluttekes.dev/blog/articles/2026/03/16/why-frontends-fail-when-you-approach-them-like-a-backend/Automatically wrapping CSS Gridhttps://gomakethings.com/automatically-wrapping-css-grid/A Few Things About the Anchor Element’s href You Might Not Have Knownhttps://blog.jim-nielsen.com/2025/href-value-possibilities/Simple website analytics with Goatcounter - Alistair Shepherdhttps://www.alistairshepherd.uk/writing/simple-website-analytics-with-goatcounter/Designers, your excuse is gone. Stunning, animated and accessible. Yes, you can!https://annebovelett.eu/designers-your-excuse-is-gone-stunning-animated-and-accessible-yes-you-can/The case for “old school” CSShttps://chenhuijing.com/blog/the-case-for-old-school-css/Design Systems and Legoshttps://gomakethings.com/design-systems-and-legos/A better non-modal dialog with the Popover APIhttps://fullystacked.net/a-better-dialog/box-shadow is no alternative to outline - Manuel Matuzovichttps://matuzo.at/blog/2026/box-shadow-no-alternative-to-outline?fresh=1There’s no need to include ‘navigation’ in your navigation labelshttps://www.tempertemper.net/blog/theres-no-need-to-include-navigation-in-your-navigation-labelsimage-set() CSS function - CSS | MDNhttps://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/image/image-setfield-sizing isn't only about growing textareashttps://www.stefanjudis.com/today-i-learned/field-sizing-is-about-more-than-textareas/Skip links: what, why, and howhttps://www.tempertemper.net/blog/skip-links-what-why-and-howNHS Goes To War Against Open Sourcehttps://shkspr.mobi/blog/2026/05/nhs-goes-to-war-against-open-source/Is form design easy?https://adamsilver.io/blog/is-form-design-easy/How to apply a global Git commit templatehttps://www.stefanjudis.com/today-i-learned/global-git-commit-templates/The cluster layout with modern CSShttps://gomakethings.com/the-cluster-layout-with-modern-css/The Git Commands I Run Before Reading Any Codehttps://piechowski.io/post/git-commands-before-reading-code/Fresh pixelshttps://chrisburnell.com/article/fresh-pixels/Deconstructing these auto-generated OG imageshttps://bobmonsour.com/blog/deconstructing-these-auto-generated-og-images/How to add icons to external links with CSShttps://gomakethings.com/articles/how-to-add-icons-to-external-links-with-css/Why the accept attribute degrades file upload UXhttps://adamsilver.io/blog/why-the-accept-attribute-degrades-file-upload-ux/Do Websites Need to Function Exactly the Same on Every Platform?https://www.bram.us/2026/06/21/do-websites-need-to-function-exactly-the-same-on-every-platform/Create a portfolio that really works, with these insights from industry expertshttps://www.creativeboom.com/tips/creatives-share-portfolio-tips-that-really-work/