Pixels, Pallets and Other Pesky Details
Pixels Not Inches or Centimeters
Pixel, one of the individual dots that make up an
image on your computer. For example, if your computer
monitor is set to 640-by-480 mode, you can see up to 640
pixels across and 480 pixels down. Images are created by the
program setting each individual pixel to the correct color.
Most people have their computers set to 640-by-480, so
that is the size you should design your web site for. Why is
that important? Because if you make your site 1000 pixels
wide, visitors will have to scroll to the right just to see
everything - and most don't think to scroll to the right.
A web site designed for 640-by-480 works out to be
(safely) 600 pixels wide and 400 pixels tall. Why smaller?
Because the browser itself takes up valuable screen space,
along with any other "always visible" items they
may have running. Your site can always
be longer - visitors do know to scroll down the page.
Get yourself a few sheets of graph paper and draw out a
box that is 60 squares wide by 40 squares high. That is your
sketch screen for your site with each square equaling 10
pixels by 10 pixels. If you want a header on the top
of the page, you can draw it in and get a good idea how much
space it might take up. If you plan to have a photograph on
the page that is 320-by-240, after blocking it out on your
grid, you can see you have very little space left.
Play around with your ideas, making new sketch screens as
you need them. Eventually, you'll figure out a layout you
Now, it is time to learn about the great mystery of color