Click here to connect to United Way!

Image Resolution in Web Design

 Home
 Web Design
 Collages
 Graphics
 Flyers
 Enhancements
 About Us
 Human Interest
 Local Information
 Web Site Layout Tips
 Writing Web Content
 Increase Web Traffic
 Web Images
 Image Resolution
 Website Keywords
 Resources & Links
 Terms
 Contact:  
 webmaster@infiniterealm.org


Resolution can be difficult to understand.  The following is a basic overview about resolution that may answer some of your questions about resolution.



DPI or Dots Per Inch

DPI, or dots per inch, describe printer resolution. These are the actual number of dots that can be printed per inch.  600 DPI is pretty much standard for most printers these days, while older models may still offer only 300 DPI.  Higher DPI gives a clearer and smoother appearance to the printed picture.



PPI or Pixels Per Inch

PPI or "Pixels Per Inch" refers to your monitor, which sees everything in pixels per inch.  The majority of monitors will display graphics at 72 pixels per inch, so if your graphic is 72 pixels by 72 pixels, it's actually one inch by one inch.

800 x 600 and 1024 x 768 are the most common monitor viewing resolutions. When building a web site you should always view your pages at different resolutions to get a good idea of what others are seeing. I keep my monitor set at 800 x 600 because it's easier for me to read, but now that larger monitors are commonplace, many people prefer the higher resolutions, which allow them to have more than one window open at the same time.

Our monitor screens show pixels directly. Images are dimensioned in pixels, and screens are dimensioned in pixels


SCANNING

A digital image is composed of pixels, which are the small colored square dots that can be seen when images are enlarged too much. Resolution is the number of pixels wide by the number of pixels high. A picture with 1200 pixels wide and 1500 pixels high would have a resolution of 1200 x 1500 pixels.  When scanning, it's important to remember that you should only scan at the highest resolution needed for which the photo is to be used.  If you plan to only use the photo for online web use, then scan it at 72 DPI. If you'll use the photo for printing, then scan it at 300 DPI (or higher if you have the ability). Scanning at higher resolutions than needed only leaves you with large files that you'll have to scroll your way around

Here's a good rule of thumb for scanning:

Inches scanned x resolution used = Image size in pixels.

The image size you want depends how the image is to be used. You should scan at whatever resolution is required to create the desired image size from the inches you have to scan. The higher the resolution, the bigger the image, and the bigger the image, the more hard drive space it takes up, as well as needing more memory to load or open. A 300 dpi 8.5x11 inch color image is 25 megabytes!

On the other hand, the higher the resolution, the better the image looks when printed and the more resolution you have when you start your project. If at all possible, save the scanned image as a TIFF file and make a copy of it for working on, keeping the TIFF in a safe place. This way you'll always have the original to fall back on.


(6 inches x 110 dpi) x (4 inches x 110 dpi) = 660 x 440 pixels
will nearly fill a monitor screen whose resolution is set at 640 x 480.


(6 inches x 140 dpi) x (4 inches x 140 dpi) = 840 x 560 pixels
will nearly fill a monitor screen whose resolution is set at 800 x 600.
 

(6 inches x 180 dpi) x (4 inches x 180 dpi) = 1080 x 720 pixels
will nearly fill a monitor screen whose resolution is set at 1024 x 768.



ABOUT RESIZING

Resizing an image to make it larger doesn't usually work well. If you were to tell your graphic editor program to make the image larger it will leave you with what is called a "pixilated" picture. This means you've made the existing pixels larger, which will very likely make the picture look blurred. This means you changed the size of the image, but didn't change the resolution.



ABOUT RESAMPLING

Resampling doesn't change image resolution, but instead changes the pixel dimensions. 

Keep in mind that resampling can result in poor image quality.  When you resample an image to larger pixel dimensions, the image loses detail and sharpness.  Scanning at higher resolutions should eliminate the need for resampling.

Many Software programs offer (in my experience) the options for resampling an image and many are the  graphics programs available.

 
 Paltalk
Paltalk
A state of the art  program that allows you to see & speak with people all over the world. You can create your own forum rooms with particular audience content and secure them from unwanted visitors. Talk, play Music, sing, or run your business. Best of all  the basic software is FREE!! This is the Worlds best Chat program including text video and sound. You got to see this to believe it. Warning: Paltalk can be highly addictive and you may end up making friends with people of every tribe people and nations. Many categories and features. Formally known as Firetalk.

Ready for some fun? Open up the site a bit by clicking  HERE and see animations, hear music, see videos, images, and download games, etc. Otherwise stay with the calm & quiet menu options to the upper left. Enjoy!!

 

 


© Copyright 1992-2006 Infinite Realm Computer & Music Services, All Rights Reserved

The many thoughts of

Grant A. Normandin CEO