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

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

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

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

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

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

  7. How to Add and Subtract Time From a Date in JavaScript

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

  8. 10+ Prototyping Templates for VR/AR Experiences

    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.

  9. How to Password Protect a Page in WordPress?

    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!

  10. Display WooCommerce Categories, Subcategories, and Products in Separate Lists

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

  11. How to Turn Your WordPress Website Into a Mobile App

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

  12. Easy Slider (Carousel With Pure CSS)

    Easy Slider (Carousel With Pure CSS)

    Tutorial Beginner

    A carousel is a great example of a possible CSS-only interactive feature. So in this tutorial, we’ll build a carousel with a few extra features using only CSS.