![Frontend Dogma](https://d1cxmu1ofnef1v.cloudfront.net/media/logo.svg)
“2022” Archive (4)
- W3C Accessibility Maturity Model (by+/via) · · accessibility, w3c
- The Realities and Myths of Contrast and Color (via) · · accessibility, contrast, colors, myths
- So Your Designer Wants Stuff to Overlap (by) · · design, css
- Rewrite Your Git History in 4 Friendly Commands (by) · · git, command-line
- Introducing Signals (via) · · preact, state-management, signals
- How to Improve Largest Contentful Paint for Faster Load Times (by/via) · · how-tos, performance, web-vitals, optimization
- How to Build Event-Driven Architecture on AWS? (by/via) · · how-tos, architecture, events, aws
- Understanding Regulatory Compliance and Making It Work on Your Web Site (by/via) · · compliance, legal
- Top 5 Technology Trends in UX Design (via) · · user-experience, design, trends
- The Art of Writing Secrets: Encryption for JavaScript Developers (by/via) · · cryptography, javascript
- HTML Markup Tips for Developing Accessible Websites (by/via) · · html, accessibility, aria
- Getting Started With MathML (via) · · introductions, mathml
- Dreamy Blur (by) · · css, svg, effects
- A/B Testing in 7 Steps to Quickly Improve Your Conversions (by/via) · · testing, user-conversion, optimization
- 5 Reasons to Invest in User Experience (via) · · user-experience
- Prestige Is the Designer’s Achilles’ Heel (via) · · design
- Infinite Scrolling: When to Use It, When to Avoid It (by/via) · · usability, user-experience, scrolling
- A Content Warning Component (by) · · components, html, css
- A Beginner’s Guide to Design Tokens (by/via) · · guides, design-tokens
- Git Cheatsheet · · git, command-line, cheat-sheets
- Disabled JavaScript Turns Off Native Lazy Loading (by) · · javascript, html, performance, lazy-loading
- Dear Oracle, Please Release the JavaScript Trademark (by) · · javascript, legal
- What Is a Webmention and How Do I Use It in WordPress? (by/via) · · webmention, wordpress
- The Accessibility and Usability Journey of Drupal’s Primary Navigation (by/via) · · drupal, accessibility, usability
- Is It “:modal”? (by/via) · · css, selectors, modals
- Focus Appearance Explained (by) · · accessibility, wcag, forms, focus
- Big O Notation Basics Made Dead Simple (by) · · fundamentals, algorithms
- Useful JavaScript Data Grid Libraries (by/via) · · javascript, libraries, information-design, comparisons
- Is Design Thinking Overhyped? (via) · · design
- How I Maintain OSS Projects (by) · · foss, maintenance
- Don’t Overwrite Visual Labels With “aria-label” (by) · · accessibility, html, aria
- DevTools Tips: How to Inspect and Debug CSS Flexbox (via) · · how-tos, dev-tools, css, tips-and-tricks, user-agents, google, chrome
- Default Exports in JavaScript Modules Are Terrible (by) · · javascript
- Comparing JAWS, NVDA, and VoiceOver (via) · · accessibility, user-agents, assistive-tech, screen-readers, comparisons, jaws, nvda, apple, voiceover
- Accessible Lists and Tables (via) · · accessibility, html, tables
- Small Steps: Celebrating Four Accessibility Wins (by/via) · · accessibility, communication
- Neutrality Isn’t an Option When It Comes to Accessibility (by) · · accessibility
- 4 Ways to Minimize Your Dependencies in Node.js (by/via) · · nodejs, npm, dependencies
- Understanding “useMemo” and “useCallback” (by) · · react, hooks
- Things Not Available When Someone Blocks All Cookies (by) · · cookies
- JavaScript Bugs Aplenty in Node.js Ecosystem—Found Automatically (by/via) · · studies, research, nodejs, javascript, dependencies, security, quality
- Interpolating Numeric CSS Variables (by/via) · · css, custom-properties
- Cypress Testing: A Guide to Running Web Application Tests (via) · · guides, testing, cypress
- CSS Container Queries Are Finally Here (by) · · css, container-queries
- An Argument Against CSS Opacity (via) · · css, accessibility, colors, contrast
- What Makes A Great Toggle Button? II (via) · · forms, usability
- Should I Use a Button or a Link? (by) · · html, buttons, links, semantics
- Parents Counting Children in CSS (by) · · css, selectors
- Monitor Events and Function Calls via Console (by) · · javascript, events, monitoring
- Communication Around Digital Accessibility Must Improve: How Users and Businesses Alike Are Failing to Advance Digital Accessibility (via) · · accessibility, communication
- The Three Laws of Utility Classes (by) · · css, presentational-css
- An Ideal REST API—Best Practices (by) · · apis, best-practices
- What Is Closed Captioning? (by/via) · · accessibility, multimedia, captions
- Using Grid Named Areas to Visualize (and Reference) Your Layout (by/via) · · css, layout, visualization
- On Design System Support (by) · · design-systems
- Modern Alternatives to BEM (by) · · css, sorting, naming, bem, comparisons
- Making a Twitter Bot in the Year 2022 With Node.js (by) · · nodejs, twitter
- Be Good-Argument-Driven, Not Data-Driven (by) · · metrics, processes
- Why Your Website Should Be Under 14 kB in Size · · performance, protocols
- Short Note on “figure” and “figcaption” (by) · · accessibility, html
- Installing and Running Node.js Bin Scripts (by) · · installing, nodejs, npm
- Implementing Promisable “setTimeout” (by) · · javascript
- Designing Better Error Messages UX (by/via) · · user-experience, usability, design, errors
- CSS Classes Considered Harmful (by) · · css, html
- Complex Conditional Width Using “flex-basis” With “clamp” (by/via) · · css
- 20 Principles I Learned From 10 Years of Developing Software (by) · · principles
- Why Every University Needs an Accessible Standard Website Template (via) · · accessibility, content-management, frameworks
- What Is a REST API? (by/via) · · apis, javascript
- What Customer-First Web Design Looks Like (via) · · design, business-relations
- TIL: You Can Access a User’s Camera With Just HTML (by) · · html, permissions
- The Design Principle Paradox (by/via) · · design, principles
- Measure What You Impact, Not What You Influence (by) · · performance, metrics, optimization
- Creative List Styling (by/via) · · html, css
- Accessibility and Supporting Internet Explorer (by/via) · · accessibility, user-agents, microsoft, internet-explorer, support
- What’s the Value of a Design System? (by+/via) · · podcasts, design-systems
- Scaling SCM Front-End Design With a Design System (by+/via) · · design-systems, scaling
- How to Use localStorage in JavaScript: An Easy Guide (by/via) · · how-tos, javascript, storage, guides
- Exploring the Underrated “output” Element (by) · · html
- Does Accessibility Stifle the Creative Process? (via) · · accessibility, processes, creativity
- A Handy Use for Cascade Layers (by/via) · · css, cascade
- 8 Tricks for SVG Optimization (by/via) · · images, svg, tips-and-tricks, optimization
- Why User Personas Matter in UX Design (by/via) · · user-experience, usability, design, personas
- What Makes a Great Toggle Button? (via) · · forms, usability
- Prepare for WCAG 2.2 and Beyond (by/via) · · videos, wcag, accessibility, standards
- Meet the Top Layer: A Solution to “z-index:10000” (by/via) · · css
- Mac VoiceOver Testing the Simple Way (by/via) · · accessibility, testing, user-agents, assistive-tech, screen-readers, apple, voiceover
- Learn 5 Optimization Tips for Webpack Step by Step (via) · · webpack, optimization, tips-and-tricks
- Design Systems: Prototyping on Steroids (by/via) · · design-systems, prototyping
- CSS Grid and Custom Shapes II (by/via) · · css, design
- Conducting an Effective Web-Site UX Audit (via) · · user-experience, auditing
- Class-Less CSS Frameworks (by) · · css, frameworks, minimalism, resetting
- Bring Focus to the First Form Field With an Error (by) · · accessibility, forms, focus
- Advanced TypeScript Patterns: API Contracts · · typescript, apis
- You’re Not Using HTTP Status Codes Right (by) · · http, protocols
- A Simple “clamp()” Function in PHP (by) · · php, functions
- A Guide to Using User-Experience Research Methods (by/via) · · guides, user-experience, research
- Scaling a System (by) · · design-systems, scaling
- React Query vs. SWR (by) · · videos, react, data-fetching, comparisons
- When Do You Use CSS Columns? (by/via) · · css, layout
- Using “:has()” as a CSS Parent Selector and Much More (by/via) · · css, selectors
- Use the Right Container Query Syntax (by/via) · · css, container-queries
- Optimize Data Fetching (by) · · data-fetching, performance
- Inclusion Beats Optimization (by) · · accessibility, dei, optimization
- An Introduction to Context Propagation in JavaScript (by/via) · · introductions, javascript
- React Re-Renders Guide: Preventing Unnecessary Re-Renders (by) · · guides, react, client-side-rendering
- Outline Is Your Friend (by) · · css, accessibility
- How the CSS “:is”, “:where”, and “:has” Pseudo-Class Selectors Work (by/via) · · css, selectors
- Dependency Injection in JS/TS (via) · · javascript, typescript
- Can Browsers Optimize the Loading of Third-Party Resources? (by/via) · · performance, user-agents, embed-code
- Better Conditionals in CSS Media Queries With Range Syntax (by) · · css, media-queries
- Why React Re-Renders (by) · · react, client-side-rendering
- Introduction to Screen Readers (Desktop Edition) (by+/via) · · videos, introductions, accessibility, user-agents, assistive-tech, screen-readers, desktop
- Designing a Better Back Button UX (by/via) · · user-experience, usability, buttons
- Color and Contrast (by) · · websites, guides, colors, contrast
- What Are Design Tokens? (via) · · design-tokens
- Top 9 Ways to Become a Successful Self-Taught Developer (by) · · career, learning
- Table Column Alignment With Variable Transforms (by) · · html, css, tables
- CSS Grid and Custom Shapes (by/via) · · css, design
- Check Heading Accessibility Using the WAVE Tool (via) · · videos, accessibility, headings, assistive-tech, tooling, testing
- Building Accessible Select Components in React (by/via) · · components, react, forms, accessibility
- Accessible User Experience and A/B Testing · · accessibility, user-experience, testing, optimization
- What Was That Media Query Code Again? (by) · · websites, css, media-queries
- Tip: Use “fetchpriority=high” to Load Your LCP Hero Image Sooner (by) · · html, performance, web-vitals
- 5 Modern CLI Tools That Help Boost Your Productivity (by) · · tooling, productivity
- Websites: Past and Present (by/via) · · web, design, history
- The Console API (by) · · javascript, console, apis
- (Re-)Introducing Gatsby, a Reactive Site Generator (by/via) · · gatsby, react, performance, reactivity, site-generators, introductions
- On Ratings and Meters (by) · · semantics, html, css
- If You’re Not Checking, You’re Guessing (by/via) · · videos, user-experience
- Custom Event Naming Conventions (by) · · javascript, events, naming
- Creative CSS Layout (by/via) · · videos, css, creativity, layout
- Automation and Accessibility—What You Need to Know (by) · · videos, accessibility, automation
- An Introduction to Constraint Based Design Systems (by) · · introductions, design-systems
- TypeScript vs. JavaScript: Which One You Should Use, and Why (by/via) · · typescript, javascript, comparisons
- TypeScript: It’s Not Actually Validating Your Types · · typescript, validation
- Results of Quick Testing of Documentation Tools’ Accessibility (by) · · accessibility, documentation, tooling
- Modern CSS Selectors (by/via) · · css, selectors
- How and Why We Removed jQuery From GOV.UK (via) · · jquery, performance, maintainability
- Do You Know About “overflow: clip”? (by) · · css
- Here, Here, and Here (by) · · usability
- Designing for Long-Form Articles (by/via) · · design, content
- The Death of Mozilla Is the Death of the Open Web (by) · · web, mozilla
- SEO Links Obfuscation and Accessibility Problems (by) · · seo, links, obfuscation, accessibility
- How to Research Components and Patterns: Common Challenges and How to Overcome Them (by/via) · · how-tos, design-systems, components
- Defining “Integration” Tests (by) · · testing
- Core Web Vitals Tools to Boost Your Web Performance Scores (by/via) · · performance, web-vitals, tooling
- Code Golfing Tips and Tricks: How to Minify Your JavaScript Code (by/via) · · how-tos, javascript, minification, tips-and-tricks
- Brief Note on Calendar Tables (by) · · accessibility, tables, assistive-tech
- Accessibility Is Writing (by) · · accessibility, writing
- Zooming Images in a Grid Layout (by/via) · · css, effects
- The JavaScript Paradox (by/via) · · javascript
- Dark Mode With Design Tokens (by/via) · · design-tokens, dark-mode
- No Demo [Website] Reno (by) · · design, processes
- Capturing Images and Videos From the Camera of Mobile Devices Using HTML (by) · · html, multimedia, mobile
- Bringing Perspective to CSS (by) · · css
- 5 Good Practices to Scale Your React Projects Easily (by) · · react, scaling, best-practices
- The Infinite Marquee (by) · · html, css, animations
- Polyhierarchy in Information Architecture (by/via) · · videos, information-architecture
- How to Use Multithreading in Node.js (by/via) · · how-tos, nodejs, multithreading
- How I Added Scroll Snapping to My Twitter Timeline (by/via) · · css, scrolling, twitter
- What Are Best Practices for Creating Alt Text? (via) · · accessibility, writing, alt-text, best-practices
- One-Dimensional Website Optimization Considered Harmful (by) · · optimization, quality
- Not All Zeros Are Equal (by/via) · · css
- Light/Dark Mode (by) · · websites, css, javascript, dark-mode
- AI-Generated Images From AI-Generated Alt Text (by) · · accessibility, images, writing, alt-text, ai
- 5 Heading Accessibility Issues and How to Fix Them (via) · · accessibility, headings, microcontent
- One Year of Coding—Recommendations for Beginners From a Beginner (by/via) · · learning, semantics, accessibility
- Migration From jQuery to Next.js: A Guide (by/via) · · guides, migration, jquery, nextjs
- Introducing the New npm Dependency Selector Syntax (via) · · npm, introductions
- “:has()”: The Family Selector (by/via) · · css, selectors
- Popular Node.js Patterns and Tools to Re-Consider (by/via) · · nodejs, tooling
- Making a Website Under 1 kB (by) · · performance, minimalism, html
- Introduction to SolidJS (by/via) · · introductions, solidjs
- Finer Grained Control Over CSS Transforms With Individual Transform Properties (by+/via) · · css
- A Delightful Guide to Culture at Mamo (Inspired by Khalil Gibran) (by) · · case-studies, guides, culture
- Ruby Styling (by/via) · · html, ruby-markup, css
- IE: RIP or BRB? (by/via) · · videos, user-agents, microsoft, internet-explorer, history
- Fluid Sizing Instead of Multiple Media Queries? (via) · · css, media-queries
- Exploring CSS Grid’s Implicit Grid and Auto-Placement Powers (by/via) · · css, layout
- CSS Border Animations (by/via) · · css, borders, animations
- The Importance of Clean Code in Your Startup’s Success (by) · · quality
- Fitts’s Law and Its Applications in UX (by/via) · · user-experience, interaction-design
- An Introduction to Webmention · · introductions, webmention
- How to Add a Subtle Gradient on Top of an Image Using CSS (by) · · how-tos, css, gradients
- Firefox (and Other Browsers), Forgotten? (by) · · user-agents, mozilla, firefox, testing
- Checking if a JavaScript Native Function Is Monkey Patched (by) · · javascript, functions
- Which Generator Builds Markdown the Fastest? (by) · · site-generators, markdown, performance, comparisons
- Use the Active Voice to Transform Your Design System Documentation (by) · · design-systems, documentation, writing
- The Horizontal Overflow Problem (by) · · css
- 10+ Things I Always Set Up in Git When I Prepare a New Environment (by) · · git, command-line, environments
- When Will Scrum Die? (by/via) · · agile, scrum, kanban, processes
- Underengineer Your Websites (by/via) · · videos, interviews, accessibility
- The Advanced Guide to the CSS “:has()” Selector (via) · · guides, css, selectors
- Testable Frontend: The Good, the Bad, and the Flaky (by/via) · · testing
- Recreating MDN’s Truncated Text Effect (by/via) · · css, effects
- Quick Tip: Negative Animation Delay (by/via) · · css, animations, tips-and-tricks
- Detecting CSS Selector Support With JavaScript (by) · · css, selectors, feature-detection, support
- Adding Observability to Your Jest Tests (via) · · javascript, jest, testing, observability
- 8 Simple Steps to Complete a Technical SEO Audit (via) · · seo, auditing
- 500 ms to 1.7 ms in React: A Journey and a Checklist (by) · · performance, react
- You Don’t Need Microservices (by/via) · · microservices
- Why I’m Learning TypeScript · · typescript
- Design Systems for Humans (by) · · design-systems, user-experience
- CSS Minimal Dark Mode Toggle Button (by) · · code-pens, effects, minimalism
- Adventures in Text Rendering: Kerning and Glyph Atlases (via) · · typography, kerning
- Abbreviations Suck (by) · · accessibility, html
- 3 Simple Ways to Center an Element Using CSS (by/via) · · videos, css, centering
- UX Principles That Include Cognitive Accessibility (by) · · user-experience, accessibility, principles
- The 10 Affirmations of Good Digital Accessibility (via) · · accessibility
- Speaking Up and Speaking Out: Tactical Communication in Accessibility (by/via) · · accessibility, communication
- Neubrutalism Style in UX: A Twist on the Dominant Modern Minimalist (by/via) · · design, user-experience, minimalism
- Maintenance Matters (via) · · maintenance, code-reviews, consistency, testing, logging, documentation
- Introducing Even More Security Enhancements to npm (by+/via) · · npm, security
- Django Tips and Tricks (via) · · django, tips-and-tricks
- #ADA32: The ADA Has Applied to Digital for Decades (by) · · accessibility, legal
- A Good Reset (by) · · css, resetting
- Your Code Doesn’t Have to Be a Mess · · quality
- Typography in Web Design (via) · · typography, design
- Solving the “Dangler” Conundrum With Container Queries and “:has()” (by) · · css, selectors
- Priority Hints—What Your Browser Doesn’t Know (Yet) (by/via) · · performance, hints
- Everything You Need to Know About JavaScript Import Maps (by/via) · · javascript
- “<article>” vs. “<section>”: How to Choose the Right One (by/via) · · html, semantics, comparisons
- 5 Best UX Careers to Pursue in 2022 (via) · · user-experience, career
- Mobile UX: Study Guide (by/via) · · guides, user-experience, mobile, training, link-lists
- Clean Architecture: Applying With React · · architecture, react
- The History of JavaScript (by) · · history, javascript
- Ancient Web Browsers · · websites, user-agents, history
- What Is HCI (Human-Computer Interaction)? Meaning, Importance, Examples, and Goals (via) · · concepts, hci, examples
- Understanding CSS “:has()” (by/via) · · videos, css, selectors
- Type Annotations in JavaScript (by/via) · · javascript, typescript
- Say No to Tailwind, Embrace Plain CSS (by) · · frameworks, tailwind, css
- Intro to Serverless Functions (by/via) · · introductions, serverless, functions, netlify
- Definitive Guide to CAPTCHA Accessibility (via) · · guides, accessibility, captcha
- With “:focus-visible”, You Can Have Focus Styles When It Makes Sense (by) · · css, selectors, accessibility, keyboard-navigation, focus
- Where’s the Fun in Accessibility? (by/via) · · accessibility, user-experience
- Vector Animations With Figma and SVG Animate (by/via) · · animations, figma, svg, images
- Top Layer Support in Chrome DevTools (by/via) · · css, dev-tools, user-agents, google, chrome
- Roundup of Recent Document Outline Chatter (by/via) · · html, semantics, accessibility
- Research Insight: Accessibility of Images (by/via) · · accessibility, usability, images, research
- RedwoodJS vs. BlitzJS: The Future of Fullstack JavaScript Meta-Frameworks (by/via) · · frameworks, javascript, comparisons
- Introduction to SvelteKit (by/via) · · videos, introductions, sveltekit
- Front-End Internationalisation Tips (by/via) · · internationalization, fonts, css, javascript
- Escaping the sRGB Prison (by/via) · · videos, colors
- 20 Git Commands Every Developer Should Know (by) · · git, command-line
- Rethinking Device Emulation in Browsers (by) · · user-agents, tooling, usability
- Powerful Image Optimization Tools (by/via) · · link-lists, images, compression, performance, tooling
- Creating an App Using Drag and Drop With React Without Libraries (by) · · react
- Create Complex Transitions With Individual CSS Transform Properties (by/via) · · videos, css, transitions
- An Introduction to Multithreading in Node.js (by/via) · · introductions, nodejs, multithreading
- 15 Common Beginner JavaScript Mistakes (by) · · javascript, mistakes