There are two ways we describe an image:
Low Res - Low resolution, 72 dpi (dots per inch).
High Res - High resolution 300+ dpi
Most websites are designed with low res images. It helps them run faster. High res would just slow down the website and cause things to take forever or not load at all. The only time high res images should be used is with print design. If you print with the low res images, you will have a blurry or pixelated image.
With that said, it is better to give us high resolution images to create the website. I know you’re thinking, “but you said websites are built with low res…”
There is a saying we use in the business: “crap in, crap out”. Sounds harsh, but it is the truth.
If we start with a low res image and have to manipulate it and make it bigger for flash applications or as background images it will be blurry and pixelated. If we use the high res, we can manipulate that, then save it as 72 dpi and it will be clear on the screen. With high res you can always reduce but you can’t always blow up a low res.
Screen resolution refers to the number of pixels a screen can display within a given area. Screen resolution is usually expressed in pixels per linear inch of the screen. Most personal computer displays have resolutions that vary from 72 to 96 pixels per inch (ppi). The resolution of the display screen is dependent on how the monitor and display card are configured, but it’s safe to assume that most users fall into the lower end of the range, or about 72 to 80 ppi.
Images for Web pages are always limited by the resolution of the computer screen. Thus a square GIF graphic of 72 by 72 pixels will be approximately one inch square on a 72-ppi display monitor. When you are creating graphics for Web pages you should always use the 1:1 display ratio (one pixel in the image equals one pixel on the screen), because this is how big the image will display on the Web page. Images that are too large should be reduced in size to a resolution of 72 ppi.
There are times you can send us a low res image to use and it will be ok, but the actual size of the file measurements need to be large.The best way to explain it is: If you open the image in the browser and it is so big you can’t see the whole thing.. most likely we can use it and manipulate it. If you open it and it shows up small like only an inch or two.. we can only use it in a small area on your site.
So when you look at an image that you want to use, think about the resolution.
Thank you for your complete information, But I have a question, why do we see some picture that appears in a website little by little but in some cases we see them after a few moments and in a time???
Thank you.
Hello Hossein, Image resolution and file size can play a role in how the image is displayed on a screen. Things like connection type ie., dsl, cable, dial-up can effect the amount of time it takes for an image to display properly on a screen as well.
I have noticed a lot of websites created by inexperienced designers and small web site design companies that use frontpage where they have used a very large image and manually resized the image for use in the website rather than resizing the image with a photo editing software program such as Adobe Photoshop to gain the desired size. This is the most common problem with websites designed like the one you are describing above. If you are referring to your own website, please contact me today and I would be glad to take a look and give you recommendations for free.
Delaware.Net, Inc.
(302) 736-5515 ext.126
Have a great day.