Frontend Dogma

News and Tools for Frontend Development (23)

(Stay up-to-date on all topics by RSS feed or on Mastodon.)

  1. CSS Can Help Improve Your HTML!? Buttons and Links · · , , , ,
  2. Details/Summary · · ,
  3. Performance Implications of JavaScript Errors · · , ,
  4. Practical Ethics for the Modern Web Designer · · ,
  5. The Ideal Line Length and Line Height in Web Design · · ,
  6. Visual Regression Testing for Design Systems With Figma Branches · · , , ,
  7. Read Your Website · ·
  8. Lessons Learned from Publishing a Content Security Policy · · , ,
  9. Intersection Observer · · ,
  10. WCAG 2.2: What We Know Till Now · · ,
  11. Embrace the Platform · · , , ,
  12. WCAG 2 Is What We Have · · ,
  13. Defer Non-Critical Resources · · ,
  14. 5 Key Benefits of Using a Tag Manager · ·
  15. WCAG 3 Is Not Ready Yet · · ,
  16. Standardizing Focus Styles With CSS Custom Properties · · , , ,
  17. How to Customize Firefox UI—Step-by-Step Tutorial · · , , , , , ,
  18. Breaking Out of the Box · · ,
  19. Caching: Understanding the Scope · · ,
  20. The Last Design You’ll Ever Make · ·
  21. Responsive Iframes With the CSS “aspect-ratio” Property · · ,
  22. WCAG 3 and APCA · · , , , ,
  23. 1993: Mosaic Launches and the Web Is Set Free · · ,
  24. 5 Reasons You Should Adopt a Micro Frontend Architecture · ·
  25. Content Separation · ·
  26. Writing Better CSS · · , ,
  27. Node.js Memory Limits—What You Should Know · · ,
  28. A Beginner’s Guide to Vue Router · · ,
  29. Defensive CSS · ·
  30. Explainer for W3C Accessibility Guidelines (WCAG) 3.0 · · ,
  31. Google Fonts Knowledge · · , ,
  32. Optimizing State Management in React Applications · · ,
  33. Test Your Product on a Crappy Laptop · · , ,
  34. Where Do You Put Spacing on Design System Components? · · , , ,
  35. HTTP Compression · · , , ,
  36. Why You Should Check in Your Node Dependencies · · ,
  37. Reduce Your Website’s Environmental Impact With a Carbon Budget · ·
  38. Designing Better Links for Websites and Emails: A Guideline · · , ,
  39. CSS Fingerprinting · · , , ,
  40. Have Core Web Vitals Made the Web Faster? · · ,
  41. The Love of Curvilinear Design · ·
  42. How Many People With Disabilities Use Our Site? · ·
  43. Plugging Memory Leaks in Your App · · ,
  44. Ain’t No Party Like a Third Party · · , ,
  45. JSON Modules in JavaScript · · , ,
  46. Request for a General Theory of Web Performance · ·
  47. Revisiting the Anatomy of a Design System · ·
  48. Why Every Developer Should Start Blogging · · , , ,
  49. Best Practices for Node.js Development · · , ,
  50. Markup · · , ,
  51. Understanding Accessibility · · , ,
  52. Why Color Contrast Is Not as Black and White as It Seems · · , ,
  53. The Fundamentals of CSS Layout · · , , ,
  54. Accessibility · · , ,
  55. CSS · · , ,
  56. HTTP · · , , ,
  57. JavaScript · · , ,
  58. Page Weight · · , ,
  59. Security · · , ,
  60. The Surprising Behavior of “Important CSS Custom Properties” · · , ,
  61. CSS Layout from the Inside Out · · , ,
  62. Making Accessibility More Accessible · ·
  63. Introduction to TCP Connection Establishment for Software Developers · · , ,
  64. Introduction to Svelte Actions · · ,
  65. Understanding WCAG 2.1 Level AAA · · ,
  66. Select Elements With “pointer-events: none” by Holding Shift · · ,
  67. How to Maintain a Large Next.js Application · · , ,
  68. On Yak Shaving and “<md-block>”, a New HTML Element for Markdown · · , ,
  69. What Is WHOIS and How Does It Work? · · ,
  70. Programmers Should Stop Celebrating Incompetence · ·
  71. Make Your Website Stand Out With a Custom Scrollbar · ·
  72. How to Trim Strings in JavaScript · · ,
  73. Three Phases of Life for Design Systems · ·
  74. Creating Generative Patterns With the CSS Paint API · · ,
  75. Get Started With Validation in Node.js · · ,
  76. What Kind of Developer Do I Want to Be? · ·
  77. 7 Ways to Improve Node.js Performance at Scale · · , ,
  78. Adding a Dyslexia-Friendly Mode to a Website · · ,
  79. Control Layout in a Multi-Directional Website · · , ,
  80. The 6 Ways of Writing HTML (and Their Combinations) · ·
  81. Functional Programming in PHP: Higher-Order Functions · · , ,
  82. Modern CSS in a Nutshell · ·
  83. How JavaScript Engines Achieve Great Performance · · , ,
  84. Responsive Layouts, Fewer Media Queries · · ,
  85. Blog Page Accessibility Deep Dive · · ,
  86. Designing Sustainable Websites · · , ,
  87. Dear HTML Element · ·
  88. Accessibility Myths · · ,
  89. Communicating Accessibility as Needs to Be Met and Not Rules to Be Followed · · ,
  90. Parallax Powered by CSS Custom Properties · · ,
  91. 20 Years of bram.us · ·
  92. Tales of the Autistic Developer—Order and Chaos · ·
  93. How to Make Blob Menu Using HTML, CSS and JavaScript · · , , ,
  94. Introduction to Web Sockets · · , , ,
  95. 1992: The Web vs. Gopher, and the First External Browsers · ·
  96. Let’s Not Send Developers to the Accessibility Tree Tool · · , ,
  97. PHP Date and Time Recipes · ·
  98. Various Ways to Include Comments on Your Static Site · ·
  99. Dynamic Color Manipulation With CSS Relative Colors · · ,
  100. Three Principles to Better Present Your UI Designs · · ,
  101. WCAG 3.0: What You Need to Know About the Future of Accessibility Standards · · , ,
  102. A Guide to Modern CSS Colors With RGB, HSL, HWL, LAB, and LCH · · , ,
  103. How to Create Reusable Components With the Vue 3 Composition API · · , ,
  104. Performance · · , , ,
  105. A Clever Sticky Footer Technique · · ,
  106. Reframing Tech Debt · ·
  107. We Need to Talk About Accessibility—Again, and Again, and Then Some More · ·
  108. 4 Ways to Document Your Design System With Storybook · · , ,
  109. Generate a Pull Request of Static Content With a Simple HTML Form · · ,
  110. Using Position Sticky With CSS Grid · · ,
  111. A Primer on Product Management for Engineers · · ,
  112. GitHub’s Commitment to npm Ecosystem Security · · , ,
  113. Your CSS Is an Interface · · ,
  114. Access to Tech, Tech to Live · · ,
  115. Get Your “Head” Straight · · , ,
  116. 5 Popular Frontend Development Tools in 2021 · ·
  117. Some Notes on Using esbuild · · ,
  118. How to Fetch Data in Svelte · · , ,
  119. Why IndexedDB Is Slow and What to Use Instead · · , , ,
  120. Design Systems, Structured Content, and Headless Publishing · · , , ,
  121. Useful React Hooks That You Can Use in Your Projects · · ,
  122. Using Web Workers to Boost Third-Party Script Performance · · , ,
  123. Chrome DevTools: Copy CSS Styles as JavaScript-Compatible Properties · · , , , , ,
  124. Why Your Website Should Not Use Dithered Images · · , , ,
  125. How to Debounce and Throttle Callbacks in Vue · · , , , ,
  126. Other Looks at the Conditional Border Radius Trick · · , ,
  127. Easy Dark Mode (and Multiple Color Themes) in React · · , ,
  128. It’s Not About Your Favorite Color—Moving from Brand Strategy to Visual Identity · · , ,
  129. View-Source · · ,
  130. Everything You Ever Wanted to Know About the Accessibility Tree · · ,
  131. A Beginner’s Guide to Routing in Next.js, With Examples · · , ,
  132. Browsing With Screen Magnification · · , , ,
  133. Be Usable, Not Consistent, Not Uniform · · ,
  134. How Designers Can Prevent User Errors · · , ,
  135. Localizing Your Next.js App · · , ,
  136. Detecting Specific Text Input With HTML and CSS · · ,
  137. Debugging HTML: Accessibility · · , ,
  138. Why You Should Prioritise Quality over Speed in Design Systems · ·
  139. Becoming an Expert · · , , ,
  140. Designing a Reorderable List Component · · , , ,
  141. PHP 8.1 in 8 Code Blocks · ·
  142. In Defence of Dialog · · ,
  143. Deep Dive into Node.js Architecture · · ,
  144. Chrome DevTools: Record and Playback Your User Journeys · · , , , , ,
  145. Everything You Have to Know About Core Web Vitals · · ,
  146. RenderingNG: The Next-Generation Rendering Architecture for Chrome · · , , , , , ,
  147. The Key to Developer Happiness and How to Prevent Coding from Becoming Just Another Job · · ,
  148. How to Implement Memoization in React to Improve Performance · · , , , ,
  149. Browser Wars · · ,
  150. Building Real-Life Components: Facebook Messenger’s Chat Bubble · · , ,
  151. Design Is Not Art, and UX Is Not Design · · ,
  152. Understanding the Differences Between WCAG 2.1 and WCAG 2.2 · · , ,
  153. Learn Forms · · , ,
  154. Learn PWA · · ,
  155. A Deep Dive into Serverless UI With TypeScript · · ,
  156. Designing Error Messages and a Logging Strategy in Node.js · · , , , ,
  157. Rebase vs. Merge: Integrating Changes in Git · · ,
  158. The State of the Web · · ,
  159. What Are Accessible Fonts? · · ,
  160. Name, Labels, ARIA, What to Do? · · , ,
  161. What Does a Good Design System Feel Like? · · ,
  162. A Comprehensive Guide to Error Handling in Node.js · · , , ,
  163. An Introduction to PostCSS · · , ,
  164. Developer Tools Secrets That Shouldn’t Be Secrets · · , ,
  165. The Guideline Gap · · , , ,
  166. Accessible Toggles · · , ,
  167. So, You Want to Build an “@ mention” Autocomplete Feature? · ·
  168. CSS-ing Candy Ghost Buttons · ·
  169. The Golden Ratio and User-Interface Design · ·
  170. HTMLoween—HTML, JS, and CSS to Make Your Blood Boil · · , ,
  171. You Probably Don’t Need Media Queries Anymore · · ,
  172. The Little Book of Little Books · · , , ,
  173. Chrome DevTools: Visualise Your JavaScript Bundles · · , , , , , ,
  174. Using CSS Variables for Reduced Motion on a Global Scale · · ,
  175. Indecisive Skip Links and Their Targets—the Renaissance of the “<hr>” Element · · , ,
  176. Make Your Design System Accessible—Color · · , ,
  177. Best Practices on Embedding Third-Party Web Widgets · · , ,
  178. UX Design Isn’t Killing Creativity, Money Is · · , ,
  179. A Step by Step TypeScript Tutorial for Beginners · · ,
  180. Media Queries Level 4: Media Query Range Contexts · · ,
  181. Photoshop’s Journey to the Web · · ,
  182. Design Systems at Replit: Better Tokens · · , ,
  183. So, You Want an Accessibility Score? · · ,
  184. The Problem With “Click Here” and “Learn More” Links · · , ,
  185. In-Page Filtered Search With Vanilla JavaScript · · , ,
  186. A Deep Dive into “object-fit” and “background-size” in CSS · · ,
  187. The Process of Building a CSS Framework · · ,
  188. Building an Effective Image Component · · , ,
  189. Why Accessibility Overlays on Your Website Can Make Things Worse · · ,
  190. Web Performance Metrics Cheatsheet · · ,
  191. If HTML and ARIA Don’t Allow It, It’s Probably a Bad Idea · · , ,
  192. Why Outdated jQuery Is Still the Dominant JavaScript Library · · , ,
  193. Finding Common Patterns Across Frameworks · · ,
  194. Switch Role Support · · , ,
  195. Micro-Frontends: The Next Gen Way to Build Web Apps · · ,
  196. The Start of a New Era for Responsive Web Design · · ,
  197. On Using Custom Properties · · ,
  198. Common Mistakes When Writing CSS With BEM · · , , ,
  199. This Is the Way: A Phased Approach to Accessibility in the Development Lifecycle · ·
  200. Decoupling HTML, CSS, and JavaScript in Design Systems · · , , ,
  201. Making the Web Developer’s Pilgrimage · ·
  202. Respecting Users’ Motion Preferences · · ,
  203. Semantic “menu” Context · · ,
  204. Identify Potential CSS Improvements · · , , , , ,
  205. Prevent Scroll Chaining With Overscroll Behavior · · ,
  206. Designing for Color Contrast: Guidelines for Accessibility · · , , ,
  207. Back to Basics: Understanding the “for…in” Loop in JavaScript · ·
  208. New HTTP Standards for Caching on the Modern Web · · , , , ,
  209. We Analyzed 425,909 Favicons · · ,
  210. How I Made Google’s Data Grid Scroll 10x Faster With One Line of CSS · · ,
  211. Optimizing Resource Loading With the Fetch Priority API · · , , ,
  212. How to Cancel an HTTP Request in Node.js · · , ,
  213. It’s Time for a Healthy Tech Approach · ·
  214. “@ supports selector()” · · , ,
  215. Yes, Node.js Is Part of the Web Platform · · , ,
  216. Evaluating Clever CSS Solutions · ·
  217. Understanding and Implementing OAuth2 in Node.js · · ,
  218. What Svelte’s Accessibility Warnings Won’t Tell You · · ,
  219. Chrome DevTools: Easily Change CSS Units and Values · · , , , , ,
  220. Fix Web Accessibility Systematically · · ,
  221. Disability: Let’s Say the Word · · ,
  222. HTML With Superpowers · · , ,
  223. Landmarks · · , ,
  224. Processing CPU-Intensive Jobs in Node.js · ·
  225. 100 Bytes of CSS to Look Great Everywhere · ·
  226. Dealing With Timezones in Web Development · ·
  227. Expandable Sections Within a CSS Grid · · ,
  228. Custom Properties With Defaults: 3+1 Strategies · · ,
  229. Beginner’s Guide to Responsive Images: How to Get Them Right · · , , ,
  230. Different Degrees of Custom Property Usage · · ,
  231. Smart CSS Solutions for Common UI Challenges · · ,
  232. Stop Writing JavaScript Like This · ·
  233. “min()”, “max()”, and “clamp()”: Three Logical CSS Functions to Use Today · · ,
  234. Conditional “border-radius” and Three Future CSS Features · · ,
  235. Five Proven Approaches for a Better Developer Experience in Your Organisation · ·
  236. The Ultimate Guide to 3xx HTTP Status Codes · · , ,
  237. The Tortuous Journey of Enhancing Our Color Palette · · ,
  238. Building a Multi-Select Component · · , , ,
  239. 1999: The Fall of Netscape and the Rise of Mozilla · · , , ,
  240. What Constitutes a Digital Accessibility Audit · · , ,
  241. How to Win at CORS · · , , , ,
  242. Easy Read Is Hard to Get Right · · ,
  243. Google Chrome Hidden Features Every Developer Should Know · · , , ,
  244. Best UI Frameworks for React.js · · ,
  245. How Design Debt Can Hurt Your Product · · ,
  246. Appreciation for Being a Web Developer · ·
  247. Introduction to Styled Components · · , , ,
  248. A Tangled Web of ARIA · · , ,
  249. Native CSS Nesting: What You Need to Know · · , ,
  250. Why We Crave Software With Style over “Branding” · · ,