Course for HTML and CSS 104 – Adding Images to Web Pages [for Mac]

Great websites need to be picture perfect. This HTML and CSS course teaches you everything about images and how you can optimize the visual experience when creating and publishing your web pages.
Can you tell your JPEGs from your GIFs or PNGs? Well…it's not always clear which one is the best choice for your web page. In this 18-tutorial course, Beth and Eric give you the answers so you can see more clearly, and understand exactly what each image type has to offer, so you can make the right choices in your web design. You learn how to optimize your photos, logos and graphics so they look their best but also load fast! You also see firsthand how to convert and resize your images and examine what lossless and lossy formats are all about.

There is also a super informative section on screen readers that shows you how to write descriptive tags for the images in your page to allow anyone, even those who may not be able to see your photos, to get a good idea as to what they're about. CSS also comes into play. Here you learn how to improve the impact your images by laying them out just right, using some simple yet very effective rules.

So, fire up your favorite text editor and get ready to learn how to handle images on the web using HTML and CSS! And while you're here, make sure and watch or review the other courses in our comprehensive series.

Table of contents:

1. Introduction
2. Review of the IMG Element
3. Using the IMG Element
4. Image Width & Height
5. Image sizes with iPhoto
6. Image sizes with Photoshop
7. Big picture: Images and HTML
8. The ALT attribute and accessibility
9. Using Images as anchors
10. Image Formats
11. JPEG Quality Controls
12. Creating PNG and GIF
13. Creating Transparent Images
14. CSS for Images
15. Applying Borders and Padding
16. Using Float
17. Image width and height with CSS
18. Wrap-up and One More Thing…