|
Graphics
Produce Images that
will Load Quickly
Since users need web pages to load quickly,
you should make your image files small. Because GIFs are
usually smaller than JPEGs, try to use GIFs whenever possible.
Use Colors that
Succeed on a Variety of Platforms
To make your colors look good on a variety of
platforms and monitors, design your images using a cross-platform,
browser-safe color palette comprised of 216 colors (sometimes
referred to as a Web safe color palette).
Save Images at an Appropriate
Resolution
Because few monitors display images at
resolutions greater than 72 dpi, you will want to limit the
resolution of your web images to 72 dpi. A higher dpi ratio will not
produce better image quality on most monitors and will increase file
size, causing each page to load more slowly.
Use alt Text For
All Images
Use alt text to provide users a short
description of images. Alt text:
- provides vision impaired users access to
your content (screen readers read the descriptions)
- helps sighted users determine whether they
want to wait for an image to load
- enables users to read a description of a
linked image and take the link before the image loads
Use alt = "" for images that do not
convey important information or convey redundant information. The
alt tag without text informs users with screen readers that there is
a picture for which a description is unnecessary.
Reduce the Size of
Image Files
Color-rich images tend to be large. Make
images smaller by reducing the size of the color palette. If you
make the color palette too small, the image will become too
degraded. The goal is to make the file as small as possible while
still retaining sufficient image quality. The JPEG image on the
right is a little less rich in color and detail, but less than half
the size of the JPEG image on the left.
 |
size:
8.4K |
 |
size:
3.4K |
|
