Responsive Images (Udacity)

Offered by Udacity, Google,
Responsive Images (Udacity)

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.

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

Quick load times and responsive content leads to higher conversions. There's much more to images on the web than . Attributes like srcset, markup techniques using CSS, fonts, and inline images, and the brand new element are now available to help you create the best possible experience for your users. This course will help you ensure that you deliver the highest quality images with the fewest possible bytes.

What You Will Learn

Lesson 1
Getting up and Running

  • Start debugging on your mobile devices to work with responsive images with Sam Dutton.
  • Get started with Developer Tools and mobile debugging.

Lesson 2
Units, Formats, Environments

  • Compare different kinds of images on the web and the units you can use to scale them.
  • Set up your development environment so that responsive images are a part of your workflow.
  • Apply responsive image principles in a real-world scenario!

Lesson 3
Images with Markup

  • Dive into using markup techniques like CSS and icon fonts to create responsive graphics.
  • Learn how to use markup techniques that are natively responsive and often extremely lightweight.
  • Replace extraneous images with markup techniques add social media icons to the responsive blog project!

Lesson 4
Full Responsiveness

  • Make your images fully responsive using the new element!
  • Learn to use the srcset and sizes attributes.
  • Make the blog project fully responsive by implementing to display beautiful images across a range of device widths and pixel ratios.
Go to Class
MOOC List is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Related Courses

Java Programming Basics (Udacity) Udacity
Udacity

Java Programming Basics (Udacity)

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
Introduction to Linear Algebra and Python (Coursera) Coursera
Howard University

Introduction to Linear Algebra and Python (Coursera)

This course is the first of a series that is designed for beginners who want to learn how to apply basic data science concepts to real-world problems. You might be a student who is considering pursuing a career in data science and wanting to learn more, or you might be a business professional who wants to apply some data science principles to your work. Or, you might simply be a curious, lifelong learner intrigued by the powerful tools that data science and math provides. Regardless of your motivation, we’ll provide you with the support and information you need to get started.

Sep 28th 2026
4 Weeks
Artificial Intelligence for Breast Cancer Detection (Coursera) Coursera
Johns Hopkins University

Artificial Intelligence for Breast Cancer Detection (Coursera)

Through interactive lectures and module exercises, this course illustrates the potential of artificial intelligence in breast imaging. Topics include an introduction of breast cancer and breast imaging, introduction to artificial intelligence in image analysis and computer image processing of cancer detection. The course intends to provide students basic understanding of artificial intelligence approaches to breast cancer detection.

Oct 5th 2026
4 Weeks
Introduction to Machine Learning Course (Udacity) Udacity
Udacity

Introduction to Machine Learning Course (Udacity)

This class will teach you the end-to-end process of investigating data through a machine learning lens. Learn online, with Udacity. Machine Learning is a first-class ticket to the most exciting careers in data analysis today. As data sources proliferate along with the computing power to process them, going straight to the data is one of the most straightforward ways to quickly gain insights and make predictions.

Self Paced
Self-Paced
Data Science Math Skills (Coursera) Coursera
Duke University

Data Science Math Skills (Coursera)

Data science courses contain math—no avoiding that! This course is designed to teach learners the basic math you will need in order to be successful in almost any data science math course and was created for learners who have basic math skills but may not have taken algebra or pre-calculus. Data Science Math Skills introduces the core math that data science is built upon, with no extra complexity, introducing unfamiliar ideas and math symbols one-at-a-time.

Sep 24th 2026
4 Weeks
Ethical Issues in Data Science (Coursera) Coursera
University of Colorado Boulder

Ethical Issues in Data Science (Coursera)

Computing applications involving large amounts of data – the domain of data science – impact the lives of most people in the U.S. and the world. These impacts include recommendations made to us by internet-based systems, information that is available about us online, techniques that are used for security and surveillance, data that is used in health care, and many more. In many cases, they are affected by techniques in artificial intelligence and machine learning.

Sep 28th 2026
5-12 Weeks
Making Data Science Work for Clinical Reporting (Coursera) Coursera
Genentech

Making Data Science Work for Clinical Reporting (Coursera)

This course is aimed to demonstrate how principles and methods from data science can be applied in clinical reporting. By the end of the course, learners will understand what requirements there are in reporting clinical trials, and how they impact on how data science is used. The learner will see how they can work efficiently and effectively while still ensuring that they meet the needed standards.

Oct 5th 2026
4 Weeks
Film, Images & Historical Interpretation in the 20th Century: The Camera Never Lies (Coursera) Coursera
University of London,Royal Holloway, University of London

Film, Images & Historical Interpretation in the 20th Century: The Camera Never Lies (Coursera)

This course is a short taster on the topic of the use of Images, Film, and their use in historical interpretation in the 20th century. It is primarily provided for those who have a general interest in history that draws on photojournalism as primary evidence, and films based on historical events.

Oct 5th 2026
5-12 Weeks
Code Free Data Science (Coursera) Coursera
University of California, San Diego

Code Free Data Science (Coursera)

The Code Free Data Science class is designed for learners seeking to gain or expand their knowledge in the area of Data Science. Participants will receive the basic training in effective predictive analytic approaches accompanying the growing discipline of Data Science without any programming requirements. Machine Learning methods will be presented by utilizing the KNIME Analytics Platform to discover patterns and relationships in data.

Sep 28th 2026
4 Weeks
Xcode Debugging (Udacity) Udacity
Udacity

Xcode Debugging (Udacity)

Print Statements, Breakpoints, and LLDB. "If debugging is the process of removing bugs, then programming must be the process of putting them in." Edsger W. Dijkstra Debugging is yin to programming's yang; you can't have one without the other. However, finding bugs in programs can be an incredibly frustrating and demotivating process for developers. This course will teach you a variety of techniques to help make debugging your code easier.

Self Paced
Self-Paced