Frontend Dogma

News and Tools for Frontend Development (17)

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

  1. How to Prevent Merge Conflicts (or at Least Have Less of Them) · · , ,
  2. How to Remove 99% of JavaScript from Main Thread · · , , ,
  3. Change Management for Accessibility · · ,
  4. CSS Card Shadow Effects · · ,
  5. Design Principles for the Web · · , , ,
  6. Simple CSS Solutions · · ,
  7. Understanding the JavaScript Window Object · · ,
  8. Why You Shouldn’t Modify Scrum · · , ,
  9. Should I Have Separate GitHub Accounts for Personal and Professional Projects? · · , , ,
  10. Software Engineering: The Soft Parts · ·
  11. Dialogs and Shadow DOM: Can We Make It Accessible? · · , , ,
  12. Design System Maturity · · ,
  13. The Folly of Design System “Foundations” · ·
  14. The Smallest CSS · · ,
  15. What We’ve Learned from One Year of Real User Monitoring Data on GOV.UK · · , ,
  16. Designing the Perfect Button · · ,
  17. Modern JavaScript, 10 Things You Should Be Using, Starting Today · ·
  18. AbortController Is Your Friend · ·
  19. Better Scrolling Through Modern CSS · · ,
  20. 10 Do’s and Don’ts of Web Design in 2022 · · ,
  21. Measuring the Performance of Typefaces for Users II · · , ,
  22. State of the Vuenion 2022 · · ,
  23. The Many Definitions of Server-Side Rendering · ·
  24. Write HTML Right · · ,
  25. Make DevTools Pick Colors Outside of Chrome · · , , , ,
  26. Single Element Loaders: The Spinner · · ,
  27. How We Think About Browsers · · ,
  28. Design Systems; the Great Connector · ·
  29. The Future of Frontend Build Tools · · ,
  30. Inclusive User Research: Analysing Findings · · , ,
  31. JavaScript Hydration Is a Workaround, Not a Solution · · ,
  32. Mobile-First CSS: Is It Time for a Rethink? · · ,
  33. Simplify Your Color Palette With CSS “color-mix()” · · , ,
  34. WCAG SC 1.4.4 Resize Text and 1.4.10 Reflow · · , ,
  35. Patterns for Building JavaScript Websites in 2022 · · , ,
  36. How to Animate SVG Shapes on Scroll · · , , ,
  37. How to Use Headings for Website Accessibility · · , , ,
  38. Aspects of Accessibility—Semantics, Contrast, and… Anxiety? · · , , ,
  39. Mathematical Notation for JavaScript Developers Explained · · ,
  40. Building Interoperable Web Components That Even Work With React · · , ,
  41. Optimize the Use of “if–else” · ·
  42. How to Create Dark Mode for Your Designs in Figma · · , ,
  43. Meet Web Push · · , , ,
  44. Are You Ignoring Digital Accessibility at Your Job? · · ,
  45. Best Practices for Overlays · · , ,
  46. Web Typography: Establishing a Strong Typographic System · ·
  47. Shallow Copy and Deep Copy · ·
  48. Can I DevTools? · · , , ,
  49. How to Use Variables in CSS · · , ,
  50. Measuring the Performance of Typefaces for Users · · , ,
  51. Hamburger Footer: Reaching the Bottom of Infinite Scroll · · ,
  52. WCAG 3 Compliant? Check Again · · , ,
  53. Why Most Design Systems Implode · · ,
  54. A Brief History of Responsive Web Design · · ,
  55. Web Development Resources · · ,
  56. Don’t Sink Your Website With Third Parties · · , ,
  57. Declarative Design Systems · ·
  58. Do We Have a Lack of Developers or a False Assumption What the Job Is? · ·
  59. Monorepos in JavaScript and TypeScript · · , ,
  60. Useful Built-In Node.js APIs · · ,
  61. Dealing With Hover on Mobile · · , , ,
  62. How to Pick the Least Wrong Colors · · , , ,
  63. Obscure CSS: Implicit List-Item Counter · ·
  64. The Cicada Principle and Why It Matters to Web Designers · · ,
  65. Writing Useful Alt Text · · , ,
  66. Checklist for Moderating a Usability Test · · , ,
  67. How Does Social Interaction Change in an Age of New Media? · · ,
  68. Interview With Léonie Watson · · ,
  69. Two Lines of CSS That Boosts 7× Rendering Performance · · , ,
  70. Understanding CSRF Attacks · ·
  71. JavaScript of Halftone Printing · · ,
  72. APCA: The New Algorithm for Accessible Colour Contrast · · , , ,
  73. 7 Tips to Improve Your TypeScript · · , ,
  74. You May Not Need a Bundler for Your npm Library · · ,
  75. Just How Long Should Alt Text Be? · · , ,
  76. Processing Arrays Non-Destructively: “for-of” vs. “.reduce()” vs. “.flatMap()” · · , ,
  77. The Story of the Custom Scrollbar Using CSS · · ,
  78. What npm Can Learn from Go · ·
  79. Manage Accessible Design System Themes With CSS “color-contrast()” · · , ,
  80. The “Form” Element Created the Modern Web—Was It a Big Mistake? · · , , ,
  81. npm Security Update: Attack Campaign Using Stolen OAuth Tokens · · , , ,
  82. What’s the Alternative (Text)? · · ,
  83. How to Fix: “Buttons Do Not Have Accessible Names” · · , ,
  84. 8 Shocking HTML Tips You Probably Don’t Know About · · ,
  85. CSS: Absolutely Positioning Things Relatively · · ,
  86. Making Headers Sticky Using CSS for a Better Reading Experience · · , ,
  87. Understanding Weak Reference in JavaScript · ·
  88. Why Are Iframe Titles Important for Accessibility? · · , ,
  89. A Perfect Table of Contents With HTML and CSS · · ,
  90. JavaScript Closures, Explained · ·
  91. Single Page Applications · ·
  92. Customizing Color Fonts on the Web · · , ,
  93. Advocating for Your Design System · ·
  94. Four Tradeoffs When Designing Navigation Menus · · ,
  95. Inclusive Design 101 · · ,
  96. Snyk Finds 200+ Malicious npm Packages, Including Cobalt Strike Dependency Confusion Attacks · · , , ,
  97. How to Position Your Design System Team for Success · · , , ,
  98. 15 Sprint Review Anti-Patterns—Scrum Anti-Patterns Guide 2022 · · , , ,
  99. 5 Things I’d Want to See Improved in WordPress Core · ·
  100. Lesser-Known and Underused CSS Features in 2022 · ·
  101. A Guide to Writing Industry Standard Git Commit Messages · · , ,
  102. Dialog Components: Go Native HTML or Roll Your Own? · · , ,
  103. Accessibility from Different Perspectives · ·
  104. The Balance Has Shifted Away from SPAs · ·
  105. First Look at the CSS “object-view-box” Property · ·
  106. Triaging WCAG 2.1 Level AAA · · , ,
  107. Fun With CSS Combinators · · ,
  108. Accessibility Not-Checklist · · , ,
  109. Let’s Make Accessibility Boring Again · ·
  110. Patterns · · , ,
  111. React Accessibility Resources · · , ,
  112. The Importance of Organizational Leadership in Developing an Accessibility Culture: Buy-In, Metrics, and Structure · · , , , ,
  113. Thinking Colors: Balancing Between Visual and Abstract · ·
  114. What We Can Learn from Remix · · ,
  115. Web Accessibility Is Broken—It’s Time to Fix It · · ,
  116. Automate Accessibility Tests With Storybook · · , , ,
  117. 4 Web Accessibility Remediation Mistakes to Avoid · · ,
  118. React Hooks Best Practices in 2022 · · ,
  119. Web Development === Accessibility · ·
  120. Use “@ supports” At-Rule for Feature Detection in CSS · · , , ,
  121. Quick and Dirty Text Diffing · ·
  122. The Rise and Fall of Neumorphism · ·
  123. Conditionally Loading CSS or Any Resource Using Media Queries · · , ,
  124. How to Ask for a Promotion · · ,
  125. Building a Button Component · · , , , ,
  126. RFC 9239: Updates to ECMAScript Media Types · · ,
  127. How the HTML “lang” Attribute Helps Accessibility · · , ,
  128. Reduce Array of Objects to an Object in JavaScript · · , ,
  129. The Forgotten Benefits of “Low Tech” User Interfaces · ·
  130. The Modern Way to Create and Host a WordPress Site · · , ,
  131. WCAG 2.2 and WCAG 3 Status Updates · · , ,
  132. UI and UX Micro-Tips · · , ,
  133. 24×24 Pixel Cursor Bookmarklet · · , , ,
  134. 9 Ways to Design Inclusive Content · · ,
  135. An Affordable Work-from-Home Setup for Remote Workers · ·
  136. Color Alignment for Multiple Design Systems · · ,
  137. Peering into the Accessibility of Dark Mode · · ,
  138. Rethinking Server-Timing as a Critical Monitoring Tool · · , , ,
  139. The Era of Rebellious Web Design Is Here · ·
  140. Unexpectedly HTTPS? · · ,
  141. Unpack Arrays Conditionally in PHP · · ,
  142. Web Applications 101 · · ,
  143. Building a Design System With Eleventy · · ,
  144. Quick Tip: You Might Not Need “calc()” · · ,
  145. :where() :is() :has()? New CSS Selectors That Make Your Life Easier · · ,
  146. More Common Accessibility Issues That You Can Fix Today · ·
  147. Personas vs. Archetypes · · , , , ,
  148. Keyboard Testing: The A11y Enhancement to Your Definition of Done · · , ,
  149. Call to Action Examples · · , , ,
  150. A Designer’s Journey of Ignorance, Resentment, and Wisdom · ·
  151. Does Javascript Make My Site Less Accessible? · · , ,
  152. Master the “:nth-child()” Pseudo-Class · · , ,
  153. Don’t Fight the Browser Preload Scanner · · , , ,
  154. Cool Hover Effects That Use CSS Text Shadow · · ,
  155. Tokens as Intents · · , ,
  156. W3C TAG Ethical Web Principles · · , ,
  157. Bringing Page Transitions to the Web · · , ,
  158. Debugging Accessibility With Chrome DevTools · · , , , , , ,
  159. Light and Dark Mode in Just 14 Lines of CSS · · ,
  160. How to Use Google CrUX to Analyze and Compare the Performance of JS Frameworks · · , , , ,
  161. Designing for Web Accessibility in 60 Seconds · ·
  162. Divs Are Bad! · · ,
  163. On Design Thinking · ·
  164. Why WCAG 2.2 Is Still in the Oven · · ,
  165. Bridging the Gap · · ,
  166. XHTML Syntax Is Still Worth Using · ·
  167. State of CSS 2022 · ·
  168. How to Learn JavaScript Fast: Six Simple Mind Tricks · · , , ,
  169. Cron Jobs: A Comprehensive Guide · · , ,
  170. Magical SVG Techniques · · , ,
  171. Under the Hood: React vs. Vue vs. Svelte · · , , , ,
  172. Two Approaches to Accessibility on the Web · · ,
  173. You Don’t Need “void 0” · ·
  174. The Complete Modern React Developer 2022 · ·
  175. A Different View into Accessibility Overlays · · , , , ,
  176. A Management Maturity Model for Performance · ·
  177. Frontend Versus Backend Web Development · ·
  178. Learn HTML [and] CSS · · , ,
  179. Performance Game Changer: Browser Back/Forward Cache · · , , ,
  180. Reinventing W3C Governance · · ,
  181. “Someone Should Build X for the Web”—Why Not You? · ·
  182. The Road to Universal JavaScript · ·
  183. Understanding User Behaviors Across Surfaces · ·
  184. Why SEO Is a Great Investment, Not Just a Cost · · ,
  185. My Opinion on What Makes a Good Code Review · · ,
  186. What’s Your Heading? · · , , ,
  187. Scaling CSS Layout Beyond Pixels · · , ,
  188. Learn CSS Subgrid · · ,
  189. Top 2021 CSS Frameworks Report: Validation · · , , , ,
  190. How to Use the GitHub Pulls API to Manage Pull Requests · · , ,
  191. A Guide to Writing About Digital Accessibility · · , ,
  192. Get to Know Your Browser’s Performance Profiler · · , ,
  193. Please, Stop Disabling Zoom · · ,
  194. Practical Use Cases for “:has()” Pseudo-Class · · , ,
  195. Resilience, Flexibility, and Immediacy: Working With Headless Systems · · ,
  196. 12 Modern CSS Techniques for Older CSS Problems · · , ,
  197. Fetch API Is [the] New Old Version of AJAX · · , ,
  198. Master Higher-Order Functions in JavaScript · · ,
  199. How to Use Videos With Alpha Transparency on the Web · · , ,
  200. Developing a Low-Touch Adoption Strategy for a New Design System · · ,
  201. How Not to Do Accessible Design · · , ,
  202. JavaScript Containers · · ,
  203. The Evolution of WCAG: A Postcard from the Front Lines · · , , ,
  204. Designing a Better Language Selector · · , , ,
  205. Design Patterns: How to Create Simple Interfaces · · , ,
  206. Nail Your Website Redesign in 2022—Tips and Tricks · · , ,
  207. Contextual Spacing for Intrinsic Web Design · · , ,
  208. In Defence of the Single Page Application · ·
  209. Lerna Has Gone—Which Monorepo Is Right for a Node.js Backend Now? · · , , ,
  210. Why I Don’t Miss React: A Story About Using the Platform · ·
  211. You Don’t Need a UI Framework · · , ,
  212. Legibility—How and Why Typography Affects Ease of Reading · · , , ,
  213. How to Create a Color Palette for Your Design System · · , , ,
  214. Microsoft Edge Overtakes Safari as World’s Second Most Popular Desktop Browser · · , , , , , , ,
  215. 5 Simple Productivity Tips for Developers · · ,
  216. It’s Time We Fix the Unethical Design of Cookie Consent Windows · · , , , ,
  217. 8 JavaScript Quiz [Questions] That May Confuse You · · ,
  218. Ethical Design Network · · , ,
  219. If Design Principles Are for Designs, Then Design Values Are for Designers · · ,
  220. Writing Better CSS · · , ,
  221. Creating Realistic Reflections With CSS · · ,
  222. Deep Dive into Text Wrapping and Word Breaking · · ,
  223. Design System Documentation Best Practices · · , ,
  224. Under-Engineered Multi-Selects · · , ,
  225. Creating a Firework Effect With CSS · · ,
  226. How to Reduce Figma Memory Usage · · ,
  227. Foundations: Lists · · ,
  228. How Web Browsers Work: Parsing the CSS · · , ,
  229. Best Practices for Integrating Content Design in Your Design System · · , , ,
  230. Let’s Keep the “Content” in WCAG · · , ,
  231. The CSS Art Paradox · · , , ,
  232. Understanding the Performance Impact of Anti-Flicker Snippets · · ,
  233. My Browser Support Strategy · · , , ,
  234. The Complete Guide to Regular Expressions (Regex) · · ,
  235. Common Frontend Interview Questions I’ve Been Asked · · , ,
  236. How to Build Node.js REST API With MySQL · · , , , ,
  237. CTA Modal: How to Build a Web Component · · , , ,
  238. Server-Side vs. Client-Side Analytics · · ,
  239. Introducing “inert” · · , ,
  240. A Practical Guide to Aspect Ratio in CSS · · , ,
  241. Learn to Code With JavaScript: The Most Popular Programming Language on Earth · · ,
  242. Cool Hover Effects That Use Background Properties · · , ,
  243. Web Scraping via JavaScript Runtime Heap Snapshots · · , ,
  244. The 5 Golden Rules of Code Reviews · · , ,
  245. Stop Removing Focus · · , ,
  246. A Guide to Task-Based UX Metrics · · , ,
  247. Apple’s Grip on iOS Browser Engines Disallowed Under Latest Draft EU Rules · · , , ,
  248. Is Measuring Speed a Useful Metric for Design Systems? · · , , ,
  249. Plain Old Semantic HTML: A Perfect Basis for Accessibility · · , ,
  250. Flexibly Centering an Element With Side-Aligned Content · · ,