Web Design Tutorials

Learn web design with thousands of free tutorials! Maybe you want to know how to build a site using WordPress themes, or maybe you want to master more advanced web design topics like interface design or responsive design. Whatever you need, you'll find it here.

Stay up to date with the latest features and developments in CSS, Shopify, WooCommerce, and more. Learn how to design landing pages and email templates that stand out from the crowd and get people to take action. For all the web design tips and advice you need, our expert instructors have you covered!

Read less

All content

Courses

Tutorials

All Web Design tutorials:

English

Web Design

2 Ways to Build a Sticky Footer (Flexbox and CSS Grid)

Tutorial • Intermediate

In this short tutorial, we’ll cover two quick ways to create a sticky footer with CSS—a component that will sit at the page’s bottom no matter the page’s...

George Martsoukos • 25 Sep 2023
Email Templates

20+ Best Mailchimp Responsive Templates for Mobile Email

Tutorial • Beginner

Before you start a new email marketing campaign, it's vital you have the right mobile email template on hand. This collection of Mailchimp responsive and...

Brenda Barron • 22 Sep 2023
Bootstrap

How to Build a Responsive Slider With Swiper.js

Tutorial • Intermediate

In this tutorial, we'll build a unique page layout by taking advantage of Swiper.js, one of the most popular JavaScript sliders available now.

George Martsoukos • 21 Sep 2023
HTML

HTML (Hypertext Markup Language)

Tutorial • Beginner

HTML is the structural coding language we use to build web pages. Some people refer to HTML as being the “building blocks of the web”. Here’s what it means,...

Ian Yates • 21 Sep 2023
HTML

HTML Element: dfn

Tutorial • Beginner

The HTML dfn element defines a term within a document, helping to provide clarity and context. It is often paired with the abbr element to describe or...

Andy Leverenz • 20 Sep 2023
HTML

HTML Element: del

Tutorial • Beginner

The HTML del element represents deleted or removed content within a document, and it is typically used with the ins element to show modifications or changes...

Andy Leverenz • 20 Sep 2023
Web Design

15+ Prototyping Templates for Fintech and Banking Apps

Tutorial • Beginner

Hit the ground running when creating your next fintech UI design or banking UI design for mobile apps with standout prototyping templates.

Brenda Barron • 20 Sep 2023
JavaScript for Designers

How to Add and Subtract Time From a Date in JavaScript

Tutorial • Beginner

In this post, I'll show you how to manipulate dates with a JavaScript Date object. Specifically, I'll show you how you can add and subtract time from a Date...

Sajal Soni • 19 Sep 2023
UI Design

10+ Prototyping Templates for VR/AR Experiences

Tutorial • Beginner

Whether you’re building a VR or AR app or a website to discuss your latest technology, we’ve got a VR/AR prototype template on hand to help get you started.

Brenda Barron • 19 Sep 2023
WordPress CMS

How to Password Protect a Page in WordPress?

Tutorial • Beginner

Are you worried about keeping your WordPress pages secure from unwanted visitors? Do you want to password protect your WordPress site webpages? Read on!

Daniel Strongin • 19 Sep 2023
WooCommerce

Display WooCommerce Categories, Subcategories, and Products in Separate Lists

Tutorial • Intermediate

WooCommerce gives you the option to display categories and products together on archive pages, but they appear in the same list, which can look messy. Here’s...

Rachel McCollin • 18 Sep 2023
WordPress Plugins

How to Turn Your WordPress Website Into a Mobile App

Tutorial • Beginner

Do you want to turn your existing WordPress website into a mobile app without writing a single line of code? WebView templates and WordPress app builders are...

Franc Lucas • 18 Sep 2023