Mobile app version of vmapp.org
Login or Join
Cofer715

: Image text showing blurry on website Designed a banner for my website. 2120 x 550 is the resolution that I need. It looks ok for normal view. When I upload it to my website, Image text showing

@Cofer715

Posted in: #AdobePhotoshop #WebFonts

Designed a banner for my website. 2120 x 550 is the resolution that I need. It looks ok for normal view. When I upload it to my website, Image text showing blurry. Any solution?

Working example alpeshdabhi.me/osc/

10.02% popularity Vote Up Vote Down


Login to follow query

More posts by @Cofer715

2 Comments

Sorted by latest first Latest Oldest Best

 

@Dunderdale640

The image you link to is a JPEG saved with quality 75 which is not enough for text. As a consequence the text is littered with JPEG compression artifacts that makes it look blurry.

If this is how you saved it, then increase quality (at least 85). But the RIght Thing To Do would be to is have a text-less background image with text added over it using HTML. This lets you compress the background image without compromising the text quality.

If you saved it at a higher quality and if the website is managed by someone else, start by saving the file directly from the web site and compare to yours (size in bytes, in particular). It is not unusual for web sites to re-compress images, and the text is the first to suffer from this.

Another possibility is that the HTML of the website is constraining your image to a size that is not its native size. When this happens the image is rescaled on the fly by your browser and this can impact text (likely not the case here, but nevertheless frequent enough to mention).

10% popularity Vote Up Vote Down


 

@Debbie163

In Photoshop, export for web > JPG.
Set 2-Up and play around increasing and decreasing Quality. Look for the lower point where quality seems good enough for you, where the difference between original and exported JPG isn't significant.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme