Frontend Dogma

News and Tools for Frontend Development (13)

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

  1. “mask-image” Lets You Do Some Really Cool Stuff · · , ,
  2. 4 More HTML Concepts You Didn’t Know · · , , ,
  3. Brief Note on Description List Support · · , , , ,
  4. Reading the Meter · · , ,
  5. Reduce Image Sizes by Removing Metadata · · , , ,
  6. The 411 on 4.1.1 · · , ,
  7. Website Accessibility Is Not an Afterthought · ·
  8. Swearing and Automatic Captions · · , ,
  9. Why You Should Be Using New CSS Features Today II · ·
  10. Bad UX Writing: 5 Mistakes to Avoid · · , ,
  11. How to Create Typography Guidelines for a Product That Does Not Follow a Design System · · , ,
  12. Does “www” Still Belong in URLs? · · ,
  13. Fast Is Good, Instant Is Better · · ,
  14. PHP Type Declarations—A Guide for Beginners · · ,
  15. Landmarks and Where to Put Them · · , , ,
  16. Amy Jiménez Márquez on Leading Information Architecture · · , ,
  17. Using SRI to Protect from Malicious JavaScript · · ,
  18. Super Useful CSS Resources · · , ,
  19. About Modern Sass · · ,
  20. Accessibility and MVPs · · ,
  21. Best APIs for Developers · ·
  22. “:has(:not())” vs. “:not(:has())” · · , ,
  23. Proximity: Gestalt Principle for User Interface Design · · , ,
  24. Prerender Pages in Chrome for Instant Page Navigations · · , , ,
  25. CSS Infinite and Circular Rotating Image Slider · · , ,
  26. You Don’t Need ARIA for That · · , ,
  27. 7 Website Performance Metrics to Track for Better UX · · , ,
  28. A Conversation With ChatGPT · · , , ,
  29. Developing Faster JavaScript Apps: The Ultimate Guide to Web Workers · · , , ,
  30. From Type to Logotype · · , , ,
  31. Migrating from Vue 2 to Svelte · · , ,
  32. The Final Google Fonts Knowledge Drop of 2022 · · , ,
  33. Digging Deeper into Container Style Queries · · ,
  34. How to Transfigure Wireframes into HTML · · , , ,
  35. Design Spacing Tokens Semantically · · , , ,
  36. A Vibe Shift Is Coming · · , ,
  37. Apache .htaccess · · ,
  38. 10 Key Principles of User-Centered Design · · , , ,
  39. Counting Unique Visitors Without Using Cookies, UIDs, or Fingerprinting · · ,
  40. HTML Semantics and Accessibility Cheat Sheet · · , , ,
  41. Making Microservices Accessible · · ,
  42. “px” or “rem” in CSS? Just Use “rem” · · ,
  43. Tips for Typing Import Statements in JavaScript · ·
  44. Transient Frameworks · · ,
  45. Handling Images With Inconsistent Height in CSS · · ,
  46. Why You Should Be Using New CSS Features Today · ·
  47. WordPress Versions 3.7–4.0 No Longer Get Security Updates · · ,
  48. Which Images Need Descriptive Text? · · ,
  49. 5 Ways to Make Your JavaScript More Functional · · ,
  50. Convert Any Value to a Boolean in JavaScript · ·
  51. Tailwind Is a Leaky Abstraction · · ,
  52. The Large, Small, and Dynamic Viewport Units · · ,
  53. Stop Fighting With CSS Positioning · · , ,
  54. Organizing the Eleventy Config File · · ,
  55. Speeding Up the JavaScript Ecosystem—One Library at a Time · · , ,
  56. Color Formats in CSS · · ,
  57. Debugging Tactics · ·
  58. Making Accessibility Simpler in Higher Education and Beyond · · ,
  59. Newer Things to Know About Good Ol’ HTML Lists · · ,
  60. Testing Static Types in TypeScript · · ,
  61. We Document Our Design Systems—Why Don’t We Systematise our Documentation? · · ,
  62. Designing a Utopian Layout Grid: Working With Fluid Responsive Values in a Static Design Tool · · , ,
  63. Shadow DOM and Accessibility: The Trouble With ARIA · · , , , ,
  64. Advanced Web Font Optimization Techniques · · , ,
  65. Content May Be King, but Design Is Queen · · ,
  66. HTML Content Model Categories · · ,
  67. Three Pillars of User Delight · ·
  68. CSS for URLs and HTTP Headers · · , ,
  69. Upgrade Your HTML IV · · , , , ,
  70. Addressing Concerns About CSS Speech · · ,
  71. Foundational Skills · ·
  72. A Guide to the Most Popular Types of APIs: REST, SOAP, GraphQL, and gRPC · · , ,
  73. Lazy Loading Images in HTML · · , ,
  74. Elements Can Be Visible Even Though Their Parent Has Set “visibility: hidden” · ·
  75. Forging Links · · , ,
  76. Growing Design System Documentation · · ,
  77. Positioning Notification Messages With Accessibility in Mind · · ,
  78. Document Object Model (DOM) Geometry: A Beginner’s Introduction and Guide · · , , ,
  79. Should Design Systems Include Problematic Components and Patterns? · · , ,
  80. The BBC’s 15 Web Principles—15 Years Later · · , ,
  81. Why Japan’s Internet Is Weirdly Designed · · ,
  82. Setting Up a Screen Reader Testing Environment on Your Computer · · , , , ,
  83. Git Is Not the End of History · · , ,
  84. The Shape-Shifting “a” Element · · , ,
  85. Accessibility and Inclusive Design Systems · · , , ,
  86. Node.js Architecture Pitfalls to Avoid · · ,
  87. Preparing for WCAG 2.2 · · , ,
  88. The “label” Element · · ,
  89. Down With Design Systems Dogma · ·
  90. CSS “:is()”, “:where()”, “:has()”, and “:not()” · · ,
  91. Our Future CSS Strategy · · , ,
  92. An Interactive Guide to Flexbox · · , ,
  93. Deploy Node.js to AWS: Build an Automated CI/CD Pipeline · · , , ,
  94. Natural Language Inputs · · ,
  95. The Value of Accessibility · · , ,
  96. Writing and Organizing Node.js API Tests the Right Way · · , ,
  97. Optimizing a Vue App · · , ,
  98. Improving Firefox Stability With This One Weird Trick · · , ,
  99. What Image Format Should You Use in Your Next Project? · ·
  100. Page Title Conventions · · , ,
  101. What Happened to Text Inputs? · · , ,
  102. Analyzing the Top 100 Retailers for Digital Accessibility · · ,
  103. DOJ and Congressional Updates on Digital Accessibility · · ,
  104. Incorporating Accessible Design Elements into Your Web Site · · ,
  105. Less Design Leadership—More Design Authorship · · ,
  106. What Is the Open Web? · · ,
  107. Harnessing Groupthink: Fine-Tuning CSS Specifications · · ,
  108. Taming the Cascade With BEM and Modern CSS Selectors · · , , , ,
  109. State of JavaScript 2022 · · ,
  110. 4 Mobile Must-Haves for a Modern UX Design Strategy · · , , ,
  111. How to Use Huge Type on the Web · · , ,
  112. A Guide to Keyboard Accessibility: JavaScript · · , , ,
  113. Brief Note on “aria-readonly” Support · · , , , ,
  114. Multidimensional Design Systems · · ,
  115. Today I Learned: The Subtle Art of Code Reviews · · , ,
  116. An Introduction to the Design Tokens File Format · · , ,
  117. Git Notes: Git’s Coolest, Most Unloved­ Feature · ·
  118. The Easiest Way to Get Started With CSS Grid · · , ,
  119. How to Handle Unplanned Work in Scrum · · , , ,
  120. The Ultimate Guide to Frontend Monitoring · · ,
  121. Back to Basics: What are Callbacks in JavaScript? · ·
  122. Firefox-Only CSS · · , , ,
  123. Style a Parent Element Based on Its Number of Children Using CSS “:has()” · · ,
  124. Experimenting With Layering, Filtering, and Masking in CSS · · , ,
  125. You Don’t Need HTML · · , ,
  126. A Guide to Image Optimization on Jamstack Sites · · , , , , , ,
  127. Accessibility Is in Style—Styles and Style Guides · · , , , ,
  128. CSS Best Practices: 16 Ways to Improve Your CSS Skills Quickly · · ,
  129. Theory-Building and Why Employee Churn Is Lethal to Software Companies · · ,
  130. Using Automated Test Results to Improve Accessibility · · , ,
  131. “vh”, “svh”, “lvh”, and “dvh” · ·
  132. Spy On “window.postMessage” Calls · · , ,
  133. Build and Deploy a Node.js Microservices Application · · , ,
  134. Improving React Interaction Times by 4× · · , ,
  135. 5 Insider Tips to Make Accessibility Part of Workflow · · , ,
  136. “Not Secure” Warning for IE Mode · · , , , ,
  137. Building Conscious Design Systems · ·
  138. The Best Programming Languages You Can Use for Web Development · · ,
  139. The Heuristics of Neurodesign · · ,
  140. Visual Design: Breaking into the Fourth Dimension of Experience Design · · ,
  141. Significant Improvements for Screen Readers Now in Nightly Firefox · · , , , , ,
  142. Your Accessibility Claims Are Wrong, Unless… · · ,
  143. Web Sustainability Resources · · ,
  144. Awesome Productivity Tools for Developers · · ,
  145. A Guide to Keyboard Accessibility: HTML and CSS · · , , , ,
  146. Content Strategy 101 · · ,
  147. Git Cheat Sheet With 40+ Commands and Concepts · · , ,
  148. The Evolution of Scalable CSS · · , , ,
  149. Don’t Disable the Zoom Functionality · ·
  150. The IndieWeb for Everyone · · ,
  151. CSS “:where()” “:is()” the Difference? · · ,
  152. CSS Grid and Custom Shapes III · · ,
  153. 10 Things I Wish I’d Known When Starting My Coding Journey · ·
  154. When Our Tools Hold Us Back · · , ,
  155. An Open Challenge (to Tech Event Organizers) · ·
  156. Are You Using an Accessibility Overlay to Help Disabled Users? Don’t! · · , ,
  157. Node.js Security Best Practices · · , ,
  158. State of Design Systems 2022 Survey · · ,
  159. What’s New in WCAG 2.2 · · , , ,
  160. Why Your Backend in Node.js Needs an API Layer and How to Build It · · , ,
  161. The Anatomy of “visually-hidden” · · ,
  162. Easily Switch Between Different Node Versions Using nvm · · , ,
  163. A Brief and Probably Only Partially Correct History of CSS Nesting · · , ,
  164. Accessfuturism: Digital Accessibility in 2032 · · , ,
  165. Browsers, JSON, and FormData · · , ,
  166. CSS Timeline · · , ,
  167. Cultivating Design Systems by Bringing Intention · ·
  168. Designing for People Who Use a Mouse · · ,
  169. Accessibility Contrast Requirements Explained and How to Fix 5 Common Low-Contrast Issues · · ,
  170. Foundations: Native Versus Custom Components · · , ,
  171. Generating Slugs Using One Line of Code in JavaScript · ·
  172. Is “CSS Engineer” Now a Job Position? · · ,
  173. TypeScript With Node.js · · ,
  174. What CSS Do You Absolutely Have to Know in 2022? · ·
  175. Early Learnings for Early Hints at Shopify · · , , ,
  176. How to Create the Perfect Hero Image for Your Portfolio Site · · ,
  177. How to Improve User Experience and Wow Your Users · · ,
  178. Dialogs, Modality, and Popovers Seem Similar—How Are They Different? · · , , , ,
  179. A Simpler Approach to Document and Web Accessibility · ·
  180. Managing CSS Styles in a WordPress Block Theme · · , , ,
  181. Saved from Callback Hell · ·
  182. The Superpowers of Design Tokens · · ,
  183. Using Data-Driven Analytics to Improve Your Site’s User Experience · · ,
  184. What Designers Can Learn from Apple’s New Accessibility Features · · , ,
  185. Why You Need to Monitor and Report on Accessibility—All the Time · · , , ,
  186. Responsive Accessibility Using “visibility: hidden” · · ,
  187. npm Security: Preventing Supply Chain Attacks · · , ,
  188. Client-Side Routing Without the JavaScript · · , ,
  189. Why Would Anyone Need JavaScript Generator Functions? · · ,
  190. Inside the Mind of a Frontend Developer: Hero Section · · ,
  191. Too Much Efficiency Makes Everything Worse: Overfitting and the Strong Version of Goodhart’s Law · · ,
  192. Visual Design in UX: Study Guide · · , , , ,
  193. Accessibility “Gaps” in MVPs · ·
  194. Writing Better Documentation · · ,
  195. 5 Takeaways from Screen Reader Usability Interviews · · , , ,
  196. An Animated Guide for Node.js Event Loop · · , ,
  197. 6 Steps to Improve HTML Images for Users and Developers · · , , ,
  198. Caring About the World Wide Web · · , , ,
  199. Minimal Dark Mode · · , ,
  200. See This Page Fetch Itself, Byte by Byte, over TLS · · , ,
  201. Ways to Improve Developer Onboarding on an Existing Codebase · · ,
  202. Frontend Dogma on Mastodon · ·
  203. 7 Tactics That Benefit Both Accessibility and SEO · · ,
  204. A Deep Dive into Accessible Notifications · · , ,
  205. A Testing Strategy for Accessibility in New Apps · · ,
  206. Progress over Perfection: A Better Way to Accessibility · · ,
  207. Why You Need to Involve Deaf and Hard of Hearing People in Research and Testing · · ,
  208. The Best PHP Frameworks for 2022 · · ,
  209. Speedy CSS Tip! Animated Gradient Text · · ,
  210. 16 Rare HTML Tags You Really Should Know · · ,
  211. Tips for Design System Component Pages · · , , , ,
  212. Sustainable Web Design Reduces E-Waste · ·
  213. An Introduction to CSS Cascade Layers · · , ,
  214. Design Management Toolbox: Non-Linear Professional Development · · ,
  215. Next Steps for the W3C Web Accessibility Initiative · · , ,
  216. Should Consistency Be a Goal of Design Systems? · · ,
  217. Designing the Perfect Mobile Navigation UX · · , ,
  218. Tips to Become a Great Software Engineer · ·
  219. How to Start a Content Audit · · , , , ,
  220. HTML and CSS Features, Tips for a 10× Faster Page Loading Speed · · , , ,
  221. Is Turbopack Really 10× Faster Than Vite? · · , , ,
  222. An Overview of JavaScript Promises · · , ,
  223. The New CSS Media Query Range Syntax · · ,
  224. TypeScript 5.0 Iteration Plan · ·
  225. “aria-label” Is a Code Smell · · , ,
  226. Intro to HTML-First Frontend Frameworks · · , ,
  227. Why One Web Pioneer Thinks It’s Time to Reinvent the Browser · · ,
  228. Screenshotting VoiceOver on macOS · · , , ,
  229. Folder Structure for Node.js and Express.js Project · · , ,
  230. My Divtober 2022 Drawings · · ,
  231. Complexity and Caution · · , ,
  232. 20+ Laravel Best Practices, Tips, and Tricks to Use in 2023 · · , ,
  233. 5 Visual Treatments that Improve Accessibility · · ,
  234. Hostile Patterns in Error Messages · · , , ,
  235. Knowing What It’s Not · · ,
  236. Do We Need an Interop for Assistive Technologies? · · , , , ,
  237. 7 Shorthand Optimization Tricks Every JavaScript Developer Should Know · · ,
  238. CSS Ellipsis for Single-Line and Multi-Line Text · · ,
  239. How to Build, Test, and Publish a TypeScript npm Package in 2022 · · , ,
  240. How to Create Advanced Animations With CSS · · , ,
  241. All Designers Start as Copycats (and That’s OK) · · ,
  242. Motion Controls in the Browser · · , ,
  243. Practical CSS Guide for Busy Developers · · ,
  244. React Concurrency, Explained · · , ,
  245. Using HSL Colors in CSS · · ,
  246. What Is a Realm in JavaScript? · ·
  247. Why You Should Never Use “px” to Set “font-size” in CSS · · ,
  248. How Flaky Tests Impact Developers · · ,
  249. How to Communicate Effectively as a Developer · · , , ,
  250. Type-Safe TypeScript With Type Narrowing · · ,