News and Tools for Frontend Development (15)
(Stay up-to-date on all topics by RSS feed or on Mastodon.)
- A Beginner’s Guide to Link and Text Accessibility · · guides, accessibility, links, content
- Culture Is Stuck · · culture, design
- Junior Designers, Please Don’t Give In · · design, career
- Fluid Typography: Predicting a Problem With Your User’s Zoom-In · · typography, css
- Why Do We Need Authorization and Authentication? · · authorization, authentication, security
- Overlapping Interactive Areas · · accessibility, design
- ICANN and the 7 Keys to the Internet · · videos, podcasts, web, domains, history
- An Ultimate Guide on Sizing, Spacing, Grids and Layout in Web and UI/UX Design · · guides, spacing, layout, typography, design
- Stashing Individual Files in Git · · git
- Styling a “pre” That Contains a “code” · · css, selectors
- Understanding Design Tokens, from UX Tool to Production · · videos, design-tokens
- JavaScript Frameworks—Heading into 2023 · · javascript, frameworks
- Git in 10 Mins · · git
- Why Web Design Still Matters in 2023 · · design, web
- 7 Tips for Improving Your Productivity With Git · · productivity, git, tips-and-tricks
- How to Write an Awesome README · · how-tos, documentation, readme
- A Guide to Command-Line Data Manipulation · · guides, command-line
- Theme Toggles · · websites, theming, html, react
- Shape Up · · processes, agile
- How to [Set Up] Prettier · · videos, prettier
- A CSS Challenge: Skewed Highlight · · css, effects
- Building Inclusive Products for Trans People · · inclusion
- The RUM Archive and Benford’s Law · · performance
- CSS Subgrid · · css, layout
- What’s Wrong With Code in 2022? · · complexity, quality, processes
- Invisible Ink Effect With SVG Filters and CSS · · code-pens, css, svg, effects
- Deploying CSS Logical Properties on Web Apps · · css, logical-properties, web-apps
- HTTP/3 Prioritization Demystified · · performance, http, protocols
- Enforcing Better HTML Markup With Eleventy · · html, semantics, conformance, eleventy
- 11 Tips That Make You a Better TypeScript Programmer · · tips-and-tricks, typescript
- A Problem With Link Relationships · · html, links, metadata, semantics
- User Stylesheets Are Still Pretty Great and Should Be More Widely Supported · · css, accessibility, user-styles
- 2022 CSS Updates · · css
- An Inclusive and Planet-Friendly Digital Style Guide · · design, accessibility, inclusion, sustainability, ethics
- Obscure CSS: Restoring Visibility · · css, accessibility
- The 10 Cheapest Web Hosting Solutions in 2022 · · hosting, economics
- What Is the Difference Between Alternative Text, Long Description, and Caption? · · accessibility
- Top 10 Accessibility News of 2022 · · accessibility, retrospectives
- Design System Fresh Bundling · · design-systems, bundling
- Aligning Jakob Nielsen’s 10 Usability Heuristics With the WCAG 2.1 · · accessibility, wcag, usability, heuristics
- A Theory of Web Relativity · · html, metadata, structured-data
- Accessibility Convincing · · videos, accessibility, ethics, legal
- CSS Color Spaces and Relative Color Syntax · · css, colors
- A Complete Guide to Timeouts in Node.js · · guides, nodejs
- Signals: The Nitty-Gritty · · performance, javascript, signals
- Building an Accessible Theme Picker With HTML, CSS, and JavaScript · · accessibility, html, css, javascript, theming
- 2022 Roundup of Web Research · · research, web
- Billions of Unnecessary Files in GitHub · · github, git
- React’s New Killer Documentation Focused Only on Functional Components · · react, documentation
- Things CSS Could Still Use Heading into 2023 · · css, visions
- Quick Start for Evaluating and Testing Web Accessibility · · videos, accessibility, testing
- The Intended Consequence of Inaccessible Digital Ads · · videos, accessibility, monetization
- Bad Performance Is Bad Accessibility · · performance, accessibility
- Common Nesting Issues in HTML · · html, nesting
- Foundations: Target Sizes · · accessibility, usability
- The Top 10 Security Vulnerabilities for Web Applications · · security, web-apps
- Why We Hang Onto WordPress Nostalgia · · wordpress
- Pointer Events · · css, javascript, events
- Useful Accessibility and Usability Examples to Help Improve Your Designs · · accessibility, usability, examples
- Beating Latency on Scalemates.com · · performance, optimization
- Do You Know “color-scheme”? · · css, dark-mode
- If You Are Afraid of AI, You May Not Be the Best UX Designer Out There · · user-experience, design, ai, career
- Taking the Stress out of Design System Management · · design-systems, maintenance
- The Performance Inequality Gap, 2023 · · performance
- The Science of User Experience · · user-experience, processes
- Interop 2022: End of Year Update · · interoperability, user-agents, html, css
- Prevent Focused Elements from Being Obscured by Sticky Headers · · accessibility, usability, css, focus
- Concepts Behind Modern Frameworks · · frameworks, concepts
- Step into the Light (DOM) · · dom, web-components, progressive-enhancement
- Frontend Dogma + UITest.com = ❤️ · · announcements
- CSS Style Queries · · css, container-queries
- Mini-Guide to Add an Image · · html, images
- How to Learn in Public · · how-tos, career, learning
- Lockfile Trick: Package an npm Project With Nix in 20 Lines · · npm, tips-and-tricks
- HTML Dialog · · html, modals
- Cascade Layers · · css, cascade
- Modern HTML as a Foundation for Progressive Enhancement · · html, progressive-enhancement
- Using Inline JavaScript Modules to Prevent CSS Blockage · · performance, javascript, css
- 5 HTML Elements, and a Partridge in a Despair Tree · · html, semantics, accessibility
- Apple, Google, and Mozilla Are Teaming Up to Make a Next-Gen Browser Benchmark · · user-agents, apple, google, mozilla
- Code Ownership and Software Quality · · processes, quality
- CSS Infinite 3D Sliders · · css, effects, animations
- How to Find and Fix the Top 3 Accessibility Issues · · videos, how-tos, accessibility, auditing
- 4 Ways CSS “:has()” Can Make Your HTML Forms Even Better · · css, selectors, html, forms
- An HTML-First Mental Model · · html, dom, performance
- CSS “image()” · · css
- ECMAScript Proposal: Iterator Helpers · · ecmascript, javascript, standards
- Get That Marquee AeStHeTiC · · html, css, effects
- Leaked a Secret? Check Your GitHub Alerts… for Free · · github, security
- Select the Right Tool for the Job · · principles
- A Guide for Making Apps Accessible · · guides, accessibility
- So, You’d Like to Animate the “display” Property · · css, animations
- Accessibility Starts With an Organisation’s Culture · · accessibility, culture
- CI/CD Tutorial for Developers · · tutorials, ci-cd, docker
- Logical Border Radius · · css, logical-properties, borders
- Help Choose the Syntax for CSS Nesting · · css, nesting
- Everything You Need to Know About Concurrent React (with a Little Bit of Suspense) · · react, concurrency
- IDN Is Crazy · · internationalization, domains
- Table Like It’s 2023 · · tables, html
- The Most Popular CSS-in-JS Libraries in 2022 · · libraries, javascript, css, css-in-js
- View Transitions API · · apis, transitions
- The Web Platform Is Back · · web-platform
- Apple Considering Dropping Requirement for iPhone Web Browsers to Use WebKit · · apple, user-agents, engines, webkit
- Sophisticated Web Scraping With Bright Data · · scraping, structured-data, apis
- A “:nth-child(An+B [of S]?)” Polyfill Thanks to CSS “:has()” · · css, selectors, polyfills
- Get off the Main Thread With an Inline Web Worker: An Example · · performance, javascript, web-workers, examples
- A Few Times Container Size Queries Would Have Helped Me Out · · css, container-queries
- Design Deserves More Respect · · design
- Federal Web Accessibility Focus Has Private Sector on Notice · · accessibility, legal
- New Viewport Units · · css, units, responsive-design
- One Day We’ll Have a Fully Customisable Select · · html, css
- State of A11Y · · videos, accessibility
- Top 5 Accessibility Issues in 2022 · · accessibility, retrospectives
- DOM Clobbering · · dom, security
- Five Myths About Digital Accessibility · · videos, accessibility
- The Future of Design Tokens · · videos, design-tokens, visions
- Top 30 Linux Commands for Everyday Use · · command-line, productivity
- WCAG 3.0: Are We There Yet? · · accessibility, wcag, standards
- Implement Scroll-Snapping Using Only CSS · · css, scrolling
- LCP(FE) · · performance, web-vitals
- There Can Be Only One: Options for Building “Choose One” Fields · · html, forms
- Conditional Wrapping in React · · react
- Dear Developer, Your Assumptions Are Wrong · · html
- Web Performance and Compression · · performance, compression
- Inside the Mind of a Frontend Developer: Article Layout · · html, css, layout
- WCAG—Priority of Constituencies · · accessibility, wcag
- CSS Infinite Slider Flipping Through Polaroid Images · · css, images, effects
- How to Merge Objects in JavaScript · · how-tos, javascript, objects
- Improving SEO Without Knowing Where to Start · · seo
- PHP 8.2.0 Release Announcement · · php
- Optimize Interaction to Next Paint · · performance, optimization, web-vitals
- Enough With the Pointless Images · · design, decoration, images
- A Modern HTML Template (2022) · · html, templates
- Best PHP Books for Beginners · · books, php, link-lists
- Meaningful Labels Using ARIA—or Not · · accessibility, html, forms, aria
- Testing for the Support of a Selector · · css, support, selectors
- W3C Publishes WCAG Testers Consistency List · · accessibility, wcag, testing
- The State of CSS 2022 · · surveys, css
- JavaScript Polyfills for Interviews · · javascript, polyfills, interviewing
- W3C Design Tokens With Style Dictionary · · design-tokens
- A Practical Guide to CSS Media Queries · · guides, css, media-queries
- Accessibility: The Land That “Time to Interactive” Forgot · · videos, accessibility, performance
- Accessible Front-End Patterns for Responsive Tables · · accessibility, tables, responsive-design
- Adding Complementary Performance Data to Your Site · · performance, apis
- New npm Features for Secure Publishing and Safe Consumption · · npm, security, dependencies
- Take Full-Size Screenshots of Websites Without Any Tools in Chrome · · user-agents, google, chrome, screenshots
- “mask-image” Lets You Do Some Really Cool Stuff · · videos, css, masking
- 4 More HTML Concepts You Didn’t Know · · html, concepts, forms, focus
- Brief Note on Description List Support · · html, semantics, accessibility, assistive-tech, support
- Reading the Meter · · html, semantics, accessibility
- Reduce Image Sizes by Removing Metadata · · images, metadata, performance, optimization
- The 411 on 4.1.1 · · accessibility, wcag, standards
- Website Accessibility Is Not an Afterthought · · accessibility
- Swearing and Automatic Captions · · accessibility, multimedia, captions
- Why You Should Be Using New CSS Features Today II · · css
- Bad UX Writing: 5 Mistakes to Avoid · · user-experience, writing, mistakes
- How to Create Typography Guidelines for a Product That Does Not Follow a Design System · · how-tos, typography, design-systems
- Does “www” Still Belong in URLs? · · usability, urls
- Fast Is Good, Instant Is Better · · performance, caching
- PHP Type Declarations—A Guide for Beginners · · php, guides
- Landmarks and Where to Put Them · · html, semantics, aria, accessibility
- Amy Jiménez Márquez on Leading Information Architecture · · podcasts, transcripts, information-architecture
- Using SRI to Protect from Malicious JavaScript · · javascript, security
- Super Useful CSS Resources · · css, link-lists, tooling
- About Modern Sass · · preprocessors, sass
- Accessibility and MVPs · · accessibility, principles
- Best APIs for Developers · · apis
- “:has(:not())” vs. “:not(:has())” · · css, selectors, comparisons
- Proximity: Gestalt Principle for User Interface Design · · videos, design, principles
- Prerender Pages in Chrome for Instant Page Navigations · · performance, user-agents, google, chrome
- CSS Infinite and Circular Rotating Image Slider · · css, images, animations
- You Don’t Need ARIA for That · · html, accessibility, aria
- 7 Website Performance Metrics to Track for Better UX · · performance, user-experience, metrics
- A Conversation With ChatGPT · · interviews, ai, typography, design
- Developing Faster JavaScript Apps: The Ultimate Guide to Web Workers · · guides, web-apps, performance, web-workers
- From Type to Logotype · · fonts, typography, design, branding
- Migrating from Vue 2 to Svelte · · migration, vuejs, svelte
- The Final Google Fonts Knowledge Drop of 2022 · · fonts, typography, google
- Digging Deeper into Container Style Queries · · css, container-queries
- How to Transfigure Wireframes into HTML · · how-tos, html, prototyping, conversion
- Design Spacing Tokens Semantically · · websites, design-tokens, spacing, design
- A Vibe Shift Is Coming · · user-experience, design, visions
- Apache .htaccess · · servers, apache
- 10 Key Principles of User-Centered Design · · design, usability, user-experience, principles
- Counting Unique Visitors Without Using Cookies, UIDs, or Fingerprinting · · metrics, privacy
- HTML Semantics and Accessibility Cheat Sheet · · cheat-sheets, html, semantics, accessibility
- Making Microservices Accessible · · accessibility, microservices
- “px” or “rem” in CSS? Just Use “rem” · · css, units
- Tips for Typing Import Statements in JavaScript · · javascript
- Transient Frameworks · · frameworks, web-platform
- Handling Images With Inconsistent Height in CSS · · css, images
- Why You Should Be Using New CSS Features Today · · css
- WordPress Versions 3.7–4.0 No Longer Get Security Updates · · wordpress, security
- Which Images Need Descriptive Text? · · accessibility, writing
- 5 Ways to Make Your JavaScript More Functional · · javascript, programming
- Convert Any Value to a Boolean in JavaScript · · javascript
- Tailwind Is a Leaky Abstraction · · tailwind, css
- The Large, Small, and Dynamic Viewport Units · · css, units
- Stop Fighting With CSS Positioning · · videos, css, layout
- Organizing the Eleventy Config File · · eleventy, configuration
- Speeding Up the JavaScript Ecosystem—One Library at a Time · · javascript, performance, libraries
- Color Formats in CSS · · css, colors
- Debugging Tactics · · debugging
- Making Accessibility Simpler in Higher Education and Beyond · · videos, accessibility
- Newer Things to Know About Good Ol’ HTML Lists · · html, semantics
- Testing Static Types in TypeScript · · testing, typescript
- We Document Our Design Systems—Why Don’t We Systematise our Documentation? · · design-systems, documentation
- Designing a Utopian Layout Grid: Working With Fluid Responsive Values in a Static Design Tool · · layout, design, css
- Shadow DOM and Accessibility: The Trouble With ARIA · · dom, shadow-dom, accessibility, aria, html
- Advanced Web Font Optimization Techniques · · fonts, typography, optimization
- Content May Be King, but Design Is Queen · · design, content
- HTML Content Model Categories · · html, semantics
- Three Pillars of User Delight · · user-experience
- CSS for URLs and HTTP Headers · · css, urls, http
- Upgrade Your HTML IV · · books, html, minimalism, craft, conformance
- NestJS with API Gateway · · apis
- Basic Intro to Bulma CSS · · introductions, bulma
- Addressing Concerns About CSS Speech · · accessibility, css
- Foundational Skills · · career
- A Guide to the Most Popular Types of APIs: REST, SOAP, GraphQL, and gRPC · · guides, apis, graphql
- Lazy Loading Images in HTML · · performance, html, lazy-loading
- Elements Can Be Visible Even Though Their Parent Has Set “visibility: hidden” · · css
- Growing Design System Documentation · · design-systems, documentation
- Positioning Notification Messages With Accessibility in Mind · · accessibility, notifications
- Forging Links · · videos, css, collaboration
- Document Object Model (DOM) Geometry: A Beginner’s Introduction and Guide · · introductions, guides, dom, javascript
- Should Design Systems Include Problematic Components and Patterns? · · design-systems, design-patterns, components
- The BBC’s 15 Web Principles—15 Years Later · · web, principles, history
- Why Japan’s Internet Is Weirdly Designed · · videos, design
- Setting Up a Screen Reader Testing Environment on Your Computer · · user-agents, assistive-tech, screen-readers, testing, accessibility
- Git Is Not the End of History · · git, version-control, visions
- The Shape-Shifting “a” Element · · html, links, semantics
- Accessibility and Inclusive Design Systems · · videos, accessibility, design-systems, inclusion
- Preparing for WCAG 2.2 · · videos, accessibility, wcag
- The “label” Element · · html, semantics
- Down With Design Systems Dogma · · design-systems
- CSS “:is()”, “:where()”, “:has()”, and “:not()” · · css, selectors
- Our Future CSS Strategy · · css, css-in-js, strategies
- Node.js Architecture Pitfalls to Avoid · · nodejs, architecture
- An Interactive Guide to Flexbox · · guides, css, layout
- Deploy Node.js to AWS: Build an Automated CI/CD Pipeline · · nodejs, aws, ci-cd, automation
- Natural Language Inputs · · forms, usability
- The Value of Accessibility · · podcasts, transcripts, accessibility
- Writing and Organizing Node.js API Tests the Right Way · · nodejs, apis, testing
- Optimizing a Vue App · · vuejs, web-apps, optimization
- Improving Firefox Stability With This One Weird Trick · · user-agents, mozilla, firefox
- What Image Format Should You Use in Your Next Project? · · images
- Page Title Conventions · · html, accessibility, seo
- What Happened to Text Inputs? · · videos, html, forms
- DOJ and Congressional Updates on Digital Accessibility · · accessibility, legal