If you’re new to creating images, video, and other multimedia for the mobile web, understanding the concepts behind terms like color depth and resolution can help you as you start creating mobile site designs. Color depth refers to the number of colors a screen can display, most commonly referred to by the number of bits.
Screen resolution
Hand in hand with color depth, screen resolution affects how crisp and lifelike images appear. As you might expect, the screen resolutions on mobile devices are nowhere near as large as they are on desktop or laptop computers.
Most new LCD monitors or laptop displays have resolutions of at least 1920 x 1080 pixels, and more expensive displays are even higher.
The iPhone is tiny by comparison. The original iPhone display (from the iPhone 1 to the 3GS) is 480 x 320 pixels, which allows it to play the vast majority of videos on YouTube in a resolution that makes them look reasonably crisp on the screen, but doesn’t come close to what most consumers expect from a television screen.
In contrast, the iPad offers a high-resolution display that is 1024 x 768, more than enough to make watching video on the iPad an enjoyable experience. As you prepare your images and videos, consider the different screen resolutions of the iPhone and iPad.
Pixels per inch
Another important factor is the number of pixels per inch (ppi) in an image or a video. Most computer monitors display images at 72 ppi; newer models display 92 ppi. The iPad displays 132 ppi, and the iPhone 4 has a resolution of 326 ppi. Remember that the more pixels per inch, the more detail in the image and the better it appears.
The reason that the display on the iPhone 4 has garnered so much attention is that its images are as crisp and sharp as the human eye can detect. A high-resolution image on an iPhone screen probably looks better than most other images you’ve ever seen on a digital display.
The pixels per inch (ppi) measurement is different from dots per inch (dpi), which is a common way to measure print resolution, because printer quality is measured in dots per inch. Pixels per inch is used as a measure of the resolution of a computer display.
Researchers generally agree that the average human eye can discern, at a distance of one foot, improvements in quality at as much as 300 ppi. That is, if you increase the number of pixels per inch at a normal reading distance higher than 300 ppi (such as with the iPhone 4’s retina display), the eye can’t detect any increase in quality.
In theory, that means you should optimize your images at 300 ppi, but in practice that creates such large file sizes they would take a prohibitively long time to download, especially over a mobile connection.
It may be time to increase the recommended ppi for web graphics — it’s always been 72 ppi because that’s all anyone would see on a computer monitor anyway. But these days, with increasingly high monitor resolutions, you should increase your images to at least 92 ppi, and 132 ppi if images are a key part of your web design and you know your visitors use high-speed connections.
dummies
Source:http://www.dummies.com/how-to/content/screen-resolution-and-color-depth-on-handheld-devi.html
No comments:
Post a Comment