News and Tools for Frontend Development (20)
(Stay up-to-date on all topics by RSS feed or on Mastodon.)
- Lesser-Known and Underused CSS Features in 2022 · · css
- A Guide to Writing Industry Standard Git Commit Messages · · guides, git, conventions
- Dialog Components: Go Native HTML or Roll Your Own? · · modals, components, accessibility
- Accessibility from Different Perspectives · · accessibility
- The Balance Has Shifted Away from SPAs · · spas
- First Look at the CSS “object-view-box” Property · · css
- Triaging WCAG 2.1 Level AAA · · accessibility, wcag, standards
- Fun With CSS Combinators · · css, selectors
- Accessibility Not-Checklist · · websites, accessibility, checklists
- Let’s Make Accessibility Boring Again · · accessibility
- Patterns · · design-patterns, aria, best-practices
- React Accessibility Resources · · react, accessibility, link-lists
- The Importance of Organizational Leadership in Developing an Accessibility Culture: Buy-In, Metrics, and Structure · · interviews, accessibility, leadership, culture, metrics
- Thinking Colors: Balancing Between Visual and Abstract · · colors
- What We Can Learn from Remix · · remix, frameworks
- Web Accessibility Is Broken—It’s Time to Fix It · · videos, accessibility
- Automate Accessibility Tests With Storybook · · accessibility, testing, automation, storybook
- 4 Web Accessibility Remediation Mistakes to Avoid · · accessibility, mistakes
- React Hooks Best Practices in 2022 · · react, hooks
- Web Development === Accessibility · · accessibility
- Use “@ supports” At-Rule for Feature Detection in CSS · · videos, css, feature-detection, support
- Quick and Dirty Text Diffing · · tooling
- The Rise and Fall of Neumorphism · · design
- Conditionally Loading CSS or Any Resource Using Media Queries · · html, media-queries, performance
- How to Ask for a Promotion · · how-tos, career
- Building a Button Component · · components, html, css, javascript, buttons
- RFC 9239: Updates to ECMAScript Media Types · · javascript, mime-types
- How the HTML “lang” Attribute Helps Accessibility · · accessibility, html, localization
- Reduce Array of Objects to an Object in JavaScript · · javascript, arrays, objects
- The Forgotten Benefits of “Low Tech” User Interfaces · · usability
- The Modern Way to Create and Host a WordPress Site · · content-management, wordpress, hosting
- WCAG 2.2 and WCAG 3 Status Updates · · accessibility, wcag, standards
- UI and UX Micro-Tips · · user-experience, forms, tips-and-tricks
- 24×24 Pixel Cursor Bookmarklet · · accessibility, wcag, testing, bookmarklets
- 9 Ways to Design Inclusive Content · · content, inclusion
- An Affordable Work-from-Home Setup for Remote Workers · · productivity
- Color Alignment for Multiple Design Systems · · design-systems, colors
- Peering into the Accessibility of Dark Mode · · accessibility, dark-mode
- Rethinking Server-Timing as a Critical Monitoring Tool · · performance, http, metrics, monitoring
- The Era of Rebellious Web Design Is Here · · design
- Unexpectedly HTTPS? · · http, security
- Unpack Arrays Conditionally in PHP · · php, arrays
- Web Applications 101 · · web-apps, concepts
- Building a Design System With Eleventy · · design-systems, eleventy
- Quick Tip: You Might Not Need “calc()” · · css, tips-and-tricks
- :where() :is() :has()? New CSS Selectors That Make Your Life Easier · · css, selectors
- More Common Accessibility Issues That You Can Fix Today · · accessibility
- Personas vs. Archetypes · · usability, user-experience, personas, testing, comparisons
- Keyboard Testing: The A11y Enhancement to Your Definition of Done · · accessibility, keyboard-navigation, testing
- Call to Action Examples · · websites, writing, buttons, examples
- A Designer’s Journey of Ignorance, Resentment, and Wisdom · · design
- Does Javascript Make My Site Less Accessible? · · accessibility, javascript, wcag
- Master the “:nth-child()” Pseudo-Class · · videos, css, selectors
- Don’t Fight the Browser Preload Scanner · · user-agents, html, parsing, performance
- Cool Hover Effects That Use CSS Text Shadow · · css, effects
- Tokens as Intents · · design-tokens, naming, typography
- W3C TAG Ethical Web Principles · · ethics, principles, w3c
- Bringing Page Transitions to the Web · · videos, css, transitions
- Debugging Accessibility With Chrome DevTools · · videos, dev-tools, accessibility, debugging, user-agents, google, chrome
- Light and Dark Mode in Just 14 Lines of CSS · · css, dark-mode
- How to Use Google CrUX to Analyze and Compare the Performance of JS Frameworks · · how-tos, performance, metrics, javascript, frameworks
- Designing for Web Accessibility in 60 Seconds · · accessibility
- Divs Are Bad! · · html, semantics
- On Design Thinking · · design
- Why WCAG 2.2 Is Still in the Oven · · accessibility, wcag
- Bridging the Gap · · css, support
- XHTML Syntax Is Still Worth Using · · html
- State of CSS 2022 · · css
- How to Learn JavaScript Fast: Six Simple Mind Tricks · · how-tos, javascript, tips-and-tricks, learning
- Cron Jobs: A Comprehensive Guide · · guides, cron, automation
- Magical SVG Techniques · · svg, images, techniques
- Under the Hood: React vs. Vue vs. Svelte · · frameworks, react, vuejs, svelte, comparisons
- Two Approaches to Accessibility on the Web · · accessibility, automation
- You Don’t Need “void 0” · · javascript
- The Complete Modern React Developer 2022 · · react
- A Different View into Accessibility Overlays · · accessibility, overlays, testing, documentation, auditing
- A Management Maturity Model for Performance · · performance
- Frontend Versus Backend Web Development · · comparisons
- Learn HTML [and] CSS · · courses, html, css
- Performance Game Changer: Browser Back/Forward Cache · · user-agents, caching, performance, web-vitals
- “Someone Should Build X for the Web”—Why Not You? · · github
- The Road to Universal JavaScript · · javascript
- Understanding User Behaviors Across Surfaces · · usability
- Why SEO Is a Great Investment, Not Just a Cost · · seo, economics
- Reinventing W3C Governance · · standards, w3c
- My Opinion on What Makes a Good Code Review · · code-reviews, productivity
- What’s Your Heading? · · accessibility, html, headings, semantics
- Scaling CSS Layout Beyond Pixels · · videos, css, layout
- Learn CSS Subgrid · · css, design
- How to Use the GitHub Pulls API to Manage Pull Requests · · how-tos, github, apis
- Top 2021 CSS Frameworks Report: Validation · · studies, research, frameworks, css, conformance, quality
- A Guide to Writing About Digital Accessibility · · guides, writing, accessibility
- Get to Know Your Browser’s Performance Profiler · · user-agents, tooling, performance
- Please, Stop Disabling Zoom · · accessibility, html
- Practical Use Cases for “:has()” Pseudo-Class · · videos, css, selectors
- Resilience, Flexibility, and Immediacy: Working With Headless Systems · · headless, principles
- 12 Modern CSS Techniques for Older CSS Problems · · css, techniques, optimization
- Fetch API Is [the] New Old Version of AJAX · · javascript, data-fetching, apis
- Master Higher-Order Functions in JavaScript · · javascript, functions
- How to Use Videos With Alpha Transparency on the Web · · how-tos, html, effects
- Developing a Low-Touch Adoption Strategy for a New Design System · · user-experience, design-systems
- How Not to Do Accessible Design · · accessibility, design, colors
- JavaScript Containers · · javascript, visions
- The Evolution of WCAG: A Postcard from the Front Lines · · accessibility, wcag, standards, history
- Designing a Better Language Selector · · design, usability, internationalization, localization
- Design Patterns: How to Create Simple Interfaces · · how-tos, design, design-patterns
- Nail Your Website Redesign in 2022—Tips and Tricks · · videos, redesign, tips-and-tricks
- Contextual Spacing for Intrinsic Web Design · · design, css, spacing
- In Defence of the Single Page Application · · spas
- Lerna Has Gone—Which Monorepo Is Right for a Node.js Backend Now? · · monorepos, dependencies, comparisons, nodejs
- Why I Don’t Miss React: A Story About Using the Platform · · react
- You Don’t Need a UI Framework · · frameworks, css, tooling
- Legibility—How and Why Typography Affects Ease of Reading · · websites, books, typography, legibility
- How to Create a Color Palette for Your Design System · · how-tos, design-systems, colors, color-palettes
- Microsoft Edge Overtakes Safari as World’s Second Most Popular Desktop Browser · · user-agents, desktop, microsoft, edge, apple, safari, metrics, comparisons
- 5 Simple Productivity Tips for Developers · · productivity, tips-and-tricks
- It’s Time We Fix the Unethical Design of Cookie Consent Windows · · design, ethics, cookies, consent-management, legal
- 8 JavaScript Quiz [Questions] That May Confuse You · · javascript, interviewing
- Ethical Design Network · · websites, design, ethics
- If Design Principles Are for Designs, Then Design Values Are for Designers · · design, principles
- Writing Better CSS · · css, quality, sorting
- Creating Realistic Reflections With CSS · · css, effects
- Deep Dive into Text Wrapping and Word Breaking · · css, typography
- Design System Documentation Best Practices · · design-systems, documentation, best-practices
- Under-Engineered Multi-Selects · · accessibility, html, aria
- Creating a Firework Effect With CSS · · css, effects
- How to Reduce Figma Memory Usage · · how-tos, figma
- Foundations: Lists · · html, accessibility
- How Web Browsers Work: Parsing the CSS · · user-agents, css, parsing
- Best Practices for Integrating Content Design in Your Design System · · design, design-systems, content, best-practices
- Let’s Keep the “Content” in WCAG · · content, accessibility, wcag
- The CSS Art Paradox · · css, art, html, quality
- Understanding the Performance Impact of Anti-Flicker Snippets · · performance, web-vitals
- My Browser Support Strategy · · user-agents, support, progressive-enhancement, testing
- The Complete Guide to Regular Expressions (Regex) · · guides, regex
- Common Frontend Interview Questions I’ve Been Asked · · interviewing, html, javascript
- How to Build Node.js REST API With MySQL · · how-tos, nodejs, apis, databases, mysql
- CTA Modal: How to Build a Web Component · · how-tos, web-components, javascript, modals
- Introducing “inert” · · html, accessibility, introductions
- Server-Side vs. Client-Side Analytics · · analytics, metrics, comparisons
- A Practical Guide to Aspect Ratio in CSS · · videos, guides, css
- Learn to Code With JavaScript: The Most Popular Programming Language on Earth · · javascript, learning
- Cool Hover Effects That Use Background Properties · · css, effects, backgrounds
- Web Scraping via JavaScript Runtime Heap Snapshots · · scraping, javascript, memory
- The 5 Golden Rules of Code Reviews · · code-reviews, processes, quality
- Stop Removing Focus · · accessibility, focus, css
- A Guide to Task-Based UX Metrics · · guides, user-experience, metrics
- Apple’s Grip on iOS Browser Engines Disallowed Under Latest Draft EU Rules · · user-agents, engines, legal, apple
- Is Measuring Speed a Useful Metric for Design Systems? · · videos, performance, metrics, design-systems
- Plain Old Semantic HTML: A Perfect Basis for Accessibility · · accessibility, html, semantics
- Flexibly Centering an Element With Side-Aligned Content · · css, design
- Deploy Your First Website Without Leaving Your IDE · · deploying
- Non-Interactive Elements With the “inert” Attribute · · html, semantics
- What Is Memoization? How and When to Memoize in JavaScript and React · · memoization, javascript, react
- 11 Steps to Keep Figma Clean · · design, tooling, figma
- 16 Top Design Trends for 2022 · · design, trends
- 8 Ways to Make Website Accessibility Easier (and Less Expensive) · · accessibility
- 9 Useful Principles of UX Design · · user-experience, design, principles
- Four Eras of JavaScript Frameworks · · javascript, frameworks, history
- Testing Figma Components · · testing, components, figma
- The “Dark Yellow Problem” in Design System Color Palettes · · design-systems, colors, color-palettes
- Deep Dive into Top Web Developer Pain Points · · web-platform
- Supercharge Your Design System With Design Tokens · · design-systems, design-tokens
- Mobile App Versus Web Site: Which Is Better for Your Business? · · comparisons, economics, mobile
- Build a Lightweight Web Component With Lit.js · · web-components, javascript
- How Web Browsers Work: Parsing the HTML · · user-agents, html, parsing
- Atomic Design 2022: What We Can Learn from Eames and Other Design Giants · · design
- Best Font for Online Reading: No Single Answer · · studies, research, fonts, typography, readability
- Writing Strong Front-End Test Element Locators · · testing
- Progressive Enhancement and HTML Forms: Use “FormData” · · html, forms, progressive-enhancement
- How Web Browsers Work: Navigation · · user-agents, http
- Why Your CSS Is Always Messy and Chaotic—Understanding CSS Complexity · · css, complexity
- Building a Combined CSS Aspect Ratio Grid · · css, layout
- Mastering CSS Transitions With React 18 · · css, transitions, react
- TypeScript Tips and Tricks · · videos, typescript, tips-and-tricks
- Web Color Is Still Broken · · websites, colors, web
- 11 Breadcrumb SEO Best Practices for a Mobile-First Strategy · · seo, best-practices, strategies, mobile-first
- Beyond WCAG: Losing Spoons Online · · accessibility, wcag, colors
- Brief Note on Buttons, Enter, and Space · · accessibility
- Why Learn to Code? 17 Benefits of Learning to Code · · learning, career
- The Future of CSS: CSS Toggles · · css
- Debugging Node Serverless Functions on AWS Lambda · · nodejs, debugging, serverless, functions, aws
- Faster Initialization of Instances With New Class Features · · user-agents, engines, v8, performance
- Productivity Tips and Tools for a More Efficient Workflow · · link-lists, productivity, tips-and-tricks, tooling
- Ordering CSS Declarations · · css, sorting
- The Front-End Developer’s Guide to the Terminal · · guides, command-line
- The Role of Policy in Creating a Culture of Accessibility · · interviews, accessibility, policies, culture
- Routing: I’m Not Smart Enough for an SPA · · routing, spas
- How to Start Testing Your Website With a Screen Reader · · how-tos, accessibility, user-agents, testing
- Forced Colors Explained: A Practical Guide · · colors, user-agents
- 4 Reasons to Avoid Using “npm link” · · npm
- A Practical Guide to Centering in CSS · · guides, css, design
- Does Valid and Semantic HTML Still Matter? · · podcasts, html, semantics, conformance
- The Ultimate Guide to Push Notifications for Developers · · guides, notifications
- Web Scraping Is Legal, U.S. Appeals Court Reaffirms · · scraping, legal
- When UX Goes Bad (and How to Fix It) · · user-experience
- 20 Easy Ways to Be More Productive as a Developer · · productivity
- React 18—New Features and Improvement Strategies · · react
- Ensure Third Party Content Is Accessible · · accessibility, wcag, embed-code
- Test-Driven Development With React and Redux: Thunk, Slices, and Requests Mocking · · testing, react, redux
- Node.js 18 Introduces Prefix-Only Core Modules · · nodejs
- Is Agile an Anti-Design Pattern? · · agile, design, anti-patterns
- The Most Popular Node.js Frameworks in 2022 · · nodejs, frameworks
- Accessibility Why You Need to Work Toward Progress Not Perfection · · accessibility
- Evaluating Design System Adoption Using Custom CSS · · design-systems, css, custom-properties, metrics
- Fonts for the Web: Rationale, 1996 · · fonts, history
- Intro to CSS Parent Selector—“:has()” · · videos, introductions, css, selectors
- Implementing Micro-Frontends: A Path to Evolve Legacy Codebases · · refactoring, maintenance, micro-frontends
- 7 Web Component Tricks · · web-components, tips-and-tricks
- A Web Renaissance · · web
- CSS Parent Selector · · css, selectors
- Designers Are Spending Too Much Time Designing UI Variations Manually · · design, processes, productivity
- The Ultimate Guide to Optimizing JavaScript for Quick Page Loads · · guides, javascript, performance, optimization
- Drastically Improve Your UI Designs With This Technique · · design, techniques, optimization
- How to Write Good Code: 10 Beginner-Friendly Techniques for Instant Results · · how-tos, quality, techniques
- Title Rewrites: 3 Patterns to Avoid · · seo, semantics, writing, microcontent
- Usability Guidelines for Better Carousels UX · · guidelines, usability, user-experience, carousels
- Building a Dialog Component · · components, modals, html, css, javascript
- Common Accessibility Issues That You Can Fix Today · · accessibility
- Does Your Website Have Any of These 10 Most-Cited Accessibility Issues? · · accessibility
- Naming Colors in Design Systems · · design-systems, colors, naming
- One Million Broken Web Sites—and a Way to Prevent That · · accessibility, user-agents, tooling
- Why Accessibility Bugs Are a Good Thing and How to Handle Them · · accessibility, quality
- 7 Collaborative Coding Tools for Remote Pair Programming · · collaboration, tooling
- Common App Design Challenges and Their Solutions · · design, user-experience
- Mobile-First Ecommerce Site Design Is the Future · · design, mobile-first
- Those HTML Elements You Never Use · · html, semantics
- How to Develop Your UX Design Philosophy · · how-tos, user-experience, design
- How to Improve UX Design Through A/B Testing · · how-tos, design, user-experience, testing, optimization
- Childish Font Sizes · · fonts, readability, design
- Image Borders in CSS · · css, images, borders
- CSS Toggles Explainer and Proposal · · css
- Takeaways from The Internet Is Unusable: The Disabled View · · accessibility
- CSS “:has()” a Parent Selector Now · · css, selectors
- Open Accessibility Standards · · websites, accessibility, wcag, aria
- Information Architecture: Study Guide · · guides, information-architecture, training, link-lists
- How to Fix Your Low-Contrast Text · · how-tos, accessibility, colors, contrast
- JavaScript Function Composition: What’s the Big Deal? · · javascript, functions
- CSS Tips and Tricks You May Need to Know · · css, tips-and-tricks
- There’s No Such Thing as a “Design System Designer” · · design, design-systems, career
- 33 JavaScript Concepts Every Developer Should Know · · javascript, concepts
- Incremental Static Regeneration for Angular · · angular, incremental-static-regeneration
- MIME Types · · videos, mime-types, servers, apache
- April 9 Is CSS Naked Day · · announcements, css, maintainability
- Dynamic Data-Fetching in an Authenticated Next.js App · · data-fetching, nextjs, authentication
- Nailing Your Engineering Interviews: Tips from a Technical Recruiter · · interviewing, career
- Use Unicode Characters for Bullet Points in CSS Using “::marker” · · unicode, css
- Why Your Design System Needs Content Design · · design-systems, content
- Your Website Is a Pollution Machine · · sustainability
- JavaScript and Node.js Testing Best Practices · · javascript, nodejs, testing, best-practices