Web Dev stories

Deferring Offscreen Images and Background Assets for Faster Loading

Deferring offscreen images is a web performance optimization technique that can help you improve user experience and Core Web Vitals on your site. Also known as lazy loading, it downloads out-of-view images only when they’re about to appear in the user’s viewport. Deferring offscreen images is especially important on image-heavy websites.

Request for developer feedback: customizable select

Styling form controls like the <select> element has been reported as a top developer pain point for years, and we’ve been working on a solution. While this work is complex and has taken a long time to get right, we’re getting very close to landing this feature. A customizable version of the select element is officially in Stage 2 in the WHATWG, with strong cross-browser interest and a prototype for you to test out from…

Creative Menu Patterns & Animations

A selection of creative menu patterns and animations that highlight diverse design styles, offering fresh inspiration for your next project.

Building A Memory Game with PhaserJS and ReactJS

Today, we’ll create a simple game using PhaserJS and ReactJS. Despite the simplicity of the game, we will cover all the key aspects of game development with PhaserJS. We’ll explore concepts like scenes, prefabs, how to integrate PhaserJS with ReactJS, how to add third-party libraries and components, and how to use tweens for animations.

Understanding the CSS drop-shadow() Function

In modern web design, shadows are widely used to enhance the look and feel of user interfaces.

Two CSS Properties for Trimming Text Box Whitespace

The text-box-trim and text-box-edge properties in CSS enable developers to trim specifiable amounts of the whitespace that appear above the first formatted line of text and below the last formatted line of text in a text box, making the text box vertically larger than the content within.

Developing modals using only CSS and the Popover API

Modals once had a bad reputation because they were so complicated to build from scratch. They were often buggy and had terrible usability, not to mention the many accessibility requirements that had to be met.

Two CSS Properties for Trimming Text Box Whitespace

The text-box-trim and text-box-edge properties in CSS enable developers to trim specifiable amounts of the whitespace that appear above the first formatted line of text and below the last formatted line of text in a text box, making the text box vertically larger than the content within.

The VS Code method: Tightening a developer’s inner loop

Developers have to split their time between heads-down work and collaborative touchpoints. VS Code aims to reconcile their competing priorities to keep them in the flow.

On-Scroll Layout Formations Ideas

An exploration of layout formations during scroll, where content is pinned until the layout is fully assembled.

1 2 7 8 9 10 11 68 69

Submit an article

You can submit new articles related to web design / development, UX, apps and graphic design. No homepage submissions, no spammy affiliate links will be accepted.
Title
URL

Thank you!

Thanks for submitting your story. We will review it and approve it if relevant.