Frontend Dogma

News and Views in Frontend Development (5)

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. On Using Custom Properties (tweet) · · ,
  2. Common Mistakes When Writing CSS with BEM (tweet) · · ,
  3. Semantic “menu” Context (tweet) · · ,
  4. Respecting Users’ Motion Preferences (tweet) · · ,
  5. Prevent Scroll Chaining with Overscroll Behavior (tweet) · · ,
  6. Making the Web Developer’s Pilgrimage (tweet) · ·
  7. Identify Potential CSS Improvements (tweet) · · ,
  8. Designing for Color Contrast: Guidelines for Accessibility (tweet) · · , ,
  9. Decoupling HTML, CSS, and JavaScript in Design Systems (tweet) · · , , ,
  10. This Is the Way: A Phased Approach to Accessibility in the Development Lifecycle (tweet) · · ,
  11. We Analyzed 425,909 Favicons (tweet) · · ,
  12. New HTTP Standards for Caching on the Modern Web (tweet) · · , , , ,
  13. How to Cancel an HTTP Request in Node.js (tweet) · · ,
  14. How I Made Google’s Data Grid Scroll 10x Faster with One Line of CSS (tweet) · · ,
  15. Back to Basics: Understanding the “for…in” Loop in JavaScript (tweet) · ·
  16. Yes, Node.js Is Part of the Web Platform (tweet) · · , ,
  17. “@supports selector()” (tweet) · · , ,
  18. It’s Time for a Healthy Tech Approach (tweet) · ·
  19. Evaluating Clever CSS Solutions (tweet) · · ,
  20. What Svelte’s Accessibility Warnings Won’t Tell You (tweet) · · ,
  21. Understanding and Implementing OAuth2 in Node.js (tweet) · · ,
  22. HTML with Superpowers (tweet) · · , ,
  23. Fix Web Accessibility Systematically (tweet) · · , ,
  24. Chrome DevTools: Easily Change CSS Units and Values (tweet) · · , ,
  25. Landmarks (tweet) · · , ,
  26. Processing CPU-Intensive Jobs in Node.js (tweet) · ·
  27. Dealing with Timezones in Web Development (tweet) · ·
  28. 100 Bytes of CSS to Look Great Everywhere (tweet) · ·
  29. Expandable Sections Within a CSS Grid (tweet) · · ,
  30. Custom Properties with Defaults: 3+1 Strategies (tweet) · · ,
  31. Beginner’s Guide to Responsive Images: How to Get Them Right (tweet) · · , , ,
  32. Stop Writing JavaScript Like This (tweet) · ·
  33. Smart CSS Solutions for Common UI Challenges (tweet) · · ,
  34. “min()”, “max()”, and “clamp()”: Three Logical CSS Functions to Use Today (tweet) · ·
  35. Different Degrees of Custom Property Usage (tweet) · · ,
  36. Conditional “border-radius” and Three Future CSS Features (tweet) · ·
  37. The Ultimate Guide to 3xx HTTP Status Codes (tweet) · · , ,
  38. The Tortuous Journey of Enhancing Our Color Palette (tweet) · ·
  39. Building a Multi-Select Component (tweet) · · , , ,
  40. 1999: The Fall of Netscape and the Rise of Mozilla (tweet) · · ,
  41. What Constitutes a Digital Accessibility Audit (tweet) · · , ,
  42. How to Win at CORS (tweet) · · , ,
  43. How Design Debt Can Hurt Your Product (tweet) · · , ,
  44. Google Chrome Hidden Features Every Developer Should Know (tweet) · · ,
  45. Easy Read Is Hard to Get Right (tweet) · · ,
  46. Best UI Frameworks for React.js (tweet) · · ,
  47. Introduction to Styled Components (tweet) · · , ,
  48. Appreciation for Being a Web Developer (tweet) · ·
  49. A Tangled Web of ARIA (tweet) · · , ,
  50. Why We Crave Software with Style Over “Branding” (tweet) · · , ,
  51. Native CSS Nesting: What You Need to Know (tweet) · · ,
  52. Why Does Everything Look the Same? (tweet) · · ,
  53. Internationalization: How to Boost Traffic with a Multilingual Site (tweet) · ·
  54. How We Improved Our Design System Delivery (tweet) · · ,
  55. Have Single-Page Apps Ruined the Web? (tweet) · · , ,
  56. Buttons vs. Links (tweet) · · , ,
  57. Accessibility: A Gentle Introduction (tweet) · ·
  58. The Options for Password-Revealing Inputs (tweet) · · , , ,
  59. Safe DOM Manipulation with the Sanitizer API (tweet) · · ,
  60. RenderingNG: An Architecture That Makes and Keeps Chrome Fast for the Long Term (tweet) · · , ,
  61. My Challenge to the Web Performance Community (tweet) · · ,
  62. How to Implement and Style the “Dialog” Element (tweet) · · ,
  63. A Guide to CSS Debugging (tweet) · · , ,
  64. Why Do Webdevs Keep Trying to Kill REST? (tweet) · · , ,
  65. What Creating a Simple Font Taught Me About Font Design (tweet) · · ,
  66. UX Accessibility: How to Start Designing for All (tweet) · · , ,
  67. Browsing with a Mobile Screen Reader (tweet) · · , , ,
  68. Automating a Design System (tweet) · · , ,
  69. Writing Clean JavaScript Tests with the BASIC Principles (tweet) · · , ,
  70. Redundantly Redundant a11y Accessibility (tweet) · · ,
  71. How to Build an Expandable Accessible Gallery (tweet) · · , ,
  72. Conditional Border Radius in CSS (tweet) · ·
  73. Animation Techniques for Adding and Removing Items from a Stack (tweet) · · , ,
  74. The CSS “prefers-color-scheme” User Query and Order of Preference (tweet) · ·
  75. Using JavaScript to Detect High Contrast and Dark Modes (tweet) · · , , ,
  76. Introducing Svelte, and Comparing Svelte with React and Vue (tweet) · · , , ,
  77. Understanding and Working with Submodules in Git (tweet) · · ,
  78. Sorting JavaScript Arrays by Nested Properties (tweet) · · , ,
  79. Links, Missing “href” Attributes, and Over-Engineered Code (tweet) · · ,
  80. Web Streams Everywhere (and Fetch for Node.js) (tweet) · · ,
  81. Practical Frontend Philosophy (tweet) · ·
  82. How I Built a Modern Website in 2021 (tweet) · · , , ,
  83. Declaring Page Language—and Declaring Changes in Language (tweet) · · , ,
  84. Guidelines for Choosing a Node.js Framework (tweet) · · ,
  85. Faster React Apps with Memoization (tweet) · · , ,
  86. Comparing Page Language Declaration Setups in Screen Readers (tweet) · · , , , , ,
  87. Let’s Dive into Cypress for End-to-End Testing (tweet) · · ,
  88. Design Tokens Automation Pipeline: From Design Tools to Component Libraries (tweet) · · , ,
  89. Accessibility Isn’t New—and Neither Is Ableism (tweet) · · ,
  90. How I Make CSS Art (tweet) · · ,
  91. A JavaScript Developer’s Guide to Browser Cookies (tweet) · · , ,
  92. Beware False Negatives (tweet) · · ,
  93. Not Releasing Late on Fridays, a Matter of Courtesy (tweet) · · ,
  94. One Last Time: Custom Styling Radio Buttons and Checkboxes (tweet) · · , ,
  95. 7 UI Design Fundamentals for Developers (tweet) · ·
  96. When Everything Is Urgent, Nothing Is: What Is Alarm Fatigue and How to Deal With It (tweet) · ·
  97. Simplifying Form Styles with “accent-color” (tweet) · · ,
  98. Just Redux: The Complete Guide (tweet) · · ,
  99. “initial” Doesn’t Do What You Think It Does (tweet) · · ,
  100. A Content Model Is Not a Design System (tweet) · · , ,
  101. ct.css—Let’s Take a Look Inside Your “<head>” (tweet) · · , ,
  102. Container Units Should Be Pretty Handy (tweet) · · ,
  103. 7 Useful HTML Attributes You May Not Know (tweet) · ·
  104. Yarn vs. npm: Everything You Need to Know (tweet) · · , ,
  105. Optimising a JavaScript Library with WebAssembly, a Failed Attempt (tweet) · · , ,
  106. Node.js Garbage Collection Explained (tweet) · ·
  107. CSS Container Queries: Container-Relative Lengths (tweet) · · ,
  108. Cascade Layers? (tweet) · · ,
  109. 7 Practical Uses for the “::before” and “::after” Pseudo-Elements in CSS (tweet) · · ,
  110. Understanding “min-content”, “max-content”, and “fit-content” in CSS (tweet) · ·
  111. Simpler Block Spacing in WordPress with “:is()” and “:where()” (tweet) · · , ,
  112. How I Learnt to Stop Worrying and Love Animating the Box Model (tweet) · · ,
  113. Contemporary Design Has Lost Its Soul (tweet) · · ,
  114. 20 Killer JavaScript One-Liners (tweet) · ·
  115. Why Inequalities Can Appear in Digital Accessibility and Inclusive Design (tweet) · · , ,
  116. CSS Container Query Units (tweet) · · ,
  117. The New Requirements for WCAG 2.2 (tweet) · · ,
  118. What’s the Right Font Size in Web Design? (tweet) · · ,
  119. Small Bundles, Fast Pages: What to Do with Too Much JavaScript (tweet) · · , ,
  120. Web Vitals Patterns (tweet) · ·
  121. Web Quality Assurance: From User Requirements to Web Risk Management (tweet) · · , ,
  122. New Principle: Do Not Design Around Third-Party Tools Unless It Actually Breaks the Web (tweet) · · ,
  123. Minding the “gap” (tweet) · ·
  124. How to Expand Your Engineering Skill Set Without Quitting Your Day Job (tweet) · · ,
  125. Design Direction as a Step Before Design System (tweet) · · ,
  126. Accessible Palette: Stop Using HSL for Color Systems (tweet) · · , ,
  127. The Future of CSS: Cascade Layers (CSS “@layer”) (tweet) · ·
  128. Reducing the Need for Pseudo-Elements (tweet) · · ,
  129. Optimizing Images on the Web (tweet) · · ,
  130. 1995: MySQL Arrives, Completing the LAMP Stack (tweet) · · , ,
  131. Modernising CSS Infrastructure in DevTools (tweet) · · , , ,
  132. Master Frontend Development by Cloning These Websites (tweet) · · ,
  133. Designing Beautiful Shadows in CSS (tweet) · ·
  134. Notes on Synthetic Speech (tweet) · · ,
  135. 29 Projects to Help You Practice HTML CSS Javascript 2021 (tweet) · · , ,
  136. The Ultimate Guide to Web Console (tweet) · · , ,
  137. Myths About Web Accessibility (tweet) · · ,
  138. Less Absolute Positioning with Modern CSS (tweet) · ·
  139. Vanilla JS Is a Web Performance Decision (tweet) · · ,
  140. What Is Redundant Entry, and How Does It Affect Accessibility? (tweet) · · ,
  141. The Case for “Developer Experience” (tweet) · · ,
  142. Subsets and Supersets of WCAG (tweet) · · ,
  143. Okhsv and Okhsl (tweet) · · , ,
  144. Line Length Revisited: Following the Research (tweet) · · , ,
  145. Flexible API Design: Create Hooks for Your PHP API Pipeline (tweet) · · ,
  146. Enterprise UX: Essential Resources to Design Complex Data Tables (tweet) · · , ,
  147. Developer Decisions for Building Flexible Components (tweet) · · ,
  148. Bundling Non-JavaScript Resources (tweet) · ·
  149. Blowing Up HTML Size with Responsive Images (tweet) · · , , ,
  150. What’s New with DevTools: Cross-Browser Edition (tweet) · · ,
  151. What’s New in PHP 8.1: Features, Changes, Improvements, and More (tweet) · ·
  152. Using CSS 3 Overflow Properties to Make Containers Meet WCAG 2.1 (tweet) · · , ,
  153. Fractional SVG Stars with CSS (tweet) · · ,
  154. Firefox’s “bolder” Default Is a Problem for Variable Fonts (tweet) · · ,
  155. Defining Basic JavaScript Terms: “map,” “filter,” and “reduce” (tweet) · ·
  156. Becoming a Design Tokens Ambassador (tweet) · · ,
  157. 5 Steps for Writing Alt Text for Accessibility (tweet) · · ,
  158. 13 Advanced (But Useful) Git Techniques and Shortcuts (tweet) · · ,
  159. HTTP/3: Practical Deployment Options (tweet) · · , ,
  160. Color and Universal Design (tweet) · · , ,
  161. A Practical Guide to Creating Reusable React Components (tweet) · · , ,
  162. Designing for Long Waits and Interruptions: Mitigating Breaks in Workflow in Complex Application Design (tweet) · · , ,
  163. Stop! Put Down That Ternary, Lines Are Free (tweet) · ·
  164. The Pros and Cons of Professional Language (tweet) · ·
  165. Reducing Carbon Emissions on the Web (tweet) · · ,
  166. Multiple Accounts and Git (tweet) · ·
  167. Make Accessibility Part of Your Startup’s Products and Culture from Day One (tweet) · · ,
  168. Understanding Next.js Data Fetching (CSR, SSR, SSG, ISR) (tweet) · · ,
  169. Threats of Using Regular Expressions in JavaScript (tweet) · · ,
  170. The Effect of CSS on Screen Readers (tweet) · · , , ,
  171. Interactive Learning Tools for Front-End Developers (tweet) · · ,
  172. Getting Started with Web Accessibility Testing (tweet) · · ,
  173. Element Diversity (tweet) · · ,
  174. Web Scraping with JavaScript and Node.js (tweet) · · , ,
  175. Twitter’s “div” Soup and Uglyfied CSS, Explained (tweet) · · , ,
  176. It Takes a PhD to Develop That (tweet) · · ,
  177. Building a Split-Button Component (tweet) · · , , ,
  178. Best Practices for Logging in Node.js (tweet) · · , ,
  179. Writing High-Performance JavaScript (tweet) · · ,
  180. Why You Should Manage Your Energy, Not Your Time (tweet) · · ,
  181. 9.5 Ways Google Rewrites Your Title Tags (tweet) · · ,
  182. Using SVG with Media Queries (tweet) · · , ,
  183. Understanding Target Size Under WCAG 2.2 and How It Affects People with Disabilities (tweet) · · ,
  184. State Management in Next.js (tweet) · · ,
  185. Shifting Accessibility Testing to the Left (tweet) · · , ,
  186. Rethinking User Personas (tweet) · · ,
  187. Color and Contrast, What Does It Mean? (tweet) · · , ,
  188. Building Reactive Systems with Node.js (tweet) · ·
  189. Building a Stepper Component (tweet) · · , ,
  190. 1995: Apache and Microsoft IIS Shake Up the Web Server Market (tweet) · · ,
  191. What Are the Web Performance Metrics That Actually Matter? (tweet) · · ,
  192. Exploring the CSS Paint API: Blob Animation (tweet) · · , ,
  193. Common npm Mistakes Every Developer Should Avoid (tweet) · ·
  194. 7 Practices to Create Good JavaScript Variables (tweet) · ·
  195. Essential Concepts in JS (tweet) · · ,
  196. Creating a Positive Culture Around Accessibility (tweet) · · ,
  197. 7 Useful CSS Cheat Sheets to Improve Your Skills (tweet) · · ,
  198. 10 Fun Things You Can Do with GitHub.dev (tweet) · ·
  199. Compound Components in React (tweet) · · ,
  200. 5 Tools to Automate Your Development (tweet) · · , ,