This article was originally published on this site


Can you believe it’s May already? Not only is it a new month, but it’s the first Friday of the new calendar page, and Fridays around here mean it’s time for another edition of “This Week In Web Design”! Every week we scan the internet for newly published articles related to web design and development, then bring them here to you all in one spot. This week in web design and development we’ve found new articles about various CSS tricks and tutorials, WordPress, fonts, React, some JavaScript frameworks, and more. Let’s dive in!

The UX Designer Toolbox

Unlimited Downloads: 500,000+ Wireframe & UX Templates, UI Kits & Design Assets
Starting at only $16.50 per month!


SVG, Favicons, and All the Fun Things We Can Do With Them

One very new trick is the ability to use SVG as a favicon. It’s something that most modern browsers support, with more support on the way.

How to Make a CSS-Only Carousel

There’s no JavaScript here, whatsoever! No jQuery plugins. No trickiness. Just a couple of new-ish CSS properties.

Best of the web for Design and Web Development April 2020

This is another great roundup certainly worth reading through to conclude April.

How to Pick a Font (For Any Design): 10 Tips & Principles

Some timeless rules you can follow when deciding how to pick a font.

Spread the Word: Beautiful Testimonial UI Examples

Take a look at some examples that will give your testimonials a place to shine.

Latest Research for Web Designers April 2020

A variety of topics, from 2020 holiday shopping predictions to missed opportunities in SEO.

Speed Up WordPress With a Free Performance Plugin

How to install and configure the WP-Optimize plugin and explain how it will help speed up your WordPress website.

Getting Started With Nuxt

Learn how to create server-side rendered applications by using Nuxt.js, how to configure your application for development, and how to deploy to Heroku.

18 Free & Premium Business Icon Sets

Free & premium business icon sets that take the guesswork out of what collections are best and allows you to focus more on building an effective site.

Variable Fonts: A 101 Introduction (+ Free Variable Fonts to Try)

If you’re still wondering what these variable fonts really are, we’ll help you get a basic understanding of it.

30 Stunning Examples of Drop-Down Menu Design

This drop down menu design inspiration will hopefully help your brainstorming process speed up.

Morphing Gooey Text Hover Effect

Three gooey morphing hover effects using SVG filters for menu links based on a demo by Graham Pyne.

How To Change The Excerpt Length In WordPress (With And Without A Plugin)

In certain situations you may wish to have more control of how your WordPress posts are displayed, such as changing the excerpt length. Here is how to change the excerpt length with or without a plugin.

The Most Popular List Of 30+ Web Tools And Services

We spent good time during COVID-19 to create the most popular list of 30+ web tools and services.

Implementing Dark Mode In React Apps Using styled-components

Learn how to efficiently implement dark mode in a React app on a simple web page, using the styled-components library and leveraging some React features like hooks.

Using Formik to Handle Forms in React

Start with a React component then integrate Formik while demonstrating the way it handles state, validation, and submissions.

Using Git Subtree for WordPress Projects

Why Git Subtree was necessary for my (much loved) Git Push to WP Engine deployment system.

Supercharge Your Facebook Ads: How to Add Facebook Pixel to WordPress

In this article, we’ll be exploring exactly what Facebook Pixel has to offer you.

How to Build a Simple Toggle Switch Component With the CSS Checkbox Hack

Learn how to build a CSS-only switch component by taking advantage of the “CSS checkbox hack technique”.

How to Determine a Target Market for Your Web Design Business

In today’s post we look at some items to consider when deciding where you want your web design business to go.

18 Tips to Improve Website Design Legibility

Let us see the factors that contribute to good looking and readable content.

Alpine.js: The JavaScript Framework That’s Used Like jQuery, Written Like Vue, and Inspired by TailwindCSS

It’s like a replacement for jQuery and JavaScript, but with declarative rendering.

How to Contribute to Open Source TypeScript Projects

Practical ways for you to get involved in open source TypeScript projects. We’ll first cover assessing your level then jump into how you can find opportunities.

12 Home Office Setup Ideas for Web Designers and Developers

Some of the cleanest, most comfortable, and most unique home office setup ideas for you while you work from home.

Using CSS to Control Text Selection

CSS lets you control how text selection behaves and appears on your pages.

Learn CSS min(), max(), and clamp()

Set a min and max font-size in seconds!

35 Nice Examples of Flat Web Design

For your inspiration we’ve assembled a beautiful collection of flat web designs.

Mirage JS Deep Dive: Understanding Mirage JS Models And Associations (Part 1)

Take a closer look at what Mirage JS models and associations are and the roles they play in crafting out production-ready frontend without an actual backend with Mirage JS.

How To Succeed In Wireframe Design

Learn what wireframes are, why we need to design them, how to get the most out of the designs, and how to take it to the next level.

Immersive Transition Effect

In this tutorial, we will show you how to create an immersive transition effect between sections.

The Hero Generator

How To Create Customized WordPress HTTP Error Pages

Creating a custom error page will leave a visitor fulfilled, returning later, and (hopefully) keep their shirt on.

This post may contain affiliate links. See our disclosure about affiliate links here.