Frontend Dogma

“2022” Archive (7)

  1. HTML Is All You Need to Make a Website ·
  2. Alternative Text (Alt Text) · · , , ,
  3. Animated Grid Tracks With “:has()” · · , ,
  4. Sharing State in Distributed UIs at Runtime · · , ,
  5. The Business Case for Accessibility · · ,
  6. What If… One Day Everything Got Better? ·
  7. Thoughts on Exerting Control With Media Queries · · , ,
  8. Accessible Description Exposure · · ,
  9. A Simple Way to Create a Slideshow Using Pure CSS · · , ,
  10. How to Respond to Growing Supply Chain Security Risks? · · , , , ,
  11. Tweaking in the Browser · · ,
  12. “aria-labelledby” Usage Notes · · , ,
  13. Are You Using Coding Interviews for Senior Software Developers? · · , ,
  14. Top 3 Informational Interview Questions in UX · · , , ,
  15. Accessible Cards · · , ,
  16. Why We Don’t Use a Staging Environment · · ,
  17. How to Match HTML Elements With an Indeterminate State · · , , ,
  18. Exciting Times for Browsers (and CSS) · · ,
  19. The WebAIM Million: The 2022 Report on the Accessibility of the Top 1,000,000 Home Pages · · ,
  20. Designing a Better Infinite Scroll · · , ,
  21. Introduction to the SSH Protocol · · , ,
  22. Web Accessibility Guidance Project · · ,
  23. Accessibility Policy Implementation: What You Need to Know · · , ,
  24. HTML-Only Keyboard Shortcuts · · , ,
  25. How to Optimize Your LCP (with Visuals) · · , , ,
  26. Make Beautifully Resilient Apps With Progressive Enhancement ·
  27. Neubrutalism Is Taking Over the Web · · ,
  28. If We Can Make a Product Work for Anyone, It Usually Works Better for Everyone · · ,
  29. How to Document Accessibility Issues · · , ,
  30. Picture Perfect Images With the Modern “<img>” Element · · , , ,
  31. Understanding Layout Algorithms · · ,
  32. Secret Mechanisms of CSS · · ,
  33. Optimising Largest Contentful Paint · · ,
  34. Locale Aware Sorting in JavaScript · · , , ,
  35. CSS “:has” · · ,
  36. Case: Accessibility in Software Development ·
  37. An Opinionated Guide to Unit Testing · · , ,
  38. A Guide to Hover and Pointer Media Queries · · , ,
  39. 7 Learning Habits for Developers: Reach Skill Goals in Less Time ·
  40. Why Every Programmer Must Blog · · , , ,
  41. The Art of CSS Art · · ,
  42. How to Use Props in React · · , ,
  43. You’re Unselectable · · ,
  44. You ≠ User · · , ,
  45. Remix Routes Demystified · · ,
  46. Quick Survey: Help Improve the Simulation Options of Browser Developer Tools · · , , ,
  47. Building a Headless Design System · · , ,
  48. 14 Linting Rules to Help You Write Asynchronous Code in JavaScript · · ,
  49. Speed Needs Design, or: You Can’t Delight Users You’ve Annoyed · · , ,
  50. Variable Fonts in Real Life: How to Use and Love Them · · ,
  51. How Should You Name Your Colors in a Design System? · · , ,
  52. Designing “Above the Fold”? Try the Reciprocity Principle · · ,
  53. Those HTML Attributes You Never Use ·
  54. Resetting Inherited CSS With “Revert” · · ,
  55. There Are No Bad Questions in Accessibility ·
  56. The Web Is for Everyone: Our Vision for the Evolution of the Web · · , , , , , ,
  57. The 5 Riders of Accessible Media · · ,
  58. Spotlight: What Happens When a Project Team Shifts Accessibility Left? ·
  59. How Do Design Systems Improve Developer Efficiency? · · ,
  60. When to Use a Function Expression vs. Function Declaration · · , ,
  61. The Book on Accessibility · · , ,
  62. Optimising Core Web Vitals on SPAs · · , , ,
  63. Dynamically Generated Content and Accessibility: 3 Quick Tips · · ,
  64. Deep Dive into the CSS “:where()” Function · · ,
  65. ADA Web Site Compliance Still Not a Thing · · , ,
  66. Should “Cancel” Be a Button or a Link? · · , , ,
  67. Conquering JavaScript Hydration · · ,
  68. Do’s and Don’ts of Mobile UX Design · · , , ,
  69. “!important” Was Added for One Reason Only · · ,
  70. Design Mistakes That Hurt Your Web Site’s Conversion Rates · · , , ,
  71. Windows High Contrast Mode, Forced Colors Mode, and CSS Custom Properties · · , , ,
  72. Write HTML, the HTML Way (Not the XHTML Way) · · ,
  73. Usability Testing: Driving the Best User Experience for Business Success · · , ,
  74. Improving Your User Experience to Reduce Bounce Rates · · , , ,
  75. HTML Semantics · · ,
  76. Design Systems Aren’t Cheap · · , ,
  77. Design System—Principles of Success · · ,
  78. 4 Xs That Aren’t UX ·
  79. Typography in Design Tokens for Figma and Code · · , , ,
  80. How to Use CSS Math Functions: “calc”, “min”, “max”, “clamp” · · , , ,
  81. UX Strategy: Definition and Components · · ,
  82. Authorization in a Microservices World · · ,
  83. Performance Tests on Common JavaScript Array Methods · · , , ,
  84. The Web Doesn’t Have Version Numbers · · ,
  85. Why Is Dark Mode So Captivating? ·
  86. Google Calendar Webhooks With Node.js · · , ,
  87. How to Make a Drag-and-Drop File Uploader With Vue.js 3 · · , , ,
  88. How Do I Resolve Merge Conflicts? · · , ,
  89. Guidance on Web Accessibility and the ADA · · ,
  90. 4 Accessibility Mistakes Plaguing Most Government Websites · · ,
  91. The Impact That High Quality Mark-Up Can Have on Accessibility, Performance, and Discoverability · · , , ,
  92. Optimizing SVG Patterns to Their Smallest Size · · ,
  93. Migrating Our Monorepo to Yarn 2 · · , ,
  94. Identifying Fonts: The Complete Guide · · , ,
  95. The Future of the Web and Accessibility · · , ,
  96. Building a Loading Bar Component · · , , ,
  97. How to Prep Your SEO Strategy for a New Website · · , ,
  98. How to Empathize With Your Users · · , , ,
  99. What Every Good README Should Contain ·
  100. A Quick Guide to Closures · · ,
  101. Perceptually Uniform Color Models and Their Implications · · ,
  102. A Designer’s Guide to Documenting Accessibility and User Interactions · · , , ,
  103. What Makes You a Professional Web Developer ·
  104. Accessibility, Assistive Technology, and JavaScript · · , ,
  105. The Weirdly Obscure Art of Streamed HTML · · , ,
  106. Implementing JavaScript Delay for Cookie Consent Banner · · , , ,
  107. How to Automatically Size a Textarea Based on Its [Text] Using Vanilla JavaScript · · , ,
  108. Prevent Technical Debt With These 3 Strategies ·
  109. React Best Practices and Patterns to Reduce Code · · , ,
  110. Making the World’s Fastest Website, and Other Mistakes · · ,
  111. What Are Micro-Frontends? ·
  112. Don’t Believe the Type! · · , , , ,
  113. Explaining Micro Frontends as Simply as Possible ·
  114. In Defense of Sass · · ,
  115. It Needs to Map Back to a Role · · , , ,
  116. When or If ·
  117. Update Node Dependencies Automatically, Selectively, or Incrementally · · , , ,
  118. Tao of Node—Design, Architecture, and Best Practices · · , ,
  119. Aligning Content in Different Wrappers · · ,
  120. 20 Productivity Tips from Developers to Developers · · ,
  121. Giving New Meanings to the Color Functions in CSS · · , ,
  122. How to Use Spectator to Test Your Angular Components · · , , , ,
  123. The Future of Web Accessibility: WCAG 3.0 · · , ,
  124. 42 Tips for Getting Good at DevOps and Life · · , ,
  125. Where TypeScript Excels · · ,
  126. Horizontal Scrolling Nav · · ,
  127. Arrow Functions in JavaScript: How to Use Fat and Concise Syntax · · , ,
  128. A Look at the Dialog Element’s Super Powers · · , ,
  129. WebGPU—All of the Cores, None of the Canvas · · ,
  130. Carousels: No One Likes You · · , , ,
  131. You Don’t Always Need a CMS ·
  132. An Introduction to User Journey Maps · · , , ,
  133. Digging into CSS Media Queries · · , ,
  134. Accumulation of Tech Debt ·
  135. Ten Years of Page Bloat: What Have We Learned? · · , ,
  136. Don’t Alienate Your User: A Primer for Internationalisation and Localisation · · , ,
  137. 7 Ways to Achieve a Faster Core Web Vitals Score · · ,
  138. Session Timeouts · · ,
  139. An Introduction to AWS CloudFront Functions · · , , ,
  140. 10 Amazing Games to Learn CSS · · ,
  141. A New Speed Milestone for Chrome · · , , ,
  142. Using HTTPS in Your Development Environment · · , ,
  143. Performance Signals for Customizing Website UX · · , , ,
  144. Optimizing a Web Site for Google’s New UX Criteria · · , , ,
  145. Moderated Versus Unmoderated Usability Testing · · , ,
  146. JavaScript Naming Conflicts: How Existing Code Can Force Proposed Features to Be Renamed · · , ,
  147. Designing the User Experience of a Rating System · · ,
  148. Alternatives to Pagination on Product-Listing Pages · · , , ,
  149. Why I Avoid “async”/“await” ·
  150. Creating Native Web Components · · , ,
  151. The Basics—Generics in PHP · · ,
  152. Dive into Node.js Streams · · ,
  153. Building Web Layouts for Dual-Screen and Foldable Devices · · , ,
  154. How to Prevent SQL Injection Attacks in Node.js · · , , , ,
  155. How to Design Better APIs · · , ,
  156. The Importance of Screen Reader Software for Web Navigation · · , , , ,
  157. It’s Always Been You, Canvas2D · · , ,
  158. Interop 2022: Browsers Working Together to Improve the Web for Developers · · , ,
  159. The Best Design System Is No System ·
  160. Remix vs. Next.js · · , ,
  161. Accessibility and Limited Fine Motor Skills ·
  162. How Many Hyperlinks Are Too Many for Accessibility? · · ,
  163. Taming CSS Variables With Web Inspector · · , , ,
  164. How to Use Higher-Order Functions in JavaScript · · , ,
  165. How to Make a “Raise the Curtains” Effect in CSS · · , ,
  166. Progressive Enhancement, the New Hotness ·
  167. How Do Primitive Values Get Their Properties? ·
  168. New CSS Features in 2022 ·
  169. What’s Really Going On Inside Your node_modules Folder? · · , ,
  170. Simple Color System for Complex Digital Interfaces · · , , ,
  171. How to Build a File Upload Service With Vanilla JavaScript · · , ,
  172. Foundations: Headings · · , , ,
  173. Web Component Pseudo-Classes and Pseudo-Elements Are Easier Than You Think · · , ,
  174. (Not So) Short Note on Being Owned · · , ,
  175. Accessibility Checklist: Five Things Usually Left Out · · ,
  176. A Recipe for a Good Design System ·
  177. 5 Things You Don’t Need JavaScript For ·
  178. Solid.js Feels Like What I Always Wanted React to Be · · , ,
  179. Should Frontend Devs Care About Performance? ·
  180. Higher-Order Components in React Hooks Era · · , ,
  181. Importing ES6 Modules over HTTP/HTTPS in Node.js · · , , ,
  182. CSS “content” Property ·
  183. Top 2021 CSS Frameworks Report: The CSS File Sizes · · , , ,
  184. How I Structure My React Projects · · ,
  185. Screaming Architecture—Evolution of a React Folder Structure · · ,
  186. When to Avoid the “text-decoration” Shorthand Property ·
  187. Overlay Position and Recommendations · · ,
  188. 4 Simple Ways to Improve Web Accessibility · · ,
  189. Deploying a React Application to Netlify · · , , ,
  190. Understanding Dependencies Inside Your package.json · · , , ,
  191. Accessibility and Inclusivity in Practice · · , ,
  192. A Complete Guide to CSV Files in Node.js · · , , ,
  193. How to Make MPAs That Are as Fast as SPAs · · , , ,
  194. How to Fix Your Security Vulnerabilities With npm Override · · , , ,
  195. HTML Comments Work in JavaScript Too · · , ,
  196. Can You Get Pwned With CSS? · · ,
  197. Moving from Next to Remix · · , , ,
  198. Container Queries, the Next Step Towards a Truly Modular CSS · · , ,
  199. 5 Accessibility Quick Wins You Can Implement Today ·
  200. 15 Useful Placeholder Tools for Designers and Developers · · , , , , ,
  201. How to Prioritize Your Components · · , ,
  202. Design Systems in Figma: How to Be More Productive · · , , ,
  203. Comparing Gatsby and Next.js for Website Development · · , , ,
  204. SPAs Were a Mistake · · ,
  205. Favi-Gone: 6 Reasons Why Your Favicon Disappeared from the Google Search Results · · , , ,
  206. The Case for Adding Validation State to Your Design Tokens · · ,
  207. What Is Responsible JavaScript? · · ,
  208. Turning the Tables on Accessibility ·
  209. Support for Marking Radio Buttons Required, Invalid · · ,
  210. Reliably Send an HTTP Request as a User Leaves a Page ·
  211. Inclusive Design vs. Accessible Design: Understanding the Differences · · , , ,
  212. Component Tokens and Themes Example (to Learn Figma Tokens) · · , , , ,
  213. CSS Quick Tip: Animating in a Newly Added Element · · , ,
  214. Design System: How to Successfully Collaborate? · · , ,
  215. Writing Logic in CSS ·
  216. Let’s Get Inclusive: Designing Products for Everyone · · ,
  217. How Websites Die · · ,
  218. A Complete Guide to CSS Cascade Layers · · , ,
  219. Minimizing Google Fonts by Only Loading It for Certain Characters · · , , , ,
  220. Invisible Characters · · ,
  221. Column Headers and Browser Support · · , ,
  222. There Is No Character Limit for “Alt Text” · · , ,
  223. You Can “throw()” Anything in JavaScript—and Other “async”/“await” Considerations ·
  224. React State Management Libraries in 2022 · · , ,
  225. Using “mask” as “clip-path” · · , ,
  226. Structuring Documentation in Multi-Brand Design Systems · · ,
  227. Core Web Vitals: What Next? · · , ,
  228. Comparing Node JavaScript to JavaScript in the Browser · · , , ,
  229. How to Create a Search Page for a Static Website With Vanilla JS · · , , , ,
  230. Web Developers and Cognitive Biases · · ,
  231. What Makes Writing More Readable? · · ,
  232. Flexbox Dynamic Line Separator ·
  233. What Is the Difference Between WCAG Compliance Level A, AA, and AAA? · · , ,
  234. Track Down the JavaScript Code Responsible for Polluting the Global Scope · · ,
  235. 7 Lessons I’ve Learned in the Last Year as a Software Engineer · · ,
  236. The Harsh Reality for JavaScript Developers: If You Don’t Study the Fundamentals You Will Be Just Another “Coder” · · , ,
  237. The State of JavaScript 2021 · · ,
  238. An Auto-Filling CSS Grid With Max Columns of a Minimum Size · · ,
  239. Version 100 in Chrome and Firefox · · , , , , ,
  240. The Basics of package.json · · , , ,
  241. Foundations: Colour and Meaning · · ,
  242. Colors That Make Sense · · , ,
  243. 10 Mental Models Developers Can Use to Get Unstuck ·
  244. 7 Killer One-Liners in JavaScript ·
  245. WCAG 2.2 Update · · ,
  246. The Entire Cascade (as a Funnel) · · , ,
  247. Functions and the Future of Design Systems ·
  248. Why Radio Buttons Are Called Radio Buttons in UIs? · · , ,
  249. Using the Language Attribute to Make Your Website Accessible · · , ,
  250. Hello, CSS Cascade Layers · · ,