“2021” Archive
Featured on Frontend Dogma? Confirm and whitelist your domain.
- Page Visibility: If a Tree Falls in the Forest… (by/via) · · performance, web-vitals, user-experience
- Image Magnifier Using Only One Line of CSS (by) · · css, images
- Exposing Mid-Resource LCP Values (by/via) · · performance, web-vitals
- A Unified Theory of Web Performance (by/via) · · performance
- pkg.land (by/via) · · websites, packages, dependencies, npm
- Using Diagnostic Metrics (by/via) · · performance, metrics
- Add Less (by/via) · · simplicity
- WCAG and Accessibility: What Is a Statement of Partial Conformance? (via) · · accessibility, wcag, conformance
- Practical Tips for Load-Testing Web Applications (by/via) · · performance, testing, tips-and-tricks, web-apps
- Empathetic Animation (by/via) · · animations, user-experience
- Shedding Light on Fiverr’s Dark Mode Creation Process (by/via) · · design, dark-mode
- Add a Service Worker to Your Site (by/via) · · web-workers, javascript
- Web Accessibility Cheat Sheet (by) · · accessibility, cheat-sheets
- CSS in 2022 (by/via) · · css
- The Business Case for Performance (by/via) · · performance, economics
- 1000+ Web Development Resources · · link-lists
- Faster Websites by Using Less HTML (by) · · cross-posts, html, performance, optimization, minimalism
- The Many Methods for Using SVG Icons (by) · · css, svg, images, icons
- Redirect Liquidation (by/via) · · performance, optimization, redirecting
- Remember You Are Not the User (by/via) · · accessibility, internationalization, user-experience, principles
- Show, Don’t Tell (by/via) · · writing, design, semantics
- Personalize It! (by/via) · · css, user-experience, personalization
- Form Autocomplete (by) · · html, forms
- Frontend Web Performance: The Essentials · · performance, rendering
- Wrapping Text Inside an SVG Using CSS (by) · · svg, css
- The CSS “:has()” Pseudo-Class, aka Parent Selector (by) · · css, selectors
- CSS Snapshot 2021 (by+/via) · · css, standards
- Introduction to Cognitive Disability and Accessibility Testing (by/via) · · introductions, accessibility, testing
- WebGPU From WebGL (by) · · webgpu, webgl
- The CSS “:has()” Selector Is Way More Than a “Parent Selector” (by/via) · · css, selectors
- Make Joyful Things (by/via) · · user-experience
- CSS Animation (by) · · css, animations
- Building a Greener Web (by/via) · · sustainability
- 13 Tools and Techniques to Accelerate Frontend Development (by/via) · · tooling, techniques, software-design-patterns, linting, bundling, testing, logging, frameworks, processes, ci-cd
- Design Sprints Revisited: Designing With Your Users and Developers (via) · · design, usability
- Why UX Is the Best SEO Strategy (by/via) · · user-experience, seo, strategies
- Auto Dark Theme (by/via) · · browsers, dark-mode, usability
- 5 Common Misconceptions About WAI–ARIA and Accessibility (via) · · accessibility, aria, html
- The Web Starts on Page Four (by) · · web
- Smoothly Reverting CSS Animations (by) · · css, animations
- PHP 8 in a Nutshell (by) · · books, php
- Image Display Elements (by) · · html, images, responsive-design
- How to Define Your Relationship to Sites You Link To (by) · · how-tos, html, links, semantics, seo
- How to Add and Remove a CSS Class From Multiple Elements With Vanilla JavaScript (by) · · how-tos, css, javascript
- Be Prepared for Failure and Handle It Gracefully (by/via) · · javascript, graceful-degradation
- 4 HTML Concepts You Didn’t Know (by) · · html, concepts, tables
- Web Performance, Core Web Vitals, and Vanity Metrics (by/via) · · performance, web-vitals, metrics
- Preference Queries (by) · · css
- This Is WCAG (via) · · websites, accessibility, standards, wcag
- This Is WCAG 2.1 (by) · · websites, accessibility, wcag
- There’s Never Been a Better Time to Build Websites (by) · · frameworks, css
- Web vs. Email Development: The 11 Biggest Coding Differences (via) · · comparisons, email, browsers, support, responsive-design
- Web Platform Design Principles (by/via) · · web-platform, software-design, principles, standards, w3c
- Inaccessibility of CAPTCHA (by+/via) · · accessibility, captcha
- Deep-Copying in JavaScript Using “structuredClone” (by/via) · · javascript
- Why Motion on Websites and Digital Content Is a Problem (by/via) · · accessibility
- Sustaining Maintaining (by) · · foss
- Hands On With the New Responsiveness Metrics (by/via) · · performance, responsive-design, metrics
- Don’t Start With Microservices in Production—Monoliths Are Your Friend (by) · · microservices, monoliths, architecture
- Consistent, Fluidly Scaling Type, and Spacing (by/via) · · typography, css
- 100 Tips on Software Developer Productivity (by) · · productivity, tips-and-tricks
- Thoughts on Skin Tone and Text Descriptions (by) · · accessibility, dei, writing
- The State of CSS 2021 [Results] (by/via) · · surveys, css
- Shifting the Mindset About Accessible Content (via) · · accessibility, content
- Explain Like I’m Five: Web Performance Optimization (by/via) · · performance, optimization
- CSS Custom Properties (by) · · css, custom-properties
- CSS Can Help Improve Your HTML!? Buttons and Links (by) · · html, css, buttons, links, accessibility
- Lessons Learned From Publishing a Content Security Policy (via) · · lessons, csp, security
- Visual Regression Testing for Design Systems With Figma Branches (by) · · design-systems, testing, regressions, figma
- The Ideal Line Length and Line Height in Web Design (by) · · design, typography
- Read Your Website (by/via) · · user-experience
- Practical Ethics for the Modern Web Designer (by/via) · · videos, ethics
- Performance Implications of JavaScript Errors (by/via) · · javascript, performance, errors
- Details/Summary (by) · · html, semantics
- WCAG 2.2: What We Know Till Now (by/via) · · accessibility, wcag
- WCAG 2 Is What We Have (by) · · accessibility, wcag
- Intersection Observer (by) · · javascript, apis
- Embrace the Platform (by/via) · · html, css, javascript, web-platform
- Defer Non-Critical Resources (by/via) · · performance, html
- 5 Key Benefits of Using a Tag Manager (via) · · tag-management
- WCAG 3 Is Not Ready Yet (by) · · accessibility, wcag
- How to Customize Firefox UI—Step-by-Step Tutorial · · how-tos, tutorials, xul, browsers, mozilla, firefox, customization
- Standardizing Focus Styles With CSS Custom Properties (by/via) · · css, custom-properties, accessibility, focus
- Breaking Out of the Box (by/via) · · browsers, css
- WCAG 3 and APCA (by) · · accessibility, wcag, apca, colors, contrast
- The Last Design You’ll Ever Make (by) · · design
- Responsive Iframes With the CSS “aspect-ratio” Property (by) · · css, responsive-design
- Caching: Understanding the Scope (by/via) · · performance, caching
- Redirects for SEO: A Simple (but Complete) Guide (by/via) · · guides, redirecting, seo, http
- 1993: Mosaic Launches and the Web Is Set Free (by/via) · · history, browsers, mosaic
- 5 Reasons You Should Adopt a Micro Frontend Architecture (by/via) · · micro-frontends, architecture
- Writing Better CSS (by) · · css, quality, efficiency
- Node.js Memory Limits—What You Should Know (via) · · nodejs, memory
- Content Separation (by/via) · · servers
- Where Do You Put Spacing on Design System Components? (by) · · design-systems, components, design, spacing
- Explainer for W3C Accessibility Guidelines (WCAG) 3.0 (by+/via) · · accessibility, wcag, standards
- Test Your Product on a Crappy Laptop (by/via) · · testing, performance, usability
- Optimizing State Management in React Applications (by/via) · · react, state-management
- Google Fonts Knowledge (by) · · google, fonts, typography
- Defensive CSS (by) · · css
- A Beginner’s Guide to Vue Router (by/via) · · guides, vuejs
- Why You Should Check in Your Node Dependencies (by) · · nodejs, dependencies
- Reduce Your Website’s Environmental Impact With a Carbon Budget (by/via) · · sustainability
- HTTP Compression (by/via) · · http, protocols, compression, performance
- Designing Better Links for Websites and Emails: A Guideline (by/via) · · design, links, email
- The Love of Curvilinear Design (by/via) · · design
- How Many People With Disabilities Use Our Site? (by) · · accessibility
- Have Core Web Vitals Made the Web Faster? (by/via) · · web-vitals, performance
- CSS Fingerprinting (by) · · websites, css, security, privacy
- Plugging Memory Leaks in Your App (by/via) · · performance, memory
- Revisiting the Anatomy of a Design System (by/via) · · design-systems
- Why Every Developer Should Start Blogging (by) · · blogging, communication, learning, career
- Request for a General Theory of Web Performance (by/via) · · performance
- JSON Modules in JavaScript (by) · · javascript, json, modules
- Ain’t No Party Like a Third Party (by/via) · · dependencies, embed-code, security
- Markup (by/via) · · web-almanac, studies, research, metrics, html
- Best Practices for Node.js Development (by) · · nodejs, javascript, best-practices
- Page Weight (by/via) · · web-almanac, studies, research, metrics, performance
- Security (by+/via) · · web-almanac, studies, research, metrics, security
- HTTP (by/via) · · web-almanac, studies, research, metrics, http, protocols
- JavaScript (by/via) · · web-almanac, studies, research, metrics, javascript
- Accessibility (by+/via) · · web-almanac, studies, research, metrics, accessibility
- CSS (by+/via) · · web-almanac, studies, research, metrics, css
- Why Color Contrast Is Not as Black and White as It Seems (by) · · accessibility, colors, contrast
- Open Props (by) · · websites, css, custom-properties, props
- Understanding Accessibility · · accessibility, testing, tooling
- The Fundamentals of CSS Layout (via) · · videos, fundamentals, css, layout
- New Living Standards (by/via) · · standards, apis
- The Surprising Behavior of “Important CSS Custom Properties” (by) · · css, custom-properties, cascade
- CSS Layout From the Inside Out (by/via) · · videos, css, layout
- The State of UX in 2022: Rebuild (by+/via) · · user-experience, design, visions
- Making Accessibility More Accessible (by) · · accessibility
- Introduction to TCP Connection Establishment for Software Developers (by) · · introductions, protocols, tcp
- Select Elements With “pointer-events: none” by Holding Shift (by/via) · · browsers, dev-tools
- What Is Magento? A Brief Introduction (via) · · introductions, ecommerce, tooling, magento
- Introduction to Svelte Actions (by/via) · · introductions, svelte
- Understanding WCAG 2.1 Level AAA (by/via) · · accessibility, wcag
- What Is WHOIS and How Does It Work? (by/via) · · whois, domains
- On Yak Shaving and “<md-block>”, a New HTML Element for Markdown (by) · · web-components, html, markdown
- How to Maintain a Large Next.js Application (by/via) · · how-tos, nextjs, maintenance
- Programmers Should Stop Celebrating Incompetence (by) · · career
- Make Your Website Stand Out With a Custom Scrollbar (by) · · css
- How to Trim Strings in JavaScript (by) · · how-tos, javascript
- What Kind of Developer Do I Want to Be? (by) · · career
- Three Phases of Life for Design Systems (by) · · design-systems
- Get Started With Validation in Node.js (by) · · nodejs, validation
- Creating Generative Patterns With the CSS Paint API (by/via) · · css, decoration
- 7 Ways to Improve Node.js Performance at Scale (via) · · nodejs, performance, optimization
- A Modern CSS Reset (by) · · css, resetting
- The 6 Ways of Writing HTML (and Their Combinations) (by) · · html
- Modern CSS in a Nutshell (by/via) · · css
- Functional Programming in PHP: Higher-Order Functions (by/via) · · php, programming, functions
- Control Layout in a Multi-Directional Website (by/via) · · internationalization, html, css
- Adding a Dyslexia-Friendly Mode to a Website (by/via) · · accessibility, css
- Blog Page Accessibility Deep Dive (by) · · accessibility, react, deep-dives
- Responsive Layouts, Fewer Media Queries (by/via) · · css, responsive-design
- How JavaScript Engines Achieve Great Performance · · javascript, javascript-engines, performance
- Designing Sustainable Websites (by) · · sustainability, performance, software-design
- Dear HTML Element (by) · · html
- Accessibility Myths (by) · · websites, accessibility, myths
- Communicating Accessibility as Needs to Be Met and Not Rules to Be Followed (via) · · accessibility, communication
- Introduction to Web Sockets (via) · · introductions, apis, protocols, websockets
- Tales of the Autistic Developer—Order and Chaos (by) · · career
- Parallax Powered by CSS Custom Properties (by/via) · · css, custom-properties
- How to Make Blob Menu Using HTML, CSS and JavaScript (by) · · how-tos, html, css, javascript
- 20 Years of bram.us (by/via) · · history
- Let’s Not Send Developers to the Accessibility Tree Tool (by) · · browsers, accessibility, tooling
- Various Ways to Include Comments on Your Static Site (by) · · functionality
- PHP Date and Time Recipes (by/via) · · php
- Dynamic Color Manipulation With CSS Relative Colors (by) · · css, colors
- 1992: The Web vs. Gopher, and the First External Browsers (by/via) · · history
- Performance (by/via) · · web-almanac, studies, research, metrics, performance, user-experience
- Tor and the Humans Who Use It (via) · · community, privacy, tor-browser, browsers
- WCAG 3.0: What You Need to Know About the Future of Accessibility Standards (via) · · accessibility, wcag, standards
- Three Principles to Better Present Your UI Designs (by/via) · · design, principles
- How to Create Reusable Components With the Vue 3 Composition API (by/via) · · how-tos, vuejs, components
- A Guide to Modern CSS Colors With RGB, HSL, HWL, LAB, and LCH (by/via) · · guides, css, colors
- Using “position: sticky” With CSS Grid (by) · · css, grids, positioning, layout
- A Clever Sticky Footer Technique (by/via) · · css, layout, navigation
- We Need to Talk About Accessibility—Again, and Again, and Then Some More (by) · · accessibility
- Reframing Tech Debt (by/via) · · technical-debt
- Generate a Pull Request of Static Content With a Simple HTML Form (by/via) · · html, github
- Design System Best Practices With ESLint Series (by/via) · · design-systems, design-tokens, best-practices, tooling, eslint
- A Primer on Product Management for Engineers (by/via) · · introductions, product-management
- 4 Ways to Document Your Design System With Storybook (by/via) · · design-systems, storybook, documentation
- GitHub’s Commitment to npm Ecosystem Security (by/via) · · github, npm, security
- Your CSS Is an Interface (by) · · css, performance
- Some Notes on Using esbuild (by) · · bundling, esbuild
- Get Your “Head” Straight (by/via) · · videos, html, performance
- Semantics and How to Get Them Right (by/via) · · videos, html, semantics, accessibility
- Why IndexedDB Is Slow and What to Use Instead (via) · · databases, indexeddb, javascript, performance
- How to Fetch Data in Svelte (by/via) · · how-tos, svelte, data-fetching
- Access to Tech, Tech to Live (by/via) · · videos, accessibility
- 5 Popular Frontend Development Tools in 2021 (by) · · tooling
- Chrome DevTools: Copy CSS Styles as JavaScript-Compatible Properties (by) · · dev-tools, css, javascript, browsers, google, chrome
- Using Web Workers to Boost Third-Party Script Performance (by/via) · · web-workers, javascript, performance
- Why Your Website Should Not Use Dithered Images (via) · · images, dithering, compression, performance
- Useful React Hooks That You Can Use in Your Projects (by/via) · · react, hooks
- Other Looks at the Conditional Border Radius Trick (by/via) · · css, borders, tips-and-tricks
- How to Debounce and Throttle Callbacks in Vue (by) · · how-tos, vuejs, javascript, callbacks, debouncing, throttling
- Design Systems, Structured Content, and Headless Publishing (by) · · design-systems, content, semantics, headless
- View-Source (by) · · auditing, browsers
- It’s Not About Your Favorite Color—Moving From Brand Strategy to Visual Identity (by/via) · · design, branding, strategies
- Easy Dark Mode (and Multiple Color Themes) in React (via) · · react, dark-mode, theming
- Browsing With Screen Magnification (by/via) · · accessibility, browsing, assistive-tech, screen-magnification
- Everything You Ever Wanted to Know About the Accessibility Tree (by/via) · · videos, accessibility
- A Beginner’s Guide to Routing in Next.js, With Examples (by/via) · · guides, nextjs, routing
- Be Usable, Not Consistent, Not Uniform (by/via) · · design, usability
- Localizing Your Next.js App (by/via) · · nextjs, localization, javascript
- How Designers Can Prevent User Errors (via) · · design, usability, errors
- Detecting Specific Text Input With HTML and CSS (by/via) · · html, css
- Debugging HTML: Accessibility (by/via) · · html, accessibility, debugging
- Why You Should Prioritise Quality Over Speed in Design Systems (by) · · design-systems, prioritization
- Designing a Reorderable List Component (by) · · software-design, components, html, css
- Becoming an Expert (by) · · learning, career, processes, craft
- PHP 8.1 in 8 Code Blocks (by) · · php
- In Defence of Dialog (by) · · html, modals
- Deep Dive Into Node.js Architecture (by) · · nodejs, architecture, deep-dives
- Chrome DevTools: Record and Playback Your User Journeys (by) · · dev-tools, user-experience, performance, browsers, google, chrome
- RenderingNG: The Next-Generation Rendering Architecture for Chrome (by/via) · · videos, browsers, google, chrome, browser-engines, chromium, rendering
- Everything You Have to Know About Core Web Vitals (by/via) · · web-vitals, performance
- The Key to Developer Happiness and How to Prevent Coding From Becoming Just Another Job (by) · · how-tos, career
- How to Implement Memoization in React to Improve Performance (via) · · how-tos, react, performance, memoization, optimization
- Browser Wars (by/via) · · history, browsers, browser-wars
- Learn PWA (by/via) · · courses, web-apps, progressive-web-apps
- Design Is Not Art, and UX Is Not Design (by/via) · · design, user-experience
- A Deep Dive Into Serverless UI With TypeScript (by/via) · · typescript, serverless, deep-dives
- What Is Wireless Application Protocol (WAP)? (via) · · wap, mobile
- Understanding the Differences Between WCAG 2.1 and WCAG 2.2 (via) · · accessibility, wcag, comparisons
- Learn Forms (by/via) · · courses, forms, html
- Designing Error Messages and a Logging Strategy in Node.js (by/via) · · software-design, javascript, nodejs, logging, strategies
- Building Real-Life Components: Facebook Messenger’s Chat Bubble (by) · · components, html, css
- Name, Labels, ARIA, What to Do? (by) · · accessibility, forms, labels, writing, naming
- Using AI and Data Science to Reliably Detect Internet Censorship in Real Time (via) · · ai, traffic, censorship
- What Does a Good Design System Feel Like? (by) · · design-systems, user-experience
- What Are Accessible Fonts? (via) · · accessibility, fonts
- The State of the Web (by/via) · · videos, web
- Rebase vs. Merge: Integrating Changes in Git (by/via) · · git, comparisons
- An Introduction to PostCSS (by/via) · · introductions, postcss, postprocessors, tooling
- Developer Tools Secrets That Shouldn’t Be Secrets (by) · · browsers, tooling, developer-experience
- The Guideline Gap (by) · · design-systems, quality, accessibility, localization
- Accessible Toggles (by/via) · · accessibility, toggles, html, javascript
- So, You Want to Build an “@ mention” Autocomplete Feature? (by/via) · · functionality
- A Comprehensive Guide to Error Handling in Node.js (by/via) · · guides, nodejs, javascript, errors
- CSS-ing Candy Ghost Buttons (by/via) · · css
- The Golden Ratio and User-Interface Design (via) · · design
- HTMLoween—HTML, JS, and CSS to Make Your Blood Boil (by) · · html, css, javascript
- You Probably Don’t Need Media Queries Anymore (by) · · css, media-queries
- Chrome DevTools: Visualise Your JavaScript Bundles (by) · · dev-tools, javascript, bundling, browsers, google, chrome, lighthouse, visualization
- The Little Book of Little Books (by) · · books, frameworks, conventions, quality