Welcome to October and this week’s roundup of all the web design and development related articles we’ve found around the web that were published in the past seven days. This week we have topics including jQuery, UX and UI design, WordPress, React, fonts, Tailwind CSS, and many more. Let’s get caught up.
The Freelance Designer Toolbox
Unlimited Downloads: 500,000+ Web Templates, Icon Sets, Themes & Design Assets
All starting at only $16.50 per month

How to Add a CSS Gradient Overlay to a Background Image - 1WD
Figuring out how to place text on top of a background image, while making sure you can still read it, can be challenging.
Read More 
20 Best New Sites, September 2021 | Webdesigner Depot
Welcome to this month’s collection of what’s making the web look good. This time out we’ve got some new brands and some rebrands, and we’ve got some good examples of branding continuity across media. Branding continuity doesn’t just mean putting the logo in the corner and using the same colors and type. It’s about capturing
Read More 
Changing Hands: Should You Worry When a WordPress Plugin Has a New Owner?
Recently, a number of big-name and trusted WordPress plugins have been sold. How concerned should we be? We try to make sense of it all.
Read More 
UX vs. UI Design: What’s the Difference Between UX and UI Design?
If you’re confused about the difference between UX vs. UI design, you’re not alone. Take a look at UX vs. UI design to find out how they’re different!
Read More 
UI Interactions & Animations Roundup #19 | Codrops
These past couple of weeks we've been collecting some motion gems for you that will hopefully spark some true inspiratio
Read More 
The Pros and Cons of Tailwind CSS | Webdesigner Depot
As a utility-first CSS framework, Tailwind has rapidly become popular among developers. With its fast styling process and the freedom it offers when designing a website, it’s really no wonder why. But how can you make sure this is the right CSS framework for your upcoming development projects? In this blog post, you'll learn what
Read More 
The Impossible Question: How Long Does It Take to Build a Website?
We look at the many factors that can impact a web design project’s launch date, and share tips for determining its length more accurately.
Read More 
5 Signs that Being a Web Developer is for You
If you know the slightest bit about computers, you probably have at least some idea of what a web developer is and precisely what they do. To break it
Read More 
Let’s Dive Into Cypress For End-to-End Testing — Smashing Magazine
Is end-to-end testing a painful topic for you? In this article, Ramona Schwering explains how to handle end-to-end testing with Cypress and make it make it not so tedious and expensive for yourself, but fun instead.
Read More 
Design Trend: Voice UX – Are You Designing for It?
Voice interfaces and user experiences are a trending topic in the world of website design because user behavior is demanding it. Just think of how often you ask Alexa, Google, or Siri for help on any given day. Think about the push for more accessibly designed websites that work more effec...
Read More 
Collecting Email Signups With the Notion API | CSS-Tricks
A lot of people these days are setting up their own newsletters. You’ve got the current big names like Substack and MailChimp, companies like Twitter are
Read More Top Free & Premium WordPress Calendar Plugins - 1stWebDesigner
WordPress calendar plugins are ideal for scheduling things like boardroom meetings, work events, family meetings, and other important dates.
Read More 
Automatically expand a textarea as the user types - JavaScriptSource
A really neat little helper function that automatically expands a textarea as the user types in.
Read More 
Kinetic Typography Page Transition | Codrops
The other day I was drooling over HOLOGRAPHIK's amazing kinetic typography animations. Especially this one caught my eye
Read More 
5 golden rules of ethical web design (& how to apply them)
Learn how to practice ethical design communication in your web designs by applying 5 simple rules.
Read More 
Improve Performance by Combining Headless CMS with an Image CDN | Webdesigner Depot
The headless CMS trend is gaining traction growing at over 20% annually. The driving force behind the headless CMS trend is developer’s increasing need for flexibility and control. Using the headless CMS’s API, front-end developers can use JavaScript frameworks like React, Vue, or Angular to quickly deploy content and designs in various web pages and
Read More 
Using Modern Image Formats: AVIF And WebP — Smashing Magazine
In this article, we’ll highlight how modern image formats (AVIF or WebP) can improve compression by up to 50% and deliver better quality per-byte while still looking visually appealing. We’ll compare what’s possible at high-quality, low-quality and file-size targets.
Read More 
Calculate the size of scrollbar - JavaScriptSource
The clientWidth property indicates the width without scrollbar. The offsetWidth, on the other hand, includes the scrollbar if there is.
Read More 
Django vs WordPress — Which Is Better for Your Website?
Learn about key similarities and differences between Django vs WordPress, and which one to choose for your website needs.
Read More 
Socially Responsible Designers: 6 Actions for Inclusive Design - The Media Temple Blog
Inclusive design ensures web experiences are user-friendly and accessible to diverse users. Implement ethical design with these 6 principles.
Read More A New Design-Centered Meeting Framework: Better Capture the Product Design Narrative
<div class="panel-pane pane-entity-field pane-node-field-long-article-teaser"> <div class="field field-name-field-long-article-teaser field-type-text-long field-label-hidden"> <div class="field-items"> <div class="field-item even">As New York Public Radio, like many other organizations, have shifted to working remotely over the last year, we saw a need to rethink how we collaborate in order to increase productivity. Like many design teams before COVID-19, we already used tools like Figma and Miro that made passive or asynchronous communication possible but once we removed the in-person aspect, a few things changed.</div> </div> </div> </div> <div class="panel-pane pane-custom pane-2"></div>
Read More 
30 Sign-Up Form Examples for Design Inspiration
Sign-up forms are a great way to gather information about potential customers. Make sure yours looks great with these 30 sign-up form examples!
Read More 
Web Streams Everywhere (and Fetch for Node.js) | CSS-Tricks
Chrome developer advocate Jake Archibald called 2016 "the year of web streams." Clearly, his prediction was somewhat premature. The Streams Standard was
Read More 
Graphic Design to UI/UX: A Comprehensive Guide to Transitioning
Looking to make the switch to UI/UX? Here are some concepts and mindsets to focus on.
Read More 
Fresh Resources for Web Designers and Developers (September 2021)
There is lot happening this month in the tech industry; from Docker updating their business and plans, prominent WordPress businesses being acquired,
Read More 
JavaScript Strings Explained - JavaScriptSource
In JavaScript, Strings are values made up of text and can contain letters, numbers, symbols, punctuation, and even emojis!
Read More 
Creating the Perfect Commit in Git | CSS-Tricks
A commit can be something that helps us stay on top of things. It can be a container for related changes that belong to one and only one topic, and thereby make it easier for us to understand what happened. In this post, we’re talking about what it takes to produce the "perfect" commit.
Read More