![]() |
Building a better web site ... Questy's, Graphics on the web |
|
Graphic Formats Vector graphics refers to software and hardware that use geometrical formulas to tell a program how to draw the picture on the screen. Vector graphic files are generally very small compared to bitmapped graphics. Vector graphics are usually generated from combinations of simple geometric shapes that are filled with colors. Almost all sophisticated graphics systems, including CADD systems and animation software, use vector graphics. In addition, many printers (PostScript printers, for example) use vector graphics. Raster graphics refers to an image created by using grid mapped bits, hence it is also called a bitmap graphic. Web graphics are various types of bitmap graphics. Each square is one pixel or dot on the monitor. The dots are small enough so individual pixels are not visible, and the human eye responds to the big picture. The density of the dots, known as the resolution, determines how sharply the image is represented. This is often expressed in dots per inch (dpi). Bitmapped graphic programs like PhotoShop and Paint Shop Pro give the user complete control over the color of every single pixel in the entire picture. Graphics pertains to any computer device or program that makes a computer capable of displaying and manipulating pictures. Web Graphics vs. Print Print
graphics is usually based on quality of image, Web graphics size is the
major issue. Using Graphics on the Web Keep graphics as small as possible. The smaller the graphic, the faster it will appear on a reader's screen. The fewer colors you use, the smaller your graphics will be. Windows computers display 96 dots per inch (dpi). Macintosh computers display 72 dpi. So saving your graphics with a resolution higher than 96 dpi is overkill and will just make your files larger and take longer to download. Understanding Pixels. Graphics on your monitor are made up of individual dots of color known as Pixels, short for Picture Element. Graphics monitors display pictures by dividing the display screen into thousands (or millions) of pixels, arranged in rows and columns. The pixels are so close together that they appear connected. Many people are viewing the Web at a resolution of 640 by 480. Creating graphics wider than 640 pixels or taller than 480 pixels means they won't display completely without the reader having to scroll. The number of bits used to represent each pixel determines how many colors or shades of gray can be displayed. For example, in 8-bit color mode, the color monitor uses 8 bits for each pixel, making it possible to display 2 to the 8th power (256) different colors or shades of gray. On color monitors, each pixel is actually composed of three dots -- a red, a blue, and a green one. Ideally, the three dots should all converge at the same point, but all monitors have some convergence error that can make color pixels appear fuzzy. Image
Resolution is an important concept to consider in designing web graphics
for one simple reason, regardless of how well you design a graphic, in
the end the user's monitor determines the final output of the image. The
quality of a display system largely depends on its resolution, how many
pixels it can display, and how many bits are used to represent each pixel.
VGA systems display 640 by 480, or about 300,000 pixels. In contrast,
SVGA systems display 1,024 by 768, or nearly 800,000 pixels. True Color
systems use 24 bits per pixel, allowing them to display more than 16 million
different colors. |
|
|
|
![]() |
Welcome
to the World of Questy |