Chrome DevTools tricks that deserve a spotlight

Some of the DevTools features you might not know about.

Deno KV

A global database built for JavaScript and TypeScript with zero setup.

“Stop using ChatGPT to avoid thinking.”

Introducing storage on Vercel

Vercel makes databases a first-class part of its frontend cloud.

CSS blend modes

Interactive demonstrations of pixel blending techniques.

Why chatbots are not the future

Effective tools would make it clear how they should be used.

It’s about time CAPTCHAS become accessible

Are there any viable options for CAPTCHAs on the horizon?

SupportsCSS

Feature detection for modern CSS, inspired by the legacy of Modernizr.

“The best way for you to become a better designer is not looking at Dribbble or Behance. It’s looking and playing with real products and seeing how they handle certain scenarios and flows.”

An update on the lock Icon

Google will replace the lock icon in Chrome’s address bar with a new ‘tune’ icon.

Qwik reaches v1.0

The full-stack web framework brings a new approach to delivering instant apps at scale.

Best practices for website footer UX

More user engagement with a well-crafted website footer.

Don’t use custom CSS scrollbars

Just because you can style browser scrollbars doesn’t mean you should.

The beginning of the end of the password

Google has started to roll out passkeys on all major platforms.

Adaptable components with CSS Style Queries

Expand your CSS design options with custom view queries.

“The (user) insights a UX team can generate are the most important source of information that can be fed to AI tools to create a usable product.”

Arc will change the way you work on the web

“The Arc web browser is the most transformative app I’ve used in decades.”

I want to talk about WebGPU

What the arrival of the new WebGL means for programmers.

The State of Search 2023

The current trends around Google Search with actionable insights.

“Accessibility isn’t something you add to your product. It is your product. If the button isn’t labeled, if the text cannot be seen, if the action cannot be performed, then it may as well not be there for some subset of people.”

“‘Users say our website is hard to use, let’s add a chat bot.’ Congratulations, now you have two bad interfaces instead of one.”

Should we be polite to chatbots?

The downside of treating AI as a mere tool or even a slave.

A radical proposal: put UX research in charge

“Product, development, and design should all report to UX research.”

Monoliths are not dinosaurs

Building evolvable software systems is a strategy, not a religion.

Frontend web performance checklist

Ways to optimize page loading, improve smoothness, and reduce layout shifts.

The problem with sticky menus and what to do instead

Sticky menus can hurt UX far more than they improve it.

Designing for (realistic) attention

Structuring content for people who only scan it is critical.

Using OpenAI with JavaScript

Let’s build a chat application with a vector database.

Proportio

A tool to create proportional scales for UI elements in design systems.

Firefox 113 significantly boosts accessibility performance

Users of assistive technologies have now faster access to the content.

The new JavaScript features coming in ECMAScript 2023

Smaller additions arrive this year; bigger ones are on the horizon.

The Content Design Manifesto

Who content designers are, how they work, their impacts, and their future.

Rearrange/Animate CSS Grid layouts with the View Transition API

With a few lines of JavaScript and CSS, you can animate your grid layout.

Measure and improve your site’s footprint

The popular WebPageTest tool introduces Carbon Control.

“Don’t take your work too serious. Your designs will fail and you will make mistakes. That’s okay. As far as you learn from them you just can win.”

Introducing Baseline: a unified view of stable web features

A fresh approach to documenting browser support for web features.

Advancing Interaction to Next Paint

Interaction to Next Paint (INP) becomes a Core Web Vital next year.

10 years of email marketing rules

What has changed in the past decade, and what can we expect in the future?

Memory allocation

An interactive introduction to memory allocation with visuals and a playground.

How companies use dark patterns to keep you subscribed

Let’s try to unsubscribe from 16 well-known digital services!

The intentional impact of images

Every image that’s put out has the opportunity to make a difference.

How to style links that don’t look ugly

Some ways to make underlined links look more attractive.

Go with PHP

“PHP has become faster, more secure, and more enjoyable to use.”

IP Lookup

Find out if an IP address is a threat.

The JavaScript ecosystem is delightfully weird

The many ways people aren’t writing JavaScript anymore.

“It is still impressive how far ahead Macromedia Flash was in terms of interactivity and design on the web. To this day, we’re still trying to do the same things we did 20 years ago with Flash.”

The new .zip TLD is going to cause some problems

How to know whether ‘example.zip’ is an URL or a filename?

New TLDs: not bad, actually

Why the debut of .zip and .mov as top-level domains has caused a stir.

Web browsing and Plugins are now rolling out in beta

ChatGPT adds internet access and 70+ third-party plugins.

The Contrast Triangle

A tool that helps to create accessible text links without underlines.

:root isn’t global

The problem of CSS Custom Properties defined on :root.

“Research without insights and insights without action don’t count.”

Building a modern design system in layers

Proper layering facilitates the long-term evolution of a design system.

The problem with disabled buttons and what to do instead

Live form validations can frustrate users or even cause them to give up.

Is your organic search traffic eroding?

A step-by-step guide to run a Google traffic erosion analysis.

Conditional CSS with :has and :nth-last-child

Further ways to create dynamic components with modern CSS.

Visually accessible data visualization

Options to improve data visualizations for colorblind people.

TTFB Test

Measure your website’s Time to First Byte (TTFB) from many locations worldwide.

Lighthouse diff + WebPageTest

Google’s web performance auditing tool now has a diff tool.

The ongoing defense of front-end as a full-time job

Why a front-end developer is anything but a mediocre coder.

Animated Background Headers

Easily configure and generate an animated header for your website.

The Bun Bundler

A fast JavaScript bundler deeply integrated into Bun’s runtime.

TLS byte by byte

Watch a web page performing a live, annotated https request for itself.

WebKit features in Safari 16.5

CSS Nesting, CSS user valid and invalid pseudo-classes, and more.

Accessible Numbers

Guidance on designing services for people who need help with numbers.

Expanding conversational user interfaces

Options for increasing the usefulness of chat interfaces.

Preparing to ship the Privacy Sandbox relevance and measurement APIs

Google remains on track to completely deprecate third-party cookies.

RedMonk top 20 programming languages over time

The top four languages are still the same for over a decade now.

“As designers, we’re not just creating products. We’re creating a language, a dialogue with users that transcends the screen. A conversation that starts with a user’s first click and evolves with every interaction.”

“Calling it ‘content’ was the first step in convincing people that machines could make it.”

Getting started with View Transitions on multi-page apps

“The ability to easily create quality 60 FPS page transitions is a game changer.”

Detecting if an event was triggered by a user or by JavaScript

Nothing is built-in to JavaScript to help us, so what to do?

Visual Frameworks

A collection of pictorial mental models to clarify your thoughts.

capo.js

Optimize web performance by identifying out-of-order head tag elements.

Using linear() for better animation

Bounce, spring, and elastic effects with the upcoming CSS linear() easing function.

High-contrast: when you think dark mode is enough

The importance of a high-contrast theme in interfaces.

Be careful using ‘menu’

There is a term that more accurately describes the control you want.

A well known URL for your personal avatar

Why not store your go-to avatar on your domain for quick retrieval?

“‘Pick the right tool for the job’ is always the right answer, especially when someone’s trying to debate you on why their tool is better than ‘your tool.’”

Introducing the popover API

New HTML APIs for building popovers are coming to browsers.

Meet Adobe Firefly, now in Photoshop

A new way to create imagery from a simple text prompt.

The Hawthorne effect or observer bias in user research

People behave differently when they know they are observed.

Learning SEO

A roadmap to learn Search Engine Optimization with reliable resources.

Understanding news topic authority

How Google’s new system surfaces expert news in search results.

CSS Pattern

A collection of more than 100 unique CSS patterns coded from scratch.

Deploying AVIF for more responsive websites

How the new image format has been adopted in the ecosystem.

BentoGrids

An inspiring collection of tile layouts for branding and product features.

Generative AI: what you need to know

A guide to learn the basics of generative AI and to spot AI bullshit.

Arc’s new Boosts feature lets you change the way any website looks

The Arc browser now turns its users into web designers.

Decoding the Future: the evolution of intelligent interfaces

How we interact with technology is about to change significantly.

HTML best practices for login and sign-up forms

These forms are simple, but many websites still have mistakes.

‘display: contents’ considered harmful

What you risk when you rely on the CSS declaration ‘display: contents.’

The retro magic of style switchers

Why stop with just a dark mode? Let’s go back to the future.

“Professionalism is caring more than is reasonable to get it right.”

“To replace programmers with AI, clients will need to accurately describe what they want. We’re safe.”

Data sources for calculating digital emissions

Public data sources for digital products, services, and activities.

Mastering CSS blend modes

Blend modes are a powerful way to create endless visual effects.

Avoiding dark patterns in web design

Ethical alternatives to deceptive patterns benefit everyone in the end.

First experiments with view transitions for multi-page apps

Let’s discover the potential of the new View Transitions API.

Dynamic interfaces

What if a UI can anticipate user needs and iterate itself?