# The images

• element is used to add images to a web page. You must always specify a src attribute to indicate the source of an image and an alt attribute to describe the content of an image. You should save images at the size you will be using them on the web page and in the appropriate format. Photographs are best saved as JPEGs; illustrations or logos that use flat colors are better saved as GIFs. Color not only brings your s XX ite to life, but also helps convey the mood and evokes reactions.

  There are three ways to specify colors in CSS:

  1. RGB values
  2. hex codes
  3. color names

Color pickers can help you find the color you want. It is important to ensure that there is enough contrast between any text and the background color (otherwise people will not be able to read your content). CSS3 has introduced an extra value for RGB colors to indicate opacity. It is known as RGBA. CSS3 also allows you to specify colors as HSL values, with an optional opacity value. It is known as HSLA.

text

• There are properties to control the choice of font, size, weight, style, and spacing.

There is a limited choice of fonts that you can assume most people will have installed.

You can control the space between lines of text, individual letters, and words. Text can also be aligned to the left, right, center, or justified. It can also be indented. You can use pseudo-classes to change the style of an element when a user hovers over or clicks on text, or when they have visited a link.

# the diffrences between jpg gif pNG ### PNG is a lossless image format using DEFLATE compression. No data is lost during compression and no compression artefacts are introduced in the image. For this reason, a PNG image would retain higher quality than an image than JPEG and would look a lot sharper, it would also occupy more space on the disk. This makes it unsuitable for storing or transferring high-resolution digital photographs but a great choice for images with text, logos and shapes with sharp edges. ### GIF is also a lossless image format that uses LZW compression algorithm. It was favoured over PNG for simple graphics in websites in its early days because the support of PNG was still growing. Given that PNG is now supported across all major devices and that PNG compression is about 5–25% better than GIF compression, GIF images are now mainly used only if the image contains animations.

### GIF ### images support transparency by declaring a single colour in thecolour palette as transparent (index transparency). Because of absence of partial transparency, the edges (specially rounded or too-detailed edges) get a poor jagged effect. Though this can be solved to some extent using dithering, with improved PNG support, GIF is unsuitable for images with transparent backgrounds.