full size images not displaying
-
I upload images to my media library, and they appear just fine as thumbnails in a post. When I click on them, the full size image doesn’t load and I get and error message. “The image [image] cannot be displayed because it contains errors.” One of them worked when I saved a new copy and uploaded it again, but others won’t. I haven’t played with any code on the site, so I at least know it isn’t my fault…. Any ideas?
The blog I need help with is: (visible only to logged in users)
-
We need a link to a post where this is happening. The images on the main page of the blog linked to your username work just fine for me.
-
Sorry. I hadn’t gotten to posting the piece yet.
Here: http://trainergary.wordpress.com/2011/01/08/fridge-art/
-
-
No wonder. Those images are 9.3MB and 9.8MB respectively. A large version of an image should never, ever be over 2MB, and it is far better if they are under 500k.
You need to look at the following links and learn to optimize your images for the web. Having two images that size on your blog will get your blog tossed down into a bottomless pit by search engines since they consider blog page sizes and loading times when determining search engine ranking.
http://en.support.wordpress.com/media/image-optimization/
http://onecoolsitebloggingtips.com/2008/04/22/image-editing-and-preparation-tips-part-1/
http://onecoolsitebloggingtips.com/2008/04/28/image-editing-and-preparation-tips-part-2/ -
One other thing I’ll mention is that you always have to think of your visitors. A good portion of web users are still on connections at 1.5Mbps (bits, not bytes) or less which means if they click on one of those two images it might take 5 minutes or so for it to load. With the short attention span of people on the web, they are certainly NOT going to wait around for it to load. They are going to click away and go elsewhere.
-
Oh, wow. I guess I didn’t think about that. Now that I look at it, I see that the other two are much smaller, though I’m not sure why. Thanks, though. I’ll see what I can do!
-
-
One other note, for images that are going to be within posts, but not linked to a larger version, I would optimize them down to under 75k so that your pages load faster. If you are going to upload a larger image and then have a thumbnail or smaller version in a post, I would really suggest keeping them under 100k, 300k at maximum. Since over 40% of people are still on monitors with 1024px x 768px resolutions, I would also suggest optimizing images for a maximum width of 1000px. That way they will not have to scroll to see the whole image.
-
Okay, I saved them as JPEGs, and that got the files down to 2.07MB and 2.08MB. I figured it would work, but it still doesn’t. I read through your post (which is very helpful), but what I would like to know is what the best way is to shrink these files even more. You have posted since I have that downsizing the images would be beneficial to the browser, but will that be enough to affect the file size significantly enough to make them blog ready?
-
-
There is something seriously wrong with those images. Both of them killed my browser before they were over 25% done loading and my browser never dies.
What program are you using to optimize and/or edit them?
-
I made the originals in Photoshop, but I’ve just been saving them out as JPEGs with the default settings. The top two pictures are PNG, which may help explain the crashing. I did it to myself, too. I’ll be switching those to JPEG However, I have kept all of the images their original sizes (noticeably large), but I am going to resize them to the 1000px you recommended before.
-
Woah… all of a sudden the bottom two images actually work. I’m still going to make them smaller, but I don’t know why they work now when they wouldn’t earlier.
-
On the file menu, if you are using CS3, 4 or 5, there is a “save for web and devices.” use that when saving images for the web and it will automatically optimize them for you considerably. At top right of that window you can even adjust the amount of compression and at lower left see the approximate size the image file is going to be when saved.
-
The thing that is confusing me is why the images were killing my browser (Safari) when I tried to view them.
The thing that could be happening is that when you save through the normal save as option in Photoshop is that the image is not getting saved in the sRGB colorspace. Typically it will be saved in the original color space which might not be sRGB.
-
Possibly. I’m not sure if I used CMYK or RGB settings when I made it. I was moving between my computer and my school’s computers, so who knows? Anyway, I used the Save for Web and Devices, and everything works wonderfully now. The upload speed was much nicer, too. I appreciate all of your help with this. If you figure out why that image made your browser crash, I would be interested to hear about it. This will probably save me loads of trouble in the future. Thanks again!
-
-
Just tried the image and it showed up in a flash so it looks like it was either the size of the image, or perhaps something could have been corrupted, but it is working great now.
Glad to have been of help.
- The topic ‘full size images not displaying’ is closed to new replies.