iPad background image resizing

Question

I have a rather large image and when I view it on an iPad it scales really small, I did a little research and discovered that I needed to add in a background size which I have done but the image looks all fuzzy and not as sharp as I'd liked. I have tried splitting the image up but it's not working as my image is a load of people's pictures and I have already set up the background positions. Is there anyway I can make the image appear clearer than what it is? Thanks in advance.

The image is 11025px x 348px.

.box .image {
    background:url('../images/images.jpg') 0 0 no-repeat;
    background-size:11025px 348px;
}

Answer 1

There is your problem right there: iOS Resource Limits

Taken from the guide:

Because of the memory available on iOS, there are limits on the number of resources it can process:

• The maximum size for decoded GIF, PNG, and TIFF images is 3 megapixels for devices with less than 256 MB RAM and 5 megapixels for devices with greater or equal than 256 MB RAM. That is, ensure that width * height ≤ 3 * 1024 * 1024 for devices with less than 256 MB RAM. Note that the decoded size is far larger than the encoded size of an image.
• The maximum decoded image size for JPEG is 32 megapixels using subsampling. JPEG images can be up to 32 megapixels due to subsampling, which allows JPEG images to decode to a size that has one sixteenth the number of pixels. JPEG images larger than 2 megapixels are subsampled—that is, decoded to a reduced size. JPEG subsampling allows the user to view images from the latest digital cameras.

The background size won't help you much when the system scales your image back to 5512 x 174 pixels.