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

LinkedIn Learning

HTML: Images and Figures

via LinkedIn Learning

Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!
Explore the many ways to present graphics on web pages. Discover how to make your graphics accessible, reliably placed, and a smooth fit for a variety of different screens.

Syllabus

Introduction
  • Welcome
  • What you should know
  • Setting up your computer
1. Image Essentials
  • Using the img element and src attribute
  • Accessibility: alt and title attributes
  • Image size: Width and height
  • Obtaining images
2. Image Formats
  • Image format overview
  • GIF and PNG: The format for line art
  • JPEG: The format for photos
  • SVG: The format for vector line art
3. Images and CSS
  • Borders, padding, and spacing
  • Alignment
  • Challenge: Images and text
  • Solution: Images and text
  • Special effects
  • Background images
4. Responsive Images
  • Resolution and pixel density
  • Handling pixel density
  • Using srcset and sizes
  • Testing screen resolutions
  • Challenge: Use srcset
  • Solution: Use srcset
  • Art direction: The picture element
5. Figures
  • Using figure and figcaption elements
  • Autonumbering figures with CSS
Conclusion
  • Next steps

Taught by

J. David Eisenberg

Reviews

4.5 rating at LinkedIn Learning based on 129 ratings

Start your review of HTML: Images and Figures

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.