Udacity

Responsive Web Design Fundamentals (Udacity)

Offered by Udacity, Google,

Great Experiences on Any Device. In this course you'll learn the fundamentals of responsive web design with Google's Pete LePage! You'll create your own responsive web page that works well on any device - phone, tablet, desktop or anything in between.

Class Deals by MOOC List - Click here and see Udacity's Active Discounts, Deals, and Promo Codes.

You’ll start by exploring what makes a site responsive and how some common responsive design patterns work across different devices. From there, you’ll learn how to create your own responsive layout using the viewport tag and CSS media queries. As you proceed, you’ll experiment with major and minor breakpoints, and optimizing text for reading.

The way people browse the web is changing quickly - fewer and fewer users access the web at a desk in front of a large monitor with a keyboard and mouse. The web is increasingly being enjoyed on phones, tablets, wearables, TVs and everything in between. By designing a site to be responsive, it will look good and work well no matter what device your users have in front of them.
Throughout this course, you'll work through a project creating a home town website that works well on phones, tablets and desktop displays.

What You Will Learn

Lesson 1
Why Responsive

Introduction to responsive design with Pete LePage.
Why does responsive design work for any device?
Remote debugging and emulation in the browser.

Lesson 2
Starting Small

What is the viewport?
Learn about sizing the content to the viewport.
Touch targets and why they should be large.

Lesson 3
Building Up

How to take advantage of CSS media queries.
What is a breakpoint and how to choose one.
How to use the CSS flexbox to modify layout.

Lesson 4
Common Responsive Patterns

How to apply the mostly fluid pattern.
How to apply the column drop pattern.
How to apply layout shifter pattern.

Lesson 5
Optimizations

Using minor break points.
How to optimize text layout.
How to use responsive tables and strategies for dealing with them.

Prerequisites and Requirements
You should be comfortable reading and writing HTML and CSS. You should also be able to inspect and modify websites using browser developer tools (we use Google Chrome, but you should be able to accomplish all the tasks in this course with any browser's developer tools).If you are unfamiliar with HTML and CSS, or if feel like you need to brush up on them, start with our Intro to HTML and CSS.You will not need to write JavaScript for this course.

Go to Class

MOOC List is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Related Courses

Coursera

Scrimba

Learn CSS Flexbox (Coursera)

CS: Software Engineering

Mastering CSS Flexbox: Unlock the Power of Flexible Web Layouts. Discover the indispensable art of CSS Flexbox and elevate your web development prowess to new heights. In this comprehensive course, you'll gain proficiency in harnessing the unparalleled capabilities of Flexbox, revolutionizing the way you construct websites.

Aug 31st 2026

1 Week

Programming CSS Web Design

Udacity

Intro to HTML and CSS (Udacity)

CS: Programming

In this course, you'll learn the fundamentals web development, along with best practices and professional problem-solving techniques using Developer Tools. Throughout this course, you'll learn about the underlying structure of the web - HTML. You'll learn how to use this tree-like structure to create websites. You'll also learn how to apply styling to a website through CSS. You'll learn about CSS syntax, selectors, and units. Along the way, you'll also learn about code editors and a browser's Developer Tools.

Self Paced

Self-Paced

Programming HTML CSS

Udacity

Udacity,Google

Responsive Images (Udacity)

CS: Software Engineering Computer Science

Fewer Bytes, Faster Loads. Did you know that images account for more than 60% of the bytes on average needed to load a web page? In this course you will learn how to work with images on the modern web, so that your images look great and load quickly on any device. Along the way, you will pick up a range of skills and techniques to smoothly integrate responsive images into your development workflow. By the end of the course, you will be developing with images that adapt and respond to different viewport sizes and usage scenarios.

Self Paced

Self-Paced

Image Debugging Responsiveness

Coursera

Scrimba

Learn CSS Variables (Coursera)

CS: Software Engineering CS: Programming

CSS Custom Properties represent a significant advancement for front-end developers, introducing the concept of variables to CSS. This innovation substantially reduces redundancy, enhances code legibility, and augments overall flexibility. Notably, CSS Variables distinguish themselves from their CSS preprocessor counterparts by seamlessly integrating into the Document Object Model (DOM), offering a plethora of advantages.

Aug 31st 2026

1 Week

HTML CSS Software Development

Udacity

Udacity,Google

Browser Rendering Optimization (Udacity)

Computer Science

Building 60 FPS Web Apps. Performance matters to users. Web developers need to build apps that react quickly and render smoothly. Google performance guru Paul Lewis is here to help you destroy jank and create web apps that maintain 60 frames per second performance. You'll leave this course with the tools you need to profile apps and identify the causes of jank. You'll explore the browser's rendering pipeline and uncover patterns that make it easy to build performant apps.

Self Paced

Self-Paced

HTML Javascript CSS

Udacity

Java Programming Basics (Udacity)

CS: Software Engineering CS: Programming

Take your first steps towards becoming a Java developer! Learn Java syntax and create conditional statements, loops, and functions. Taking this course will provide you with a basic foundation in Java syntax, which is the first step towards becoming a successful Java developer. You’ll learn how computers make decisions and how Java keeps track of information through variables and data types.

Self Paced

Self-Paced

Programming Java Debugging

Coursera

University of California, Davis

Introduction to Web Development (Coursera)

CS: Software Engineering CS: Programming

This course is designed to start you on a path toward future studies in web development and design, no matter how little experience or technical knowledge you currently have. The web is a very big place, and if you are the typical internet user, you probably visit several websites every day, whether for business, entertainment or education. But have you ever wondered how these websites actually work? How are they built? How do browsers, computers, and mobile devices interact with the web? What skills are necessary to build a website? With almost 1 billion websites now on the internet, the answers to these questions could be your first step toward a better understanding of the internet and developing a new set of internet skills.

Aug 31st 2026

5-12 Weeks

Programming HTML Javascript

Coursera

Illinois Tech

Programming and Application Foundations (Coursera)

CS: Software Engineering CS: Programming

This course introduces the students to the creation and deployment of modern, standards-compliant web pages written in HTML, CSS, and JavaScript in the context of the client-server architecture of the web. The course also covers the fundamentals of programming in a modern programming language, basic data modeling, database design, implementation, and administration of single-user and shared multi-user database applications using a contemporary relational database management system.

Sep 14th 2026

5-12 Weeks

Programming HTML Javascript

Udacity

Udacity,Google

Website Performance Optimization (Udacity)

CS: Software Engineering

The Critical Rendering Path. You will learn how to optimize any website for speed by diving into the details of how mobile and desktop browsers render pages. In this short course, you’ll learn about the Critical Rendering Path, or the set of steps browsers must take to convert HTML, CSS and JavaScript into living, breathing websites. From there, you’ll start exploring and experimenting with tools to measure performance and simple strategies to deliver the first pixels to the screen as early as possible.

Self Paced

Self-Paced

Programming HTML Javascript

Coursera

University of Michigan

Building Web Applications in PHP (Coursera)

CS: Software Engineering CS: Programming

In this course, you'll explore the basic structure of a web application, and how a web browser interacts with a web server. You'll be introduced to the request/response cycle, including GET/POST/Redirect. You'll also gain an introductory understanding of Hypertext Markup Language (HTML), as well as the basic syntax and data structures of the PHP language, variables, logic, iteration, arrays, error handling, and superglobal variables, among other elements.

Aug 31st 2026

5-12 Weeks

HTML CSS PHP

Udacity

Georgia Institute of Technology,Udacity

Software Analysis & Testing (Udacity)

CS: Software Engineering Computer Science

This course covers the theory and practice of software analysis, which lies at the heart of many software development processes such as diagnosing bugs, testing, debugging, and more. It presents diverse techniques, each with their own strengths and limitations, for automating tasks such as testing, debugging, and finding bugs in complex real-world programs. These techniques include dataflow analysis, constraint-based analysis, type systems, model checking, symbolic execution, and more. The course teaches the principles underlying these techniques as well as imparts hands-on experience with using and implementing tools based on these techniques.

Self Paced

Self-Paced

Testing Debugging Software Testing

Coursera

NIIT StackRoute

Developing Responsive Web Pages Using HTML5 and CSS3 (Coursera)

CS: Software Engineering CS: Programming

The number of mobile users has increased exponentially over the past few years. Shopping, social connect, entertainment and other activities are just a few clicks away for these mobile users. A responsive web design adjusts the layout and appearance of the web pages to suit the resolution and width of the screens. This makes a web page look attractive on devices with diverse screen sizes. Designing a well-organized, responsive, and user-friendly web page has therefore become the need of the hour.

Aug 31st 2026

3 Weeks

HTML5 Bootstrap Web Development