Udacity

Responsive Web Design Fundamentals (Udacity)

Offered by Udacity, Google,
Responsive Web Design Fundamentals (Udacity)

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

How to Get Into Web Development (Coursera) Coursera
University of Leeds

How to Get Into Web Development (Coursera)

Computer Science

Adding web development to your skillset is an excellent career move if you are into coding and you seek career growth and advancement. In this online course, you will explore the web development specialisations - front-end, back-end and full-stack development, and understand the different roles in a web development team.

Sep 28th 2026
2 Weeks
HTML Javascript CSS
Details
Computational Social Science Methods (Coursera) Coursera
University of California, Davis

Computational Social Science Methods (Coursera)

Statistics & Data Analysis Data Science

This course gives you an overview of the current opportunities and the omnipresent reach of computational social science. The results are all around us, every day, reaching from the services provided by the world’s most valuable companies, over the hidden influence of governmental agencies, to the power of social and political movements. All of them study human behavior in order to shape it. In short, all of them do social science by computational means.

Sep 14th 2026
4 Weeks
CSS Social Science Social Networks
Details
Software Analysis & Testing (Udacity) 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
Details
Learn Styled Components in React (Coursera) Coursera
Scrimba

Learn Styled Components in React (Coursera)

CS: Software Engineering

If you are wondering how to enhance your CSS for styling React component systems, styled components are the way to go. Styled components are helpful for many reasons. They reduce class name bugs, they make your components more readable, and they allow you to navigate your CSS more easily. They also allow for dynamic styling and automatic vendor prefixing.

Sep 28th 2026
1 Week
CSS Web Development ReactJS
Details
Learn CSS Variables (Coursera) 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.

Sep 28th 2026
1 Week
HTML CSS Software Development
Details
The Arduino Platform and C Programming (Coursera) Coursera
University of California, Irvine

The Arduino Platform and C Programming (Coursera)

CS: Software Engineering

The Arduino is an open-source computer hardware/software platform for building digital devices and interactive objects that can sense and control the physical world around them. In this class you will learn how the Arduino platform works in terms of the physical board and libraries and the IDE (integrated development environment). You will also learn about shields, which are smaller boards that plug into the main Arduino board to perform other functions such as sensing light, heat, GPS tracking, or providing a user interface display. The course will also cover programming the Arduino using C code and accessing the pins on the board via the software to control external devices.

Sep 14th 2026
4 Weeks
Programming Debugging Arduino
Details
App Deployment, Debugging, and Performance en Français (Coursera) Coursera
Google Cloud

App Deployment, Debugging, and Performance en Français (Coursera)

CS: Software Engineering Computer Science

Dans ce cours, les développeurs d'applications apprennent à concevoir et développer des applications cloud natives qui intègrent parfaitement les services gérés de Google Cloud. À travers un ensemble de présentations, de démonstrations et d'ateliers pratiques, ils découvrent comment appliquer les bonnes pratiques de développement d'applications et comment utiliser les services de stockage Google Cloud appropriés pour le stockage d'objets, les données relationnelles, la mise en cache et l'analyse. Les participants peuvent choisir d'effectuer les ateliers dans leur langage préféré (Node.js, Java ou Python).

Sep 14th 2026
1 Week
Debugging Performance Data Storage
Details
Programming and Application Foundations (Coursera) 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
Details
The Full Stack (Coursera) Coursera
Meta

The Full Stack (Coursera)

Computer Science

As you prepare for your role in back-end development, practice bringing together multiple skills to build a full-stack Django app. You’ll start by setting up an environment for a local practical project, and refactoring the front and back-ends of an existing application. You will then have the opportunity to create the front and back-ends of a new application using your full-stack developer skills.

Sep 14th 2026
5-12 Weeks
HTML Javascript CSS
Details
Introduction to Web Development (Coursera) 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.

Sep 14th 2026
5-12 Weeks
Programming HTML Javascript
Details