A Web Designer’s Guide to the WebP Image Format

by Craig CampbellMar 8, 2019

FREELessons:8Length:33 minutes

Performance Google HTML Adobe Photoshop

Next lesson playing in 5 seconds

Cancel

Overview
Transcript

1.1 Welcome to the Course

Welcome to A Web Designer’s Guide to the WebP Image Format. In this course, you will learn how to create WebP images, add them to your website, and provide fallbacks for older browsers. This introductory video will give you a feel for what’s to come.

1.Introduction
1 lesson, 00:35

1.1
Welcome to the Course
00:35

2.WebP Images
6 lessons, 31:28

2.1
What Is a WebP File?
03:24

2.2
Creating WebP Files in Photoshop
06:56

2.3
Creating WebP Files With Squoosh
05:25

2.4
Adding WebP Images to a Web Page
03:02

2.5
Providing Fallback Images
04:57

2.6
Using WebP With CSS
07:44

3.Conclusion
1 lesson, 00:30

3.1
Final Thoughts
00:30

1.1 Welcome to the Course

Hello and welcome to a web designers guide to the WebP image format. My name is Craig Campbell and I will be your instructor for this course. The WebP format is an image format that was designed by Google to provide high quality images at lower file sizes. In this lesson, you will learn how to create your own WebP images, how to include them in your website, and how to provide fall-backs for browsers that don't support the WebP format. So I wanna thank you for watching, and we'll get started in the next lesson.

Back to the top

Craig Campbell

Craig has been doodling on computers since the first time he opened Paintbrush in Windows 3.0 in 1990. Since then, he has constantly sought new and exciting ways to make beautiful things on computers.

craigsoup

A Web Designer’s Guide to the WebP Image Format

Next lesson playing in 5 seconds

1.1 Welcome to the Course

1.Introduction1 lesson, 00:35

2.WebP Images6 lessons, 31:28

3.Conclusion1 lesson, 00:30

1.1 Welcome to the Course

1.Introduction
1 lesson, 00:35

2.WebP Images
6 lessons, 31:28

3.Conclusion
1 lesson, 00:30