Header Image Has Low Resolution (Sketch Theme)
-
I use a high-resolution image on the Sketch theme for the header image but it appears as a low-resolution image. Why does this happen?
The blog I need help with is: (visible only to logged in users)
-
Hi @richiesauls,
I have visited your site, but do not see a header image – have you removed it since you created this topic? If so, and if you still would like to use that image, can you provide a link to it, or more information about its dimensions?
The Sketch theme description says “Custom header image should be at least 1092 in width” – is your image at least that wide?
-
Hi @jennysihua,
I have not put up the header since its quality is simply too low as a result of this issue. Even if I upload an image to the exact dimensions as specified, it still displays in low quality.
I am baffled.
-
Compare this screenshot of what happens to an image after it is uploaded to the original image.
-
As you can see, the compression is simply too high. It may simply be that the theme overcompresses the header, which is unfortunate.
-
Hi @richiesauls,
Thanks for the screenshots.
Is your image a JPG or PNG file? PNG supports lossless compression, while JPG does not. If your file is JPG, then I would suggest saving it as a PNG using photo editing software, then reuploading to see if the quality improves.
Let me know if that helps!
Jenny
-
That was one of the first things I tried and there is no real improvement. I may need to look at another template. What a pity. Thank you for your suggestions, I appreciate you taking the time to respond.
-
Hi @richiesauls, I activate Sketch on my test site and added and cropped a header image, and compared it with the original and see very little difference. Can you post the link to the image you were trying to use so that I can test that in my test site?
-
Many thanks for the link. I uploaded that image to my Media Library, activated Sketch and then set that image as a header, and it looks every bit as good as the one on drop box. There is a very slight difference in the small text when I open the image in Preview on my Mac vs what is showing on my test site, but the difference is minimal. You can take a look if you wish here: https://flippintestblog.com/
Hopefully I have not switched themes or changed configuration by the time you look. :)
-
Thank you, I have looked at the upload. Unfortunately, the theme compresses the image too much, it is very blurred compared to the original. I am investigating other solutions to have more control over image quality, etc. Again, thank you all for your help, I appreciate it very much!
-
You are welcome. I don’t see much difference on my system from the original, but it could be that the image that was sent to dropbox got downgraded so what I’m seeing when I insert it doesn’t look that different from the original. Generally if the image matches the size suggested on the Theme Showcase page, there is little to no difference. There is that balance that we try and achieve between a very high-resolution image and file size so that the image loads quickly and you aren’t penalized by the search engines or by slow site loading times. Generally web images are 72dpi. If you upload an image to your site, and want it the highest resolution on hight dpi screens, such as Retina Macs, then prepare and upload the image at 144dpi. That typically works quite well.
- The topic ‘Header Image Has Low Resolution (Sketch Theme)’ is closed to new replies.
WordPress.com Forums 
