We’re back with our weekly roundup of all the web design and development related articles that we’ve found published around the internet. Let’s close out October with this week’s articles full of education, tutorials, inspiration, and creative conversations.

UNLIMITED DOWNLOADS: 400,000+ Fonts & Design Assets

Starting at only $16.50 per month!



 

The Semantics of Jamstack | CSS-Tricks

The past year has seen a healthy debate around the term 'Jamstack' as the definition gets stretched to include new use cases. I recently posted my take on a
Read More

20 Best New Websites, October 2021 | Webdesigner Depot

We’re well on our way to Hallowe’en already, and it’s time for another collection of websites that have caught our eye. It’s a mixed bag of candy this month, but nothing that should make you scream with fright. Enjoy! Tether This single-page site for forthcoming cycle safety system Tether uses a balanced combination of hero
Read More

A Deep Dive Into object-fit And background-size In CSS — Smashing Magazine

In this article, we will go through how `object-fit` and `background-size` work, when we can use them, and why, along with some practical use cases and recommendations. Let’s dive in.
Read More

Check if an Object Is Empty - JavaScriptSource

Here some different methods that you could use to check if an object is empty in modern browsers that support the ES5 edition of JavaScript.
Read More

The Process of Building a CSS Framework | Codrops

We recently released version 3 of CodyFrame, a CSS framework Sebastiano (my partner at CodyHouse) and I have been workin
Read More

How to Create File Dropzone in React and TypeScript

Creating a simple file dropzone doesn't have to be hard. This tutorial will help you create your own file dropzone with React and TypeScript.
Read More

5 Pillars of Effective Landing Page Design

Let's consider the must-have points that make a landing page design both user-friendly and effective for the business goals. Packed with web design examples.
Read More

Top Tools Every UI/UX Designer Should Know

Wondering which tools successful UXers use to design top-notch digital products? From ideation to developer handoff, UX designers rely on a variety of programs to execute each phase of the product development process. If you’re getting started with UX design, you’ll need to know what t...
Read More

Having a Singular Focus for Your Web Design Business

We take a look at the benefits and challenges of having a singular focus in web design. And hear from a web designer who's taken the plunge.
Read More

Get and Set Classes On An Element - JavaScriptSource

Get all of the classes on an element as a string, add a class or classes, or completely replace or remove all classes. Get and set classes in JavaScript.
Read More

Which design team suits you best? Take this test to find out.

Every designer deserves a special team they truly connect with. But which type of design role will give you the most happiness? Take this test to find out.
Read More

Why Best Practice Web Design Is Critical to Engage Your Audience

In this article, we discuss why web design is so important and how you can create a better, more intuitive website for your audience.
Read More

"Dark Mode" vs "Inverted"

One thing we run into a fair amount in our design system work is the need to clarify the difference between "dark mode" and "components rendered on a dark background". What is actual dark mode? prefers-color-scheme is a CSS media feature that listens to a user's preference for dark or light
Read More

Submit a form with Ajax - JavaScriptSource

The following function submits the data of formEle to the back-end using an Ajax request.
Read More

Why Experience Mapping is a Vital Element of the UX Design

A good UX design ensures that your users have an all-around positive experience on your website. You need a good user experience design: If you want to retain your customers...
Read More

Creating the Effect of Transparent Glass and Plastic in Three.js | Codrops

In a recent release of Three.js (r129 and beyond) some fabulous new features to MeshPhysicalMaterial were merged. The ne
Read More

In-Page Filtered Search With Vanilla JavaScript | CSS-Tricks

If you have a page that includes a lot of information, it’s a good idea to let users search for what they might be looking for. I’m not talking about
Read More

Pricing Tables: Best Designs and WordPress Plugins - 1stWebDesigner

Pricing tables are an important feature of websites that sell online. These tables help customers compare product features and prices.
Read More

JavaScript Functions Explained - JavaScriptSource

JavaScript functions are reusable blocks of code that perform a specific task, taking some form of input and returning an output.
Read More

An Introduction to the WordPress theme.json File

theme.json is a simple document for styling the WordPress block editor, and we show you how it can help theme developers.
Read More

Eye-Tracking In Mobile UX Research — Smashing Magazine

Thanks to technology, eye-tracking has become more accessible to UX research as it allows researchers to get insights about users ’visual attention. This article explores the latest trends in the eye-tracking market and how the methodology can be included in the UX researcher’s toolbox.
Read More

Testing Vue Components With Cypress | CSS-Tricks

Cypress is an automated test runner for browser-based applications and pages. I’ve used it for years to write end-to-end tests for web projects, and was happy
Read More

What Does Creativity Mean to You? » Design.org » Creativity Blog

What does creativity mean to you? The sooner you answer that question, the sooner you can use creativity to create a happier life.
Read More

How To Build An Amazon Product Scraper With Node.js — Smashing Magazine

The wealth of data that Amazon holds can make a huge difference when you’re designing a product or hunting for a bargain. But, how can a developer get that data? Simple, by using a web scraper. Here’s how to build your data extraction bot with Node.js.
Read More

How to Design a Landing Page That Sends Conversions Skyrocketing

If you’re in a sales slump, you might want to look into landing page design. We have six tips to help boost your conversions with design.
Read More

8 Reasons Your Site Is Slow + How To Fix Them | Webdesigner Depot

1, 2, 3 - That’s exactly how long it takes you to start losing visitors if you have a slow-loading website. Hold on! Surely, the only thing that matters to users is that your website works flawlessly and looks great... right? Wrong! The fact of the matter is that we’ve all become accustomed to instant
Read More

Merge Conflicts: What They Are and How to Deal with Them​ | CSS-Tricks

Merge conflicts... Nobody likes them. Some of us even fear them. But they are a fact of life when you're working with Git, especially when you're teaming up with other developers. In most cases, merge conflicts aren't as scary as you might think. In this fourth part of our “Advanced Git” series we'll talk about when they can happen, what they actually are, and how to solve them.
Read More
Avatar photo