Introducing the features of Web 3.0 sites

Decentralization, AI- and AR/VR-driven experiences, semantic web.

Classic HCI demos

A collection of Human Computer Interaction demo videos 1983–2002.

MetalliCSS

Versatile metallic effects that make your CSS shine.

Stop treating all of your content as if it were news

“How we present content to readers should never be defined by the publication tool.”

“Isn’t ‘sleep on it’ the best design advice ever? Can’t count the number of times in my career this has been super helpful.”

“It's easy to shit on designers. It’s harder to shit on the unseen structures, management practices and power dynamics that directly influence designers’ work.”

Responsive accessibility using visibility hidden

How to make a responsive disclosure widget in an accessible way.

Dialogs, modality and popovers seem similar

The differences of the kinds of things that can lay over other things.

GitHub Blocks

Create rich, interactive repositories that showcase your project.

Mona Sans & Hubot Sans

Two open-source variable fonts with countless variations.

CtrlAltCC

A place dedicated to helping you find useful tools.

Google needs 9x more time to crawl JavaScript than HTML

If you need your content indexed quickly, use plain HTML.

Improving the experience for web developers

The W3C has launched the WebDX Community Group.

Metaphor

An AI-powered search engine with a fresh approach.

Hey, GitHub!

Voice-based interaction with GitHub Copilot, the AI pair programmer.

6 steps to improve HTML images for users and developers

Better HTML images with responsive sizes and modern formats.

Map of the Internet

An interactive map to explore the IP address space.

How to design a calendar

Calendar UI design best practices and date picker inspiration.

Mastodon is just blogs

An analogy may help to understand the decentralized social network better.

Bootstrap Icons v1.10.0

The popular open-source icon library now includes more than 1,900 icons.

Append data to the URL query

Say hello to a new curl option: --url-query is your new friend.

What is a realm in JavaScript?

The role of realms in supply chain attacks and security in general.

A designer’s guide to React

What it is, why it is so popular, and what it means for designers.

What’s new in version 2 of the Affinity apps?

Affinity launches Designer 2, Publisher 2, and Photo 2 (Windows, Mac, iPad).

Forking Chrome to turn HTML into SVG

How html2svg, the program that converts web pages to SVG, works.

The anatomy of visually-hidden

Ways to hide content visually while it’s still accessible to screen readers.

Deno 1.28

You can now import over 1.3 million npm modules in Deno.

Command K Bars

An intro to a design pattern that has started to pop up everywhere.

The evolution of scalable CSS

A deep dive into the problems with scaling CSS on large projects.

The Design System Guide

A step-by-step interactive handbook to set up a design system.

“In a world of generative AI, curation will become the new creation.”

Why you should never use px to set font-size in CSS

The difference between px and other CSS units.

Announcing TypeScript 4.9

New ‘satisfies’ operator, improved narrowing with ‘in’, and more.

When our tools hold us back

Why do we still use web platform features which are already obsolete?

Your accessibility claims are wrong, unless…

What to do before you set expectations about accessibility.

How PlanetScale Boost serves your SQL queries instantly

“PlanetScale’s optimization layer makes your existing SQL queries up to 1,000x faster.”

Most companies don’t need ‘great design’ – it can even hurt a business. Most just need ‘good enough’ design.

Announcing Nuxt 3.0 stable

A big milestone for the community around the web framework Vue.

Retool

A platform for building powerful application components with minimal effort.

By bots, for Bots

When AI generates both good and bad news.

Dashboard Design Patterns

Dashboard genres, design process, guidelines, patterns, and cheat sheets.

The hidden power of custom states for web components

A crucial step in the evolution of Custom Elements.

“If you’re lucky enough to have built an early version of something people actually want, quality is truly the ultimate growth lever.”

Feedle

A search engine for blogs and podcasts where every search is an RSS feed.

Why is the terminal input so weird?

Warp has made a terminal input that works much more like an IDE.

Inside Framer’s magic Motion

How to recreate Framer’s magical layout animations with CSS/React.

“80% of the design process is exploring alternates only to come back to a slightly modified version of the one you started with.”

Start showing your products on Google Shopping

Search Console now helps merchants to reach more shoppers.

“Whenever I add a new RSS feed to my reader, I feel like I’ve added a new gem to my treasure box.”

Progress over perfection: a better way to accessibility

Small steps can make a big difference.

CSS Timeline

The evolution of the language that defines the display of web pages.

WordPress Photos

A collection of publicly-contributed, royalty-free stock photos.

Do we still need lazy loading libraries and ‘data-src’ in 2022?

Where JavaScript is still recommended to lazy load content images.

Badge notifications

The psychology of badge notifications and why they can be overwhelming.

pppixelate

A simple tool to draw pixel art in the browser and render it as an SVG pattern.

“The current education in the UX field is way too focused on polished deliverables, not enough on your feet skills and thinking techniques.”

This keeps you away from being a professional

“Professionalism in software engineering doesn’t come as an accident.”

Movies app in 7 frameworks

A speed comparison of the same app written in different frameworks.

An interactive guide to Flexbox

Master dynamic layouts with CSS Flexbox by using the right mental model.

Introducing our new guide to Google Search ranking systems

Google makes it easier to learn about how its systems work

Named Colors Wheel

Quickly look up HTML-named colors and their hex equivalents.

Natural language inputs

What if every form input was a text input that accepts natural language?

Konbert

A powerful online data converter (XLS, CSV, JSON, XML, HTML, SQL, and more).

Introducing Magician

Design with the power of AI: copywriting, images, and icons.

Google’s duplicate detection algorithm is broken

A Google bug can cause the deindexation of web pages.

What happened to text inputs?

We keep screwing up the simplest parts of web interfaces.

“There should be a code of ethics for frontend developers where we all agree to never disable paste on form inputs.”

ooh! directory

A collection of noteworthy blogs, including a design and a development section.

Git cheat sheet

Commands and concepts to simplify your life as a developer.

Accessibility contrast requirements explained

Success criteria, affected users, examples, tools, and techniques.

Interactive animations with variable fonts

Variable fonts are excellent candidates for smooth special effects.

Regex-Vis

An online tool to understand regular expressions by visualizing them.

Smooth and simple transitions with the View Transitions API

What to expect from the new API and how it works.

Color Naming Buddy

A prototype for a tool to find names for your favorite colors.

Driven by defaults

Defaults can help take bigger strides towards a sustainable web.

Cloudflare servers don’t own IPs anymore

So how do they connect to the internet?

Tree views in CSS

A state-of-the-art collapsible list using only HTML/CSS without JavaScript.

Why I love React

“React is simple, which doesn’t mean it’s easy for everyone.”

Futicons

A set of niche icons from areas that may dominate the future.

Reimagining a token taxonomy

Challenges from design token projects, from audits to implementation.

Color formats in CSS

Which one to use in which case? Hex, RGB, HSL, HSB, LCH, Display P3?

News from UK and EU

Browser engines are now on the regulators’ agenda.

The large, small, and dynamic viewport units

What to expect from the new CSS units for mobile viewports.

HTMHell Advent Calendar 2022

24 articles from 24 authors in 24 days.

How Google interprets the robots.txt specification

Google’s interpretation of the Robots Exclusion Protocol explained.

New in Chrome 108

New viewport size units, variable font support in COLRv1, and more.

more.graphics

A collection of creative pattern generators with many customization possibilities.

Shadow DOM and accessibility

The trouble with ARIA and how we might solve the problem.

Futurepedia

A searchable and categorized directory of helpful AI tools.

Speeding up the JavaScript ecosystem, one library at a time

Small changes with a big impact.

Setting up a screen reader testing environment on your computer

Virtualization software, screen reader installation, keyboard configuration.

One Word Domains

A huge database of available and brandable one-word domains.

FFmpeg

Fundamental concepts, media transcoding, video and audio processing, practical examples.

Web development advent calendars for 2022

A selection of advent calendars covering web-related topics.

How to split JavaScript strings into sentences, words or graphemes

‘Intl.Segmenter’ is a great way to split strings into meaningful parts.

Avoid unnecessarily complex password-creation requirements

They have a significant negative impact on UX and conversion rate.

Is ‘CSS Engineer’ now a job position?

‘CSS Engineer’ would clarify things compared to ‘Frontend Engineer.’

Design System Canvas

A tool to bring structure to the creation and updating of a design system.

Prerender pages in Chrome for instant page navigations

A modern reboot of prerendering will start rolling out from Chrome 108.

“I’m going to reinstate a blog roll and RSS on my website (and you should too.) That might be a great way to bring back the feeling we had about blogs pre-Twitter.”