Learn JavaScript for Designers

Bring your websites to life with interactive elements using JavaScript. These tutorials are tailored to web designers and are full of practical examples and tips.

All JavaScript for Designers content:

  1. Enhancing Animation With jQuery UI

    Enhancing Animation With jQuery UI

    Course Intermediate

    jQuery UI is an extension of jQuery that makes it easy to create clean user interface elements for your websites. It also provides functionality that extends...

  2. How to Create a Line Chart With Chart.js

    How to Create a Line Chart With Chart.js

    Tutorial Beginner

    In this video tutorial from my course on Data Design With Chart.js, you’re going to create a simple line chart by using the Chart.js framework to plot out a...

  3. 3 Methods for Automatic Browser Reloading

    3 Methods for Automatic Browser Reloading

    Tutorial Beginner

    In this screencast tutorial you’ll learn about browser reloading–specifically automatic reloading–and we’ll consider three different methods for doing so....

  4. 3 Courses to Help You Master Scrolling Animation

    3 Courses to Help You Master Scrolling Animation

    Tutorial Beginner

    Scrolling animation can be a great way to provide more interest for your users and to make your websites more interactive. The idea is that, as a user...

  5. JavaScript for Web Designers

    JavaScript for Web Designers

    Course Beginner

    In this course you’re going to learn the basics of JavaScript from a web designer’s perspective. We’ll begin by going over the basics, such as JavaScript...

  6. How to Track User Behavior With Google Analytics Events

    How to Track User Behavior With Google Analytics Events

    Tutorial Intermediate

    In this tutorial I’ll show you how to leverage the Google Analytics Event Tracking API (what a long name!) to find out how visitors use and interact with...

  7. Performance Enhancement: How to Load Images Using in-view.js

    Performance Enhancement: How to Load Images Using in-view.js

    Tutorial Intermediate

    In this tutorial I’ll show you how to improve the performance of your web pages by using in-view.js. This JavaScript library reports back when something has...

  8. Remove Unnecessary CSS With PurifyCSS and Grunt

    Remove Unnecessary CSS With PurifyCSS and Grunt

    Tutorial Intermediate

    In this tutorial I’ll show you how to use Grunt and PurifyCSS to create a super-lightweight stylesheet with minimal effort. We’ll install it, then learn how...

  9. Try Our New Course on Data Design With Chart.js

    Try Our New Course on Data Design With Chart.js

    Tutorial Beginner

    In our new course, Data Design With Chart.js, you'll get a comprehensive introduction to Chart.js, a powerful JavaScript library for dynamically displaying...

  10. Data Design With Chart.js

    Data Design With Chart.js

    Course Intermediate

    Data design (or “data visualization”) is the art of displaying information in a way that is easy to consume and easy to understand. In this course, I’m going...

  11. Designers, We Need to Talk About Development

    Designers, We Need to Talk About Development

    Tutorial Beginner

    In this series, we’ll discuss how to navigate the elusive rabbit hole that designers often find themselves in when dealing with developers on creative projects.

  12. Who Needs AMP? How to Lazy Load Responsive Images Quick and Easy With Layzr.js

    Who Needs AMP? How to Lazy Load Responsive Images Quick and Easy With Layzr.js

    Tutorial Intermediate

    Lazy loading allows a visitor to start engaging with content sooner, and the enhanced load speed can boost your search engine rankings. The more images you...