Graphics
Images in Web pages are relatively low resolution. Monitors usually display images at about 72 pixels per inch. In contrast, most desktop printers now print at 300 dots per inch or more.
Images Are Made Of Pixels
Image Size
Larger images simply have more pixels.
- The actual size of the image on the screen depends upon the screen resolution the display monitor is set to.
- You control the size of an image, relative to other elements on the page, by making it with more or less pixels.
- The fewer pixels used to depict a specific object, the lower the resolution.
|
Size
|
Example
|
Resolution
|
|---|---|---|
| 250 by 250 pixels |  |
 |
| 100 by 100 pixels |  |
 |
| 40 by 40 pixels |  |
 |
Looking Sharper Than It Is
Web graphics often are designed to look like they are sharper (have higher resolution) than they actually are. This is done with a technique called "anti-aliasing", which blurs an edge across several pixels to avoid jagged edges and to suggest detail that really is not there.
|
Type
|
Full-Size
|
Close-up
|
|---|---|---|
| Without Anti-aliasing |  |
 |
| With Anti-aliasing |  |
 |