{"id":382552,"date":"2024-11-15T15:25:53","date_gmt":"2024-11-15T22:25:53","guid":{"rendered":"https:\/\/css-tricks.com\/?page_id=382552"},"modified":"2025-07-24T11:42:11","modified_gmt":"2025-07-24T17:42:11","slug":"picks","status":"publish","type":"page","link":"https:\/\/css-tricks.com\/picks\/","title":{"rendered":"Picks"},"content":{"rendered":"\n<p class=\"archive-description\">An ongoing firehose of the latest 10 things we&#8217;re reading from around the web that we find interesting. <a href=\"https:\/\/feedbin.com\/starred\/a22c4101980b055d688e90512b083e8d.xml\" rel=\"noopener\">Subscribe to the feed.<\/a><\/p>\n\n\n<div class=\"feedbin-starred-feed-block\"><div class=\"article-grid\">\n            <article class=\"article-card starred-item\">\n                <div class=\"article-article\">\n                    <span>April 8, 2026<\/span>\n                    <h2>\n                        <a href=\"https:\/\/stuffandnonsense.co.uk\/blog\/i-got-tired-of-correcting-machines-so-i-gave-them-five-rules\" target=\"_blank\" rel=\"noopener noreferrer\">I got tired of correcting machines, so I gave them five rules<\/a>\n                    <\/h2>\n                    <div class=\"tags\">\n                        <cite>\n                            <a href=\"https:\/\/stuffandnonsense.co.uk\/blog\/i-got-tired-of-correcting-machines-so-i-gave-them-five-rules\" target=\"_blank\" rel=\"noopener noreferrer\">stuffandnonsense.co.uk<\/a>\n                        <\/cite>\n                    <\/div>\n                <\/div>\n                <div class=\"article-summary\">\n                    <div>Although I feel deeply conflicted, I\u2019ve been using AI coding tools more often to speed up particular aspects of development. Recently, I added an AGENTS.md to my setup so I don\u2019t need to repeat my preferences. Judge Dredd. Robot Wars. 2000AD comic. I started using ChatGPT and DeepSeek to help&#8230;<\/div>\n                <\/div>\n            <\/article>\n            <article class=\"article-card starred-item\">\n                <div class=\"article-article\">\n                    <span>March 30, 2026<\/span>\n                    <h2>\n                        <a href=\"https:\/\/blog.damato.design\/posts\/pretext-review\" target=\"_blank\" rel=\"noopener noreferrer\">Pretext review<\/a>\n                    <\/h2>\n                    <div class=\"tags\">\n                        <cite>\n                            <a href=\"https:\/\/blog.damato.design\/posts\/pretext-review\" target=\"_blank\" rel=\"noopener noreferrer\">blog.damato.design<\/a>\n                        <\/cite>\n                    <\/div>\n                <\/div>\n                <div class=\"article-summary\">\n                    <div>This weekend a project called pretext started making waves by Cheng Lou. Here\u2019s a gif that has been blowing up social media: There\u2019s no doubt about how impressive this demo is. The speed in which the text moves out of the way of the dragon is pretty incredible. As expected,&#8230;<\/div>\n                <\/div>\n            <\/article>\n            <article class=\"article-card starred-item\">\n                <div class=\"article-article\">\n                    <span>March 12, 2026<\/span>\n                    <h2>\n                        <a href=\"https:\/\/ma.tt\/2026\/03\/wordpress-everywhere\/\" target=\"_blank\" rel=\"noopener noreferrer\">WordPress Everywhere<\/a>\n                    <\/h2>\n                    <div class=\"tags\">\n                        <cite>\n                            <a href=\"https:\/\/ma.tt\/2026\/03\/wordpress-everywhere\/\" target=\"_blank\" rel=\"noopener noreferrer\">ma.tt<\/a>\n                        <\/cite>\n                    <\/div>\n                <\/div>\n                <div class=\"article-summary\">\n                    <div>As we announced and TechCrunch covered, my.wordpress.net has soft-launched. What this means is you need to fundamentally shift how you think about WordPress. From the beginning, WordPress has always been open source, giving you freedom, liberty, autonomy, and digital sovereignty. Open source is the most powerful idea of our generation&#8230;.<\/div>\n                <\/div>\n            <\/article>\n            <article class=\"article-card starred-item\">\n                <div class=\"article-article\">\n                    <span>March 11, 2026<\/span>\n                    <h2>\n                        <a href=\"https:\/\/www.matuzo.at\/blog\/2026\/geolocation-is-odd\" target=\"_blank\" rel=\"noopener noreferrer\">The geolocation element is odd<\/a>\n                    <\/h2>\n                    <div class=\"tags\">\n                        <cite>\n                            <a href=\"https:\/\/www.matuzo.at\/blog\/2026\/geolocation-is-odd\" target=\"_blank\" rel=\"noopener noreferrer\">matuzo.at<\/a>\n                        <\/cite>\n                    <\/div>\n                <\/div>\n                <div class=\"article-summary\">\n                    <div>Imagine the following scene: you&#8217;re on a website, and there&#8217;s a button. When you click the button, it shows some text, but the website&#8217;s font size is really small. So, you change the default font size in your browser from 16 to 24 pixels. You go back to the website&#8230;<\/div>\n                <\/div>\n            <\/article>\n            <article class=\"article-card starred-item\">\n                <div class=\"article-article\">\n                    <span>March 8, 2026<\/span>\n                    <h2>\n                        <a href=\"https:\/\/jeffbridgforth.com\/still-here\/\" target=\"_blank\" rel=\"noopener noreferrer\">Still here<\/a>\n                    <\/h2>\n                    <div class=\"tags\">\n                        <cite>\n                            <a href=\"https:\/\/jeffbridgforth.com\/still-here\/\" target=\"_blank\" rel=\"noopener noreferrer\">jeffbridgforth.com<\/a>\n                        <\/cite>\n                    <\/div>\n                <\/div>\n                <div class=\"article-summary\">\n                    <div>In January, I read Geoff Graham\u2019s article, Changing Roles. It dawned on him that somehow at sometime, he stopped being a web designer. It was not something he necessarily intended to happen. He took advantage of different opportunities and evolved into a new role. Web educator is the best way&#8230;<\/div>\n                <\/div>\n            <\/article>\n            <article class=\"article-card starred-item\">\n                <div class=\"article-article\">\n                    <span>March 6, 2026<\/span>\n                    <h2>\n                        <a href=\"https:\/\/newsletters.feedbinusercontent.com\/8b8\/8b807d45467e15232e2f185d5c6b0feb7769e708.html\" target=\"_blank\" rel=\"noopener noreferrer\">Modern Web Weekly #68<\/a>\n                    <\/h2>\n                    <div class=\"tags\">\n                        <cite>\n                            <a href=\"https:\/\/newsletters.feedbinusercontent.com\/8b8\/8b807d45467e15232e2f185d5c6b0feb7769e708.html\" target=\"_blank\" rel=\"noopener noreferrer\">newsletters.feedbinusercontent.com<\/a>\n                        <\/cite>\n                    <\/div>\n                <\/div>\n                <div class=\"article-summary\">\n                    <div>Modern Web Weekly #68The Modern Web, tested and explained in plain English\u034f &nbsp; \u2007 \u00ad\u034f &nbsp; \u2007 \u00ad\u034f &nbsp; \u2007 \u00ad\u034f &nbsp; \u2007 \u00ad\u034f &nbsp; \u2007 \u00ad\u034f &nbsp; \u2007 \u00ad\u034f &nbsp; \u2007 \u00ad\u034f &nbsp; \u2007 \u00ad\u034f &nbsp; \u2007 \u00ad\u034f &nbsp; \u2007 \u00ad\u034f &nbsp; \u2007 \u00ad\u034f &nbsp; \u2007 \u00ad\u034f &nbsp; \u2007&#8230;<\/div>\n                <\/div>\n            <\/article>\n            <article class=\"article-card starred-item\">\n                <div class=\"article-article\">\n                    <span>February 16, 2026<\/span>\n                    <h2>\n                        <a href=\"https:\/\/ericwbailey.website\/published\/heres-how-to-instruct-a-llm-to-reference-the-aria-authoring-practices-guide\/\" target=\"_blank\" rel=\"noopener noreferrer\">Here\u2019s how to instruct a LLM to reference the ARIA Authoring Practices Guide<\/a>\n                    <\/h2>\n                    <div class=\"tags\">\n                        <cite>\n                            <a href=\"https:\/\/ericwbailey.website\/published\/heres-how-to-instruct-a-llm-to-reference-the-aria-authoring-practices-guide\/\" target=\"_blank\" rel=\"noopener noreferrer\">ericwbailey.website<\/a>\n                        <\/cite>\n                    <\/div>\n                <\/div>\n                <div class=\"article-summary\">\n                    <div>Say you\u2019re working with a LLM and training it to write good frontend code. Good frontend code is accessible code, so of course you want to instruct the LLM to produce it. However, the bulk of frontend code on the web is inaccessible to some degree. Also know here that&#8230;<\/div>\n                <\/div>\n            <\/article>\n            <article class=\"article-card starred-item\">\n                <div class=\"article-article\">\n                    <span>February 3, 2026<\/span>\n                    <h2>\n                        <a href=\"https:\/\/www.jonoalderson.com\/conjecture\/more-than-words\/\" target=\"_blank\" rel=\"noopener noreferrer\">A page is more than just a container for words<\/a>\n                    <\/h2>\n                    <div class=\"tags\">\n                        <cite>\n                            <a href=\"https:\/\/www.jonoalderson.com\/conjecture\/more-than-words\/\" target=\"_blank\" rel=\"noopener noreferrer\">jonoalderson.com<\/a>\n                        <\/cite>\n                    <\/div>\n                <\/div>\n                <div class=\"article-summary\">\n                    <div>The latest SEO fad is the idea that websites need a machine-only version. Strip out the layout, remove the \u201cnoise\u201d, and hand LLMs a simplified view of your content. The pitch is always framed as pragmatic. Modern websites are bloated. LLMs don\u2019t need the design. They just want the content&#8230;.<\/div>\n                <\/div>\n            <\/article>\n            <article class=\"article-card starred-item\">\n                <div class=\"article-article\">\n                    <span>January 22, 2026<\/span>\n                    <h2>\n                        <a href=\"https:\/\/www.oddbird.net\/2026\/01\/22\/winging-it-28\/\" target=\"_blank\" rel=\"noopener noreferrer\">CSS Scope &amp; Mixins<\/a>\n                    <\/h2>\n                    <div class=\"tags\">\n                        <cite>\n                            <a href=\"https:\/\/www.oddbird.net\/2026\/01\/22\/winging-it-28\/\" target=\"_blank\" rel=\"noopener noreferrer\">oddbird.net<\/a>\n                        <\/cite>\n                    <\/div>\n                <\/div>\n                <div class=\"article-summary\">\n                    <div>At the end of 2025, Firefox added the CSS @scope rule \u2013 making the new feature available across all major browsers! Since Chris Coyier has done a fair amount of writing and speaking on the topic, we wanted to talk with him about what that means. Chris has also been&#8230;<\/div>\n                <\/div>\n            <\/article>\n            <article class=\"article-card starred-item\">\n                <div class=\"article-article\">\n                    <span>February 19, 2026<\/span>\n                    <h2>\n                        <a href=\"https:\/\/piccalil.li\/blog\/an-in-depth-guide-to-customising-lists-with-css\/?ref=main-rss-feed\" target=\"_blank\" rel=\"noopener noreferrer\">An in-depth guide to customising lists with CSS<\/a>\n                    <\/h2>\n                    <div class=\"tags\">\n                        <cite>\n                            <a href=\"https:\/\/piccalil.li\/blog\/an-in-depth-guide-to-customising-lists-with-css\/?ref=main-rss-feed\" target=\"_blank\" rel=\"noopener noreferrer\">piccalil.li<\/a>\n                        <\/cite>\n                    <\/div>\n                <\/div>\n                <div class=\"article-summary\">\n                    <div>This first rule of styling lists is that they should be treated with the same reverence you would show any other text. If a list is inserted within a passage of text, treat it as a continuation and integral part of that text. For bulleted or unordered lists, use padding&#8230;<\/div>\n                <\/div>\n            <\/article><\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>An ongoing firehose of the latest 10 things we&#8217;re reading from around the web that we find interesting. Subscribe to [&hellip;]<\/p>\n","protected":false},"author":2508,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":"","_share_on_mastodon":"0","_share_on_mastodon_status":"%title% %permalink%"},"tags":[],"class_list":["post-382552","page","type-page","status-publish","hentry"],"acf":{"show_toc":"No"},"share_on_mastodon":{"url":"","error":""},"jetpack-related-posts":[{"id":17951,"url":"https:\/\/css-tricks.com\/rss-feeds\/","url_meta":{"origin":382552,"position":0},"title":"RSS Feeds","author":"Chris Coyier","date":"September 3, 2012","format":false,"excerpt":"All Content The full enchilada, everything we publish. Add Feed Articles Tutorials, editorials, and news from around the front end. Add Feed Notes Things we're learning and documenting along the way. Add Feed Links Things we're reading that we think are worth sharing. Add Feed Guides Comprehensive deep-dives into CSS-related\u2026","rel":"","context":"Similar post","block_context":{"text":"Similar post","link":""},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":187280,"url":"https:\/\/css-tricks.com\/guest-writing\/","url_meta":{"origin":382552,"position":1},"title":"Write for CSS-Tricks!","author":"Chris Coyier","date":"October 29, 2014","format":false,"excerpt":"Interesting in guest writing on CSS-Tricks? It can be a great thing for everyone: you, our readers, and the site itself. Read up on what our expectations are, what you can expect, and what the workflow is like.","rel":"","context":"In \"writing\"","block_context":{"text":"writing","link":"https:\/\/css-tricks.com\/tag\/writing\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1581,"url":"https:\/\/css-tricks.com\/videos\/33-ecommerce-product-page-makeover\/","url_meta":{"origin":382552,"position":2},"title":"#33: eCommerce Product Page Makeover","author":"Chris Coyier","date":"January 3, 2009","format":false,"excerpt":"I subscribe to the theory that web page redesigns should be evolutionary not revolutionary. Making small changes, tweaks, and upgrades over time leads to a higher quality design than up and redesigning the entire thing on a whim or as a reaction. In this screencast, we take open up a\u2026","rel":"","context":"In &quot;Articles&quot;","block_context":{"text":"Articles","link":"https:\/\/css-tricks.com\/category\/articles\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":3392,"url":"https:\/\/css-tricks.com\/video-screencasts-3\/","url_meta":{"origin":382552,"position":3},"title":"Video Screencasts","author":"Chris Coyier","date":"August 12, 2009","format":false,"excerpt":"#40: How z-index Works Running time: 18:37 Z-index can be a little confusing sometimes. In this screencast I attempt to explain how it works, how it's tied to positioning, some quirks, and some general advice. #39: How to Use sIFR 3 Running time: 22:10 sIFR (Scalable Inman Flash Replacement) is\u2026","rel":"","context":"In &quot;Articles&quot;","block_context":{"text":"Articles","link":"https:\/\/css-tricks.com\/category\/articles\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":18624,"url":"https:\/\/css-tricks.com\/lodge\/v10\/109-preparing-for-working-on-comments\/","url_meta":{"origin":382552,"position":4},"title":"#109: Preparing for Working on Comments","author":"Chris Coyier","date":"October 1, 2012","format":false,"excerpt":"I'm very excited to work on the comments section for this site. CSS-Tricks is home to some excellent discussions, thanks to all you fine folks. Designing the comments section is important because it needs to showcase those great discussions, keep those great discussions happening, and facilitate all the functionality of\u2026","rel":"","context":"Similar post","block_context":{"text":"Similar post","link":""},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":182029,"url":"https:\/\/css-tricks.com\/lodge\/svg\/14-svg-icon-system-building-defs\/","url_meta":{"origin":382552,"position":5},"title":"14: SVG Icon System &#8211; Building Out Defs","author":"Chris Coyier","date":"September 10, 2014","format":false,"excerpt":"The element is clutch to this whole idea of an inline SVG icon system. We learned that a clean way to do it is to put everything you intend to draw later into a block so it doesn't render and we can reference them later (tell them browser to draw\u2026","rel":"","context":"With 2 comments","block_context":{"text":"With 2 comments","link":"https:\/\/css-tricks.com\/lodge\/svg\/14-svg-icon-system-building-defs\/#comments"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/382552","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/2508"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=382552"}],"version-history":[{"count":10,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/382552\/revisions"}],"predecessor-version":[{"id":388287,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/382552\/revisions\/388287"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=382552"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=382552"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}