Frontend Dogma

News and Views in Frontend Development (5)

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

  1. The Ultimate CSS Flexbox Cheat Sheet with Examples · · ,
  2. Let’s Learn About Aspect Ratio in CSS · ·
  3. Why Validate? · · , , ,
  4. Ready-Made Counter Styles · · ,
  5. Micro-Expressions in User Testing: When Users Reveal Their True Emotional States · · ,
  6. Meet :has, a Native CSS Parent Selector (And More) · ·
  7. Building a Color Scheme · · ,
  8. An Interactive Guide to CSS Transitions · · ,
  9. Reasons Why Bugs Might Feel “Impossible” · ·
  10. Improving the UX of Your Design System · · ,
  11. Component-Specific Design Tokens · · ,
  12. Vue.js vs. React—Not Your Usual Comparison · · , , ,
  13. Using AVIF to Compress Images on Your Site · · , , ,
  14. What Can the HTTP Archive Tell Us About Largest Contentful Paint? · ·
  15. An Accessibility Strategy · ·
  16. Accessible Overflow · · , ,
  17. 10 Utility Functions for Working with Objects in JavaScript · ·
  18. Open Source Insights · · , , , ,
  19. CSS System Colors · · ,
  20. How To Fix Cumulative Layout Shift (CLS) Issues · ·
  21. CSS for Web Vitals · · , ,
  22. The Hidden World of “aria-hidden” · · ,
  23. Embracing Design Constraints · ·
  24. Thoughts for the Aging Web Developer · ·
  25. Why Accessibility Overlays Hurt More Than Help · ·
  26. Disabling a Link · · ,
  27. What Makes a Great Component Library? · ·
  28. How to Build an Image Comparison Slider · · ,
  29. Writing Better Regular Expressions in PHP · · , ,
  30. A Thorough Analysis of CSS-in-JS · ·
  31. Your Design System Is Actually a Product—Treat It Like One · ·
  32. CSS Container Queries: Use Cases and Migration Strategies · · ,
  33. Access Guide · · ,
  34. Svelte for the Experienced React Dev · · ,
  35. Useful and Useless Code Comments · · ,
  36. The New Responsive: Web Design in a Component-Driven World · · , ,
  37. How to Name Your Design System · · ,
  38. Don’t Overabstract Your Components · · , ,
  39. We Need to Talk About WCAG · · ,
  40. The Button Cheat Sheet · · ,
  41. Container Queries in Web Components · · ,
  42. Making Disabled Buttons More Inclusive · · ,
  43. Building a React Design System for Adoption and Scale · · ,
  44. A Complete Guide to Grid · · ,
  45. Web Application Development: The Ultimate Guide (2021) · ·
  46. Custom Attributes Are Fast Good and Cheap · · ,
  47. Overreliance on Overlays Is Counter to Enculturation of Accessibility · · ,
  48. Auditing Design Systems for Accessibility · · , , ,
  49. Understanding Design Systems—Designing Component APIs · · , ,
  50. Better Onboarding: How to Prevent Codebase Overwhelm · · ,
  51. Sometimes, a Billion Laughs Aren’t So Funny—Improving CSS Variables in WebKit · · ,
  52. A Guide to Newly Supported, Modern CSS Pseudo-Class Selectors · · ,
  53. Intrinsic Typography is the Future of Styling Text on the Web · · ,
  54. Five Reasons Your First Design System Will Fail · · ,
  55. CSS Hell · · ,
  56. Content-Aware Image Resizing in JavaScript · · ,
  57. The 5 Most Popular Front-End Frameworks Compared · · , , , , , ,
  58. Web Developer’s Guide to AVIF Images · · ,
  59. Variable Scope, Lexical Scope, and Code Blocks in JavaScript · ·
  60. Using Design Tokens to Accelerate Design Systems · · , ,
  61. Code in Quarantine · · ,
  62. 5 Things I’m Thinking About When I Check a Pull Request for Accessibility · · ,
  63. Primitive Values, Objects, and References in JavaScript Made Simple · ·
  64. Not Your Typical Horizontal Rules · ·
  65. Human-Readable JavaScript: A Tale of Two Experts · · ,
  66. Why Skip-Links Are Important for Accessibility · · ,
  67. React vs. Vue in 2021: Best JavaScript Framework · · , , ,
  68. The 5-Hour CDN · · , ,
  69. A Comprehensive Guide to JavaScript Design Patterns · · ,
  70. You Want Enabling CSS Selectors, Not Disabling Ones · · ,
  71. JavaScript: What Is the Meaning of “this”? · ·
  72. Beyond “console.log()”—Level Up Your Debugging Skills · · ,
  73. Enforce, Enable, and Empower · · ,
  74. Automating the Accessibility Tests of Your Source Code with GitHub Actions · · , ,
  75. Hello World · ·
  76. Managing CSS Colors Systems with a Single Source of Truth · · , ,
  77. Understanding Z-Index in CSS · ·
  78. One Figma Component—3,360 Variants · · ,
  79. Uniwidth Typefaces for Interface Design · · ,
  80. Building a Consistent Platform · ·
  81. In Critical Defense of Frontend Development · · ,
  82. The Definitive Guide to Feature Management · · ,
  83. HTML: The 16 Content Categories and Their Elements · · ,
  84. How Does CSS Work? · ·
  85. Why You Should Self-Host Google Fonts in 2021 · ·
  86. Alt vs. Figcaption · · , ,
  87. The Raven Technique: One Step Closer to Container Queries · · , ,
  88. Chasing the Pixel-Perfect Dream · · , ,
  89. New Google Quality Rater Guidelines, Update Adds Emphasis on Needs Met · · ,
  90. An Opinionated Guide to Accessibility Testing · · ,
  91. How to Find the Cause of Horizontal Scrollbars · · , ,
  92. CSS Variables 101 · ·
  93. Drawing the Invisible: React Explained in Five Visual Metaphors · · ,
  94. Custom Properties: Questioning “:root” · · , ,
  95. Loading Third-Party JavaScript · · ,
  96. The Anti-Reset · ·
  97. Effective Code Browsing · · ,
  98. Islands Architecture · · , ,
  99. Vue vs. React in 2021: Which Framework to Choose and When · · , , ,
  100. Micro-Frontends in Context · · ,