“2021” Archive (3)
Featured on Frontend Dogma? Confirm and whitelist your domain.
- Compound Components in React (by/via) · · react, components
- CSS Object Model (CSSOM) (by+/via) · · css, cssom
- Why Are Hyperlinks Blue? (via) · · design, links
- Small Wins for Accessibility and Resilience (by) · · accessibility, resilience, html
- Named and Framed (by) · · accessibility, html
- How to Use “Promise.any()” (by) · · how-tos, javascript, promises
- Getting Started With CSS Animations (via) · · css, animations, introductions
- Flexbox or CSS Grid? How to Make Layout Decisions That Make Sense (by/via) · · how-tos, css, flexbox, grids, layout, comparisons
- jsc: My New Best Friend (by) · · javascript, tooling
- Embracing Asymmetrical Design and Overcoming the Harmful Effects of “text-overflow: ellipsis” in CSS (by) · · design, css
- Key Data Structures and Their Roles in RenderingNG (by+/via) · · browsers, browser-engines, chromium, google, rendering, data-structures
- Scrollbar Reflowing (by/via) · · scrolling, reflow, user-experience
- React JS—the Confusing Parts (by/via) · · react, jsx
- 8 Fundamental Principles of Effective Web Design (by) · · principles
- Using Objectives and Key Results to Inform UX Design (by/via) · · interviews, user-experience, design, okr, strategies, processes
- An Introduction to Semantic Versioning (by) · · introductions, semver, versioning
- HTTP/3: Performance Improvements (by/via) · · http, protocols, performance
- 5 Ways to Undo Mistakes With Git (by/via) · · git, command-line, mistakes
- 4 Important Differences Between Regular and Arrow Functions (by) · · javascript, functions, comparisons
- Using the Platform (by) · · web-platform
- How I Experience Web Today · · websites, web
- 6 CSS Shorthand Properties to Improve Your Web Application (by) · · css, shorthands, optimization
- Bootstrapping a Node.js TypeScript API: Routing, Middleware, and Custom Types and Errors Modules (by/via) · · nodejs, typescript, apis, routing, errors, modules
- Accessibility From the Ground Up (by) · · accessibility
- UI Cheat Sheet: Spacing Friendships (by/via) · · design, spacing, cheat-sheets
- What’s on the Menu? (by) · · vuejs, accessibility
- I Give You Feedback on Your Blog Post Draft but You Don’t Send It to Me (by) · · writing, blogging
- How to Set Up an AWS S3 Static SSL Website (by/via) · · how-tos, aws, ssl
- How to Calculate REMs From Pixels (by) · · how-tos, css
- Truthy and Falsy: When All Is Not Equal in JavaScript (by/via) · · javascript
- I Tried Angular as a React Developer: Here Are 6 Things I Like About It (by/via) · · angular, react, comparisons
- Web Accessibility Checklist · · websites, accessibility, checklists
- Top 9 Lessons Learned in 12 Years as a Software Developer (by) · · lessons, career
- Release Notes for Safari Technology Preview 130 (by/via) · · release-notes, safari, apple, browsers
- One Favicon to Rule Them All (by) · · html, images, favicons
- Building the Same App 5 Times · · comparisons, jquery, angular, react, vuejs, svelte
- Level Up Your CSS Linting Using Stylelint (via) · · css, consistency, linting, stylelint
- What’s New in Bootstrap 5 (by/via) · · frameworks, bootstrap
- Using CSS Module Scripts to Import Stylesheets (by/via) · · css, javascript, modules
- State Management in Svelte Applications (by/via) · · state-management, svelte
- ARIA Spec for the Uninitiated (by/via) · · html, accessibility, aria
- CSS Grid Tooling in DevTools (by/via) · · dev-tools, css, grids, layout, browsers, google, chrome
- You Don’t Know “useEffect” · · react
- Practical Uses of CSS Math Functions: “calc”, “clamp”, “min”, “max” (by) · · css, math, functions
- Does Shadow DOM Improve Style Performance? (by) · · dom, shadow-dom, performance, rendering
- Reviewing a Design for Accessibility (via) · · accessibility, code-reviews, user-experience
- A Guide to Designing Accessible, WCAG-Compliant Focus Indicators (by) · · guides, accessibility, focus, wcag, compliance
- Decoding AVIF: Deep Dive With Cats and imgproxy (by+/via) · · images, avif, deep-dives
- Big O, Code Efficiency Analysis (by) · · algorithms, performance
- Breaking the Web Forward (by) · · web, browsers
- Ghost.org Complete Tutorial—Turn Your Blog Into a Subscription Business · · videos, tutorials, ghost, blogging, monetization
- Static vs. Dynamic vs. Jamstack: Where’s the Line? (by/via) · · comparisons, tooling, tech-stacks, jamstack
- How to Test for Accessibility With Users at Every Design Stage (by/via) · · how-tos, accessibility, testing
- CSS “accent-color” (by+/via) · · css, forms
- Accessible Design Systems: Look Good While Doing Good (by/via) · · design-systems, accessibility
- The Complete Guide to HTML Forms and Constraint Validation (by/via) · · guides, html, forms, validation
- “<Lazy>” Rendering in Vue to Improve Performance (by) · · vuejs, client-side-rendering, performance, optimization
- The State of Mobile First and Desktop First (by) · · responsive-design, mobile-first, mobile, desktop
- “return await promise” vs. “return promise” in JavaScript (by) · · javascript, promises, comparisons
- Principles by Design (by/via) · · design, principles
- Adding 100 Underline/Overlay Animations: The Impressive CSS Collection (by) · · css, animations
- Accessible Contrast Ratios and A-Levels Explained (via) · · accessibility, colors, contrast
- The World of CSS Transforms (by) · · css
- JavaScript Development: Making a Web Worker Optional (by/via) · · javascript, web-workers
- HTTP/3 From A to Z: Core Concepts (by/via) · · http, protocols, concepts
- How Writing Can Advance Your Career as a Developer (by/via) · · career, writing
- Google vs. the Web (by) · · google, web
- Exploring the CSS Paint API: Image Fragmentation Effect (by/via) · · css, apis, images, effects
- A Performance-Focused Workflow Based on Google Tools (by/via) · · performance, web-vitals, tooling, google
- Uploading Multiple Files With Fetch (by) · · javascript, file-handling, data-fetching
- Next-Level List Bullets With CSS “::marker” (by/via) · · css, selectors
- Pixelart and the “image-rendering” Paradox (by) · · css, images, art
- Browsers and Representation (by) · · browsers
- Modular Code With Nunjucks and Eleventy (by) · · nunjucks, eleventy, examples
- 30 Years on From Introducing the Web to the World (by/via) · · web, history, anniversaries
- On the “<dl>” (by) · · html
- Sustainable Web Design, an Excerpt (via) · · sustainability
- Why Are We Talking So Much About Design Leadership? (by/via) · · design, leadership
- Visualizing a Codebase (by/via) · · tooling, developer-experience, visualization
- Inclusive Usability Testing: The Benefits of Inclusive Design (via) · · usability, testing, dei
- A Guide to Accessible Digital UX Design (via) · · guides, accessibility, user-experience, design
- What Are Accessibility Overlays Good For? (by/via) · · accessibility, overlays
- Writing Great Alt Text: Emotion Matters (by) · · accessibility, writing, alt-text, user-experience
- Using CSS Shapes for Interesting User Controls and Navigation (by/via) · · css, shapes, navigation
- Refresher on JavaScript Callbacks and Promises (by/via) · · javascript, callbacks, promises
- React Children and Iteration Methods (by/via) · · react
- CSS Nesting, Specificity, and You (by) · · css, selectors, cascade, nesting
- Accessibility Testing With Storybook (by/via) · · accessibility, testing, storybook
- A Deep Dive on Skipping to Content (by/via) · · accessibility, skip-links, deep-dives
- Using localStorage With React Hooks (by/via) · · storage, react, hooks
- What Devs Need (by) · · websites, tooling, link-lists
- Web Accessibility Myths: Debunking 7 Common Misconceptions (by/via) · · accessibility, myths
- npm Security Best Practices (by/via) · · npm, security, best-practices
- Introduction to TCP: Transmission Control Protocol (via) · · introductions, protocols, tcp
- How to Use “Promise.allSettled()” (by) · · how-tos, javascript, promises
- How to Build Resilient JavaScript UIs (by/via) · · how-tos, javascript, user-experience, resilience
- Building the Perfect GitHub CI Workflow for Your Frontend Team (by) · · github, ci-cd
- The Importance of UX Writing (via) · · user-experience, writing, user-conversion
- Balancing UX Design and Conversion-Rate Optimization (via) · · user-experience, design, user-conversion, optimization
- Mitigating User Errors (by/via) · · user-experience, errors
- The (Most Comprehensive) JavaScript Design Principles Guide (by) · · guides, software-design, javascript, principles
- Refactoring CSS: Strategy, Regression Testing, and Maintenance (by/via) · · css, maintenance, refactoring, testing, regressions, strategies
- How We Reduced Next.js Page Size by 3.5× and Achieved a 98 Lighthouse Score (via) · · performance, nextjs, lighthouse, google, case-studies
- 2021 Scroll Survey Report (by+/via) · · surveys, css, scrolling
- Why It’s Okay for Web Components to Use Frameworks (by) · · frameworks, web-components
- Chrome DevTools: Better Accessibility Inspection With the Source Order Viewer (by) · · dev-tools, accessibility, debugging, browsers, google, chrome
- Avoid the Most Common 18 Mistakes to Make Your UI/UX Design Better (by) · · design, user-experience, mistakes
- 101 Digital Accessibility Tips and Tricks (by) · · accessibility, tips-and-tricks
- Optimizing Your Own Performance as a Designer (by/via) · · design, career
- There Is No Such Thing as a CSS Absolute Unit (by/via) · · css, units
- How to Stay Focused as a Self-Taught Frontend Web Developer (by) · · how-tos, career, learning, productivity
- CSS Architecture and Performance in Micro Frontends (by/via) · · css, architecture, performance, micro-frontends
- Best Practices for Tags and Tag Managers (by/via) · · tag-management, web-vitals, best-practices
- 5 Git Tips to Level Up Your Workflow (by/via) · · git, tips-and-tricks, command-line
- Creating an Accessible Dialog From Scratch (by/via) · · accessibility, modals
- Safari Isn’t Protecting the Web, It’s Killing It (by/via) · · browsers, apple, safari, web
- Using Absolute Value, Sign, Rounding, and Modulo in CSS Today (by/via) · · css
- How to Hand Off Accessible Designs to Developers? (via) · · how-tos, accessibility, processes
- Learnings From a WebPageTest Session on CSS-Tricks (by/via) · · performance
- Architecting and Scaffolding a TypeScript and Express API (by/via) · · typescript, express, apis
- Is It Time to Ditch the Design Grid? (by/via) · · design, layout, grids
- When You Cannot Run Away From Using Tables on Mobile (by/via) · · layout, user-experience, tables, mobile
- Webhooks Tutorial: The Beginner’s Guide to Working With Webhooks (by/via) · · tutorials, guides, webhooks
- A Beginner’s Guide to Lighthouse (by/via) · · guides, lighthouse, google, performance, web-vitals
- Thinking About the Cut-Out Effect: CSS or SVG? (by) · · css, svg, techniques, effects, comparisons
- Global vs. Local Styling in Next.js (by/via) · · css, nextjs, comparisons
- CSS Logical Properties and Values (by/via) · · css, logical-properties
- Overview of the RenderingNG Architecture (by/via) · · overviews, browsers, browser-engines, chromium, google, rendering
- What Is SEM Positioning? Definition, Advantages, and Characteristics (via) · · sem, concepts
- UX Principles That Include Cognitive Accessibility (by) · · accessibility, user-experience, principles
- Takeaways From the 2021 State of Digital Accessibility Report (by/via) · · surveys, accessibility
- My First CSS—What I Wish I Knew About CSS When Starting Out as a Frontender (by/via) · · css, layout
- Getting Started With React “useContext” Hook and React Context (by) · · react, hooks, introductions
- Accessible Design From the Get-Go (by/via) · · accessibility
- Complete Introduction to CSS Flexbox (by) · · introductions, css, flexbox, layout
- It Is Time to Ditch the Title “Evangelist” From Accessibility (by/via) · · accessibility
- You Don’t Need React for Building Websites (by) · · react
- Four Factors in UX Maturity (by+/via) · · user-experience
- Break HTML Content Into Newspaper-Like Columns Using Pure CSS (by) · · css, layout
- 5 UI Tips to Become a Better Front-End Developer (by) · · design, colors, tips-and-tricks
- 12 Python Tips and Tricks You Must Know (by) · · python, tips-and-tricks
- How to Eliminate Render-Blocking Resources: A Deep Dive (by) · · how-tos, performance, rendering
- Accessibility Strategy for Product Management (by/via) · · accessibility, strategies, product-management
- The Vanishing Designer (by/via) · · design, career
- What We Learned About Accessibility by Scanning More Than 2 Million Federal .gov Web Pages (via) · · accessibility
- Using Google Drive as a CMS (via) · · content-management, google
- Custom Properties and “@ property” (by) · · css, custom-properties
- What to Know About AVIF on Cloudinary (by) · · avif, images
- Why the WCAG Colour Contrast Ratio Doesn’t Always Seem to Work (by) · · accessibility, wcag, colors, contrast
- Simple Monorepos via npm Workspaces and TypeScript Project References (by) · · monorepos, npm, typescript
- Faster Git Checkouts on NFS and SSD With Parallelism · · git
- Definition of Done vs. Acceptance Criteria (by) · · agile, scrum, processes, comparisons
- The Accessibility Stalemate (by) · · accessibility
- From a Colourblind Designer to the World: Please Stop Using Red and Green Together (via) · · accessibility, colors
- A Visual Guide to React Rendering—It Always Re-Renders (by) · · guides, react
- The Future of UX Design (by/via) · · interviews, visions, user-experience, design
- An Introduction to Frameworkless Web Components (by/via) · · introductions, web-components, javascript, dom
- Journey of a Web Page—How Browsers Work (by) · · browsers, concepts
- The Ultimate Cheat Sheet List for Web Developers (by) · · html, css, javascript, cheat-sheets
- Practical Use Cases for Scroll-Linked Animations in CSS With Scroll Timelines (by/via) · · css, animations
- Maintaining End-to-End Quality With Visual Testing (by/via) · · testing, quality, design
- 6 Useful Frontend Techniques That You May Not Know About (by) · · html, css, javascript, techniques
- Designing for Information Density (by/via) · · design
- Why Has User Experience Design Become Legal Experience Design? (by) · · accessibility, user-experience, legal
- Magento Tips and Tricks · · magento, tips-and-tricks, seo
- What I Learned From “Software Engineering at Google” (by) · · google, lessons
- The State of Developer Ecosystem 2021 (via) · · surveys
- Accessibility of the “Section” Element (by) · · accessibility, html
- Designing for the Unexpected (by/via) · · design, html, css
- Hobson’s Browser—How Apple, Facebook, and Google Broke the Mobile Browser Market by Silently Undermining User Choice (by) · · browsers, mobile, user-experience, apple, facebook+meta, google
- For Developers, Apple’s Safari Is Crap and Outdated (by) · · browsers, apple, safari
- There’s No Such Thing as Fully Automated Web Accessibility (by/via) · · accessibility, automation
- What Is Tree Shaking? (by) · · javascript, concepts, tree-shaking
- The Performance Effects of Too Much Lazy-Loading (by+/via) · · performance, web-vitals, lazy-loading
- How to Get a Pixel-Perfect, Linearly Scaled UI (by/via) · · how-tos, css, preprocessors, layout
- Content Accessibility Fact Sheet (via) · · content, accessibility
- The Ultimate Guide to Browser-Side Storage (by/via) · · guides, browsers, storage, javascript
- What’s the Difference Between the Alignment Values of “start”, “flex-start”, and “self-start”? (by) · · css, flexbox, alignment
- An Unreasonably Long Introduction to ARIA (With Example Implementation) (by) · · introductions, accessibility, aria, live-regions, examples
- The Most Important Lessons I’ve Learned From Senior Software Engineers (via) · · lessons, career
- The 3-Second Frontend Developer Test (by) · · html, css, conformance, quality
- I’m Changing How I Review Code (by) · · code-reviews, quality
- HTTP Status Codes That You Must Know (by) · · http, protocols
- Build Complex CSS Transitions Using Custom Properties and “cubic-bezier()” (by/via) · · css, transitions, custom-properties, complexity
- Angular Is Costing Companies Billions (by/via) · · angular
- How to Migrate From jQuery to Next.js (by/via) · · how-tos, migrating, jquery, nextjs
- Detecting Media Query Support in CSS and JavaScript (by) · · css, javascript, media-queries, support
- What People Should Know Before Writing Articles or Creating Products About Accessibility (by) · · accessibility, writing
- TypeScript Interfaces: A Quick Guide to Help You Get Started (by) · · guides, typescript
- Refactoring CSS: Introduction (by/via) · · introductions, css, maintenance, refactoring
- Gridless Design (by) · · websites, design, layout
- Image Descriptions: A Human Technique That Robots Can’t Grasp (by/via) · · accessibility, images, alt-text
- How to Convert Arrays to Human-Readable Lists in JavaScript (by) · · how-tos, javascript, conversion, arrays
- Freelance React Developer Checklist (by) · · react, checklists
- The Document Outline (by/via) · · html, accessibility
- Making a Strong Case for Accessibility (by/via) · · accessibility
- The Numeric Colour Palettes in Modern Web Frameworks Explained (by) · · colors, color-palettes, frameworks
- The Large, Small, and Dynamic Viewports (by/via) · · layout, responsive-design, css
- Performance Design: The Illusion of Speed · · performance, user-experience
- Creating Accessible CSS Art (by) · · css, accessibility, art
- ARIA in HTML (by) · · accessibility, aria, html
- TypeScript and Native ESM on Node.js (by) · · typescript, esm, nodejs
- Five Ways to Include D/Deaf Users in Your Designs (by/via) · · accessibility, design
- A Quick Introduction to Handlebars (via) · · introductions, handlebars
- Build a Website With React and Tailwind CSS (by/via) · · react, tailwind
- The Dilemma of Naming Font Size Variables (via) · · css, preprocessors, custom-properties
- The Anatomy of a Web Page: 14 Basic Elements (by/via) · · design-patterns, navigation, buttons, forms, multimedia, favicons, images, link-lists
- How to Use “Promise.all()” (by) · · how-tos, javascript, promises
- How Does Node.js Load Its Built-In/Native Modules? (by) · · javascript, nodejs, modules
- Accessibility and Inclusivity: Distinctions in Experience Design (by/via) · · accessibility, dei, user-experience
- Using HSL Colors in CSS (by/via) · · css, colors
- Where Did This Interaction Come From?—A Brief History of Interaction Design (by/via) · · history, interaction-design
- Feature Checklists Are Not Enough: How to Avoid Making Bad Software (by/via) · · how-tos, usability, design, checklists
- Basics of JavaScript Test Driven Development (TDD) With Jest (by) · · fundamentals, javascript, testing, jest
- “export default thing” Is Different to “export { thing as default }” (by) · · javascript
- Short Note on Skip Links With Sticky Headers (by) · · accessibility, skip-links, css
- Evaluating Color and Contrast—How Hard Can It Be? (by/via) · · accessibility, colors, contrast
- Towards Richer Colors on the Web (by) · · design, colors
- It’s a (Front-End Testing) Trap! Six Common Testing Pitfalls and How to Solve Them (by/via) · · testing, quality
- Accessibility and SEO (by/via) · · accessibility, seo, html
- Colorblind Accessibility Manifesto (by) · · websites, manifestos, accessibility, colors, color-blindness, guidelines
- 10 Figma Best Practices to 10× Your Workflow (by/via) · · design, figma, productivity, best-practices
- 5 Hidden Mistakes That Can Ruin a Developer’s Career (via) · · career, mistakes
- The State of Web Workers in 2021 (by/via) · · javascript, web-workers
- When a Click Is Not Just a Click (via) · · javascript
- The Internet Is Rotting (by/via) · · link-rot, web
- How We Built React Components for Any Front End (via) · · react, components, case-studies
- Encoding Data for POST Requests (by) · · javascript, security, encoding
- Detecting Hover-Capable Devices (by/via) · · css
- 9 Tips to Help You Ace a Whiteboard Interview (via) · · interviewing, career, tips-and-tricks
- Introducing GitHub Copilot: Your AI Pair Programmer (by/via) · · introductions, github, ai, tooling
- Use the “i” Element, and Use It Appropriately (by) · · html, semantics
- Screen Readers: Hearing the Unseen (by/via) · · accessibility, screen-readers, assistive-tech
- Resource Inlining in JavaScript Frameworks (by/via) · · javascript, frameworks, performance, web-vitals
- Tip: Don’t Preprocess What You Can Design Token (by/via) · · css, preprocessors, design-tokens
- The Most Popular Design Thinking Strategy Is BS (by/via) · · design, strategies
- Good News: Google No Longer Requires Publishers to Use the AMP Format (via) · · amp, web-vitals, google
- CSS Frameworks in Vogue, but Don’t Forget Style Fundamentals (by/via) · · css, frameworks, fundamentals, quality
- My Journey From a Novice to a Front-End Engineer (by) · · career
- I Regret Being a Hipster in Tech (by) · · career
- All You Need Is 5 Fonts (by/via) · · design, typography, fonts
- JavaScript Frameworks and the Lost Art of HTML (by/via) · · javascript, html, frameworks
- Building a Responsive Layout With CSS Grid and Container Queries (by/via) · · videos, css, grids, layout, responsive-design, container-queries
- Using CSS to Enforce Accessibility (by) · · accessibility, css
- Debugging JavaScript and Front-End (by/via) · · videos, javascript, debugging
- Container Queries and the Future of CSS (by/via) · · videos, css, container-queries
- No Code Reviews by Default (by/via) · · code-reviews
- Making the Web—Faster (by) · · web, performance, developer-experience, principles
- Beyond Basic Alt Text—Charts, Maps, and Diagrams (by/via) · · accessibility, alt-text, images, information-design
- Accessibility in React (by) · · accessibility, react