5

IMAGES

  • How to add images to pages
  • Choosing the right format
  • Optimizing images for the web

There are many reasons why you might want to add an image to a web page: you might want to include a logo, photograph, illustration, diagram, or chart.

There are several things to consider when selecting and preparing images for your site, but taking time to get them right will make it look more attractive and professional. In this chapter you will learn how to:

  • Include an image in your web pages using HTML
  • Pick which image format to use
  • Show an image at the right size
  • Optimize an image for use on the web to make pages load faster

You can also use CSS to include images in your pages using the background-image property, which you will meet on pages 413-420.

image

CHOOSING IMAGES FOR YOUR SITE

A picture can say a thousand words, and great images help make the difference between an average-looking site and a really engaging one.

Images can be used to set the tone for a site in less time than it takes to read a description. If you do not have photographs to use on your website, there are companies who sell stock images; these are images you pay to use (there is a list of stock photography websites below). Remember that all images are subject to copyright, and you can get in trouble for simply taking photographs from another website.

If you have a page that shows several images (such as product ...

Get HTML & CSS: Design and Build Websites now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.