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!

  1. How to Create a Multilingual Website: A Step-by-Step Guide

    How to Create a Multilingual Website: A Step-by-Step Guide

    Tutorial Beginner

    Creating a multilingual website goes beyond just translating your site and calling it a day. Here, we'll walk you through the process.

  2. How to Prepare and Use an Affinity Diagram

    How to Prepare and Use an Affinity Diagram

    Tutorial Beginner

    “Affinity diagrams” are a UX designer’s tool, used to capture and synthesise qualitative data. This tutorial will look at preparation, recruitment, building...

  3. 2 Ways to Create and Display Footer Widgets in WordPress

    2 Ways to Create and Display Footer Widgets in WordPress

    Tutorial Intermediate

    In this tutorial, we'll start with a static demo from a previous tutorial, convert it to a WordPress theme, and then examine two ways to add dynamic content...

  4. Using Neumorphism in UI Design? Keep it Accessible

    Using Neumorphism in UI Design? Keep it Accessible

    Tutorial Beginner

    Creating a neumorphism UI could make for an interesting look for your website or app. But how should you go about it? Let’s explore.

  5. 25+ Best Spa and Beauty Salon WordPress Themes for 2023 (Free and Premium)

    25+ Best Spa and Beauty Salon WordPress Themes for 2023 (Free and Premium)

    Tutorial Beginner

    Need to make a spa, salon or beauty website quickly? Use the best salon WordPress themes specifically designed for beauty and spa websites. We’ve curated the...

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

    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...

  7. 20+ Best Mailchimp Responsive Templates for Mobile Email

    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...

  8. How to Build a Responsive Slider With Swiper.js

    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.

  9. HTML (Hypertext Markup Language)

    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,...

  10. HTML Element: dfn

    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...

  11. HTML Element: del

    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...

  12. 15+ Prototyping Templates for Fintech and Banking Apps

    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.