Frontend Dogma

News and Views in Frontend Development (3)

Articles and books, tips and tricks, craft and beauty from the world of frontend development. Explore all topics. Stay informed per feed and on Twitter.

  1. What I Learned Implementing a Design System for an Existing Product (tweet) · ·
  2. Only 2% of Sites Meet Accessibility Standards—Let’s Change That (tweet) · · ,
  3. MHTML in Chromium (tweet) · · ,
  4. How to Make CSS Slanted Containers (tweet) · ·
  5. How Thinking About Hierarchical Grids Helps You Take a Content-First Approach to Design (tweet) · · , ,
  6. Everything Publishers Need to Know About URLs (tweet) · · ,
  7. Building an Adaptive Favicon (tweet) · · ,
  8. Accessibility Monitoring: How We Test (tweet) · · ,
  9. This Is Why Your Node.js Application Is Slow (tweet) · · ,
  10. Replace JavaScript Dialogs with the New HTML Dialog Element (tweet) · · ,
  11. New in JavaScript: “reportError”—a Method to Report to Global Event Handlers (tweet) · ·
  12. Move Over JavaScript: Back-End Languages Are Coming to the Front-End (tweet) · · , ,
  13. Developing a Focus Style for a Themable Design System (tweet) · · , ,
  14. Debugging JavaScript (tweet) · · ,
  15. Aspect Ratio Is Great (tweet) · · ,
  16. Modern, Single-Page Web Design: UX Design Trends and Tips (tweet) · · , ,
  17. Introducing the Dialog Element (tweet) · ·
  18. How to Favicon in 2022: Six Files That Fit Most Needs (tweet) · · ,
  19. Do We Need Screen Reader for Accessibility Testing (tweet) · · , , ,
  20. CSS Animations Tutorial: Complete Guide for Beginners (tweet) · · , ,
  21. Creating Generative SVG Grids (tweet) · · ,
  22. Accessibility Testing Best Practices in CI/CD (tweet) · · , , ,
  23. How to Use the Accessibility Tree for A11Y Testing (tweet) · · ,
  24. How to Create a UX-Vision Statement (tweet) · ·
  25. Are We Live? (tweet) · · ,
  26. What Web Frameworks Solve: The Vanilla Alternative (tweet) · · , ,
  27. Understanding the W3C’s Accessibility Conformance Testing (ACT) Requirements (tweet) · · , ,
  28. Foundations: Colour Contrast (tweet) · · , ,
  29. Design System Versioning: Single Library or Individual Components? (tweet) · · ,
  30. Why Efficient Hydration in JavaScript Frameworks Is So Challenging (tweet) · · , ,
  31. The Impact of Motion Animation on Cognitive Disability (tweet) · · , ,
  32. Reducing the Web’s Carbon Footprint: Optimizing Social Media Embeds (tweet) · · , , ,
  33. No Accessibility Without Disabilities (tweet) · · ,
  34. 8 Key Elements for Creating a Culture of Accessibility (tweet) · · ,
  35. State of Frontend 2022 (tweet) · · , ,
  36. Settings Are Not a Design Failure (tweet) · · , ,
  37. Improving JavaScript Bundle Performance with Code-Splitting (tweet) · · , , ,
  38. Grow Your Design System from Good to Great (tweet) · ·
  39. Assistive Technology, Accessible Technology, and the Accessibility Tree (tweet) · · , , ,
  40. Website Themes and Color Schemes (tweet) · · , ,
  41. Structuring Your Storybook (tweet) · ·
  42. “Evergreen” Does Not Mean Immediately Available (tweet) · · ,
  43. CSS—Understanding the Cascade (tweet) · · , ,
  44. Cascade Layers Are Coming to Your Browser (tweet) · · , , ,
  45. Building Like It’s 1984: A Comprehensive Guide to Creating Intuitive Context Menus (tweet) · · , ,
  46. 5 Pitfalls of Using Micro Frontends and How to Avoid Them (tweet) · ·
  47. 24 Lesser-Known HTML Attributes You May Want to Use (tweet) · ·
  48. Use Cases for CSS “fit-content” (tweet) · ·
  49. The Focus-Indicated Pseudo-Class “:focus-visible” (tweet) · ·
  50. Preventing Smooth Scrolling with JavaScript (tweet) · · ,
  51. Accessibly Insecure (tweet) · · ,
  52. A More Easy Way to Write “if … or” Checks with Vanilla JavaScript (tweet) · ·
  53. 4 Questions to Ask Before Using ARIA (tweet) · · , , ,
  54. Inclusive Design (tweet) · · ,
  55. Why You Should Use a Developer Font (tweet) · · , ,
  56. Why Testing After Is a Bad Practice (tweet) · ·
  57. What Web Frameworks Solve and How to Do Without Them (tweet) · · , , ,
  58. WCAG, But in Language I Can Understand (tweet) · · ,
  59. Internal Onboarding for Design System Teams (tweet) · · ,
  60. How Does “!important” Actually Work? (tweet) · · , ,
  61. Cascade Layers: First Contact (tweet) · · ,
  62. WebAssembly Feature Detection (tweet) · · , ,
  63. Top Ten Most Common Web Accessibility Issues (tweet) · ·
  64. To Create an Excellent Design System, Treat It Like a Collaborative Process (tweet) · · , ,
  65. There’s No Such Thing as Clean Code (tweet) · · , ,
  66. Naming Design Tokens (tweet) · · ,
  67. Demystifying TypeScript Discriminated Unions (tweet) · ·
  68. Cherry Picking Commits in Git (tweet) · ·
  69. Caching Header Best Practices (tweet) · · , ,
  70. A Pipe Operator for JavaScript: Introduction and Use Cases (tweet) · ·
  71. What’s New in DevTools? (tweet) · · ,
  72. The Return of Server Side Routing (tweet) · ·
  73. The Double-Assignment Pattern in jQuery’s Source Code (tweet) · · ,
  74. The Baseline for Web Development in 2022 (tweet) · · ,
  75. Overview of Accessibility Testing Using DevTools (tweet) · · , , ,
  76. How to Convert Markdown to HTML (tweet) · · , ,
  77. Fancy CSS Borders Using Masks (tweet) · · ,
  78. Design System: How to Efficiently Scale Development? (tweet) · · , ,
  79. Here’s What I Didn’t Know About “:where()” (tweet) · · ,
  80. Why Don’t Developers Take Accessibility Seriously? (tweet) · · ,
  81. The Risks and Rewards of App Modernization (tweet) · · , ,
  82. Monorepo Explained (tweet) · · , ,
  83. Foundations: Text Descriptions (tweet) · · ,
  84. Best Practices for Creating Your UX Design Portfolio (tweet) · · , , ,
  85. An Introduction to CSS Cascade Layers (tweet) · · ,
  86. More to Give Than Just the Div: Semantics and How to Get Them Right (tweet) · · , ,
  87. Drift: Why Your Design System Isn’t Working (tweet) · · ,
  88. The Many Ways to Modify Leading and Trailing Characters from Strings with JavaScript (tweet) · ·
  89. Technology Time-Outs (tweet) · ·
  90. How to Check What Item Is in Focus When Accessibility Testing (tweet) · · ,
  91. Context-Aware Web Components Are Easier Than You Think (tweet) · · , ,
  92. The Future of CSS: Detect At-Rule Support with “@supports at-rule(@keyword)” (tweet) · · ,
  93. Frontend Predictions for 2022 (tweet) · ·
  94. Div Divisiveness (tweet) · · ,
  95. Big Images, Blazingly Fast (tweet) · · , ,
  96. What Should Someone Learn About CSS If They Last Boned Up During CSS3? (tweet) · ·
  97. How to Set Up a Node.js Project with TypeScript (tweet) · · ,
  98. How to Avoid Layout Shifts Caused by Web Fonts (tweet) · · , ,
  99. Giving Web Standards a Seat at the Table (tweet) · · ,
  100. Design Systems Are Flawed (tweet) · · ,
  101. Create an Open Graph Image Generator with Node.js (tweet) · · , ,
  102. An Introduction to High Contrast Accessibility (tweet) · · ,
  103. Using PostCSS with Media Queries Level 4 (tweet) · · , ,
  104. TypeScript Features to Avoid (tweet) · ·
  105. Quick Accessibility Tests Anyone Can Do (tweet) · · , ,
  106. Naming Conventions for Your Design System (tweet) · · ,
  107. Making IT Accessible for All! (tweet) · · ,
  108. Building UI Components with SVG and CSS (tweet) · · , ,
  109. Becoming a Better Writer as a Software Engineer (tweet) · · , ,
  110. The Real Added Costs of Accessibility (tweet) · · ,
  111. Rethinking Component Libraries (tweet) · · ,
  112. On the Difficulty of Counting the Number of HTML Elements (tweet) · ·
  113. Modern Fluid Typography Using CSS Clamp (tweet) · · ,
  114. Frontend Challenges: Front-End Engineer Assignment (tweet) · · , , ,
  115. Find HTML Parsing Errors (tweet) · · , ,
  116. Comparing CSS Specificity Values (tweet) · · ,
  117. “structuredClone()”: Deeply Copying Objects in JavaScript (tweet) · ·
  118. Choosing Open Source License Wisely (tweet) · · ,
  119. CSS Cascade Layers: An Overview of the New “@layer” and “layer()” CSS Primitives (tweet) · · , ,
  120. Accessibility Data Is Not the Enemy (tweet) · · , ,
  121. Rationalise It! 5 Steps to Introduce a New Component to the Design System (tweet) · · ,
  122. Git Organized: A Better Git Flow (tweet) · · ,
  123. Building an Accessible Digital World (tweet) · · ,
  124. Accessibility and 2022: 13 Design Trends from a Usability Perspective (tweet) · · , , ,
  125. Website Performance and the Planet (tweet) · · , ,
  126. Web Accessibility Lawsuits Dramatically Rose in 2021 (tweet) · · , ,
  127. The State of JavaScript Survey (tweet) · · ,
  128. Boolean Attributes in HTML and ARIA: What’s the Difference? (tweet) · · ,
  129. An Introduction to Tech Debt (And Why It Can Change Your Career) (tweet) · · , ,
  130. Software Is Automating Design—What Does That Mean for Designers? (tweet) · · , ,
  131. Social Media Image Sizes 2022: Cheat Sheet for Every Network (tweet) · · , ,
  132. Revisiting Why Hyperlinks Are Blue (tweet) · · ,
  133. Remix vs. Next.js (tweet) · · , ,
  134. PHP in 2022 (tweet) · ·
  135. Make Beautiful Gradients (tweet) · · ,
  136. Writing with Respect (tweet) · ·
  137. HTML is General, ARIA is Specific (tweet) · · ,
  138. How Not to Learn TypeScript (tweet) · ·
  139. Foundations: Animations and Flashing Content (tweet) · · ,
  140. Don’t Fight the Cascade, Control It! (tweet) · · ,
  141. Alt Tag Emptiness (tweet) · · , , ,
  142. A Deep CSS Dive into Radial and Conic Gradients (tweet) · · ,
  143. Memory Leaks, How to Avoid Them in a React App (tweet) · · ,
  144. Your CSS Reset Needs “text-size-adjust” (Probably) (tweet) · · ,
  145. Two Ways to Clear an Array with Vanilla JavaScript (tweet) · · ,
  146. Ban Embed Codes (tweet) · · ,
  147. 22 Smart Google SEO Tips for 2022 (tweet) · · , ,
  148. Reduce the Pressure on Young and Inexperienced Developers (tweet) · · , ,
  149. Labeling the Point: Scenarios of Label Misuse in WCAG (tweet) · · , ,
  150. How to Measure Your Design System? (tweet) · · ,
  151. Memory Leaks: The Forgotten Side of Web Performance (tweet) · · ,
  152. The Good, the Bad, and the Toggle (tweet) · · ,
  153. The 6 Most Important CSS Concepts for Beginners (tweet) · · ,
  154. Styling Strategies Using Typography (tweet) · ·
  155. CSS Underlines Are Too Thin and Too Low in Chrome (tweet) · ·
  156. 30 Frontend Tips (tweet) · · , ,
  157. The Web Doesn’t Have Version Numbers (tweet) · · ,
  158. Imperative vs. Declarative Programming (tweet) · · ,
  159. Fetch Commit Logs of Certain Function or Method in Git (tweet) · ·
  160. Accessible Heading Structure (tweet) · · ,
  161. 8 Techniques to Write Cleaner JavaScript Code (tweet) · ·
  162. How Flexbox Works (tweet) · · ,
  163. Five 2022 Accessibility Trends (tweet) · · ,
  164. A Contrast of Errors (tweet) · · , , ,
  165. Page Visibility: If a Tree Falls in the Forest… (tweet) · · , ,
  166. Image Magnifier Using Only One Line of CSS (tweet) · · ,
  167. Exposing Mid-Resource LCP Values (tweet) · · ,
  168. A Unified Theory of Web Performance (tweet) · · ,
  169. Using Diagnostic Metrics (tweet) · · ,
  170. Add Less (tweet) · ·
  171. WCAG and Accessibility: What Is a Statement of Partial Conformance? (tweet) · · , ,
  172. Practical Tips for Load-Testing Web Applications (tweet) · · , , ,
  173. Empathetic Animation (tweet) · · ,
  174. Shedding Light on Fiverr’s Dark Mode Creation Process (tweet) · · ,
  175. Add a Service Worker to Your Site (tweet) · · ,
  176. Web Accessibility Cheat Sheet (tweet) · · ,
  177. CSS in 2022 (tweet) · ·
  178. The Business Case for Performance (tweet) · · ,
  179. 1000+ Web Development Resources (tweet) · · ,
  180. Faster Websites by Using Less HTML (tweet) · · , , ,
  181. The Many Methods for Using SVG Icons (tweet) · · , ,
  182. Show, Don’t Tell (tweet) · · , ,
  183. Redirect Liquidation (tweet) · · ,
  184. Personalize It! (tweet) · · ,
  185. Form Autocomplete (tweet) · · ,
  186. The CSS “:has()” Pseudo-Class, aka Parent Selector (tweet) · · ,
  187. Frontend Web Performance: The Essentials (tweet) · ·
  188. The CSS “:has()” Selector Is Way More Than a “Parent Selector” (tweet) · · ,
  189. Make Joyful Things (tweet) · · ,
  190. Introduction to Cognitive Disability and Accessibility Testing (tweet) · · ,
  191. CSS Snapshot 2021 (tweet) · ·
  192. CSS Animation (tweet) · · ,
  193. Building a Greener Web (tweet) · · ,
  194. Why UX Is the Best SEO Strategy (tweet) · · , ,
  195. The Web Starts on Page Four (tweet) · ·
  196. Smoothly Reverting CSS Animations (tweet) · · ,
  197. Image Display Elements (tweet) · · , ,
  198. How to Add and Remove a CSS Class from Multiple Elements with Vanilla JavaScript (tweet) · · ,
  199. Design Sprints Revisited: Designing with Your Users and Developers (tweet) · · ,
  200. Be Prepared for Failure and Handle It Gracefully (tweet) · · , ,