Why is my website logo blurry?

Forum|Forum|11 years ago
January 25, 2015
2 replies
43545 views

I saved this file as a png in illustrator , don't understand why my logo is so blurry. It doesn't look clear to me, what am I doing wrong? Is it something to do with how I'm saving It?

Visit my site and you will see on the top left the logo blurry and not a high quality resolution.

http://rawadmerhi.com/

This topic has been closed for replies.

Jacob Bugge

Community Expert

Rawad,

In addition to what Ned said, you have to decide (or be told) the final pixel x pixel size first, and then create the PNG at that exact size (or potencies of 2 larger). Otherwise, the resizing will make a mess.

R

raiden92Author

Participating Frequently

Alright I will try that Jacob, thanks.

Edit: I just created a new document that is 160px by 40px. Placed my logo on that document and saved it, yet It's still blurry .

R

raiden92Author

Participating Frequently

Your logo is very small on your website. So there just aren't enought pixels to display it sharply. And that's it.

If you want it to look sharp, you need to eliminate anti-aliasing. That is: save a raster image and then edit it in Photoshop so it suits your needs. Then embed it in your pages, but don't scale it. That is: if your PNG is e.g.160 x 50 pixel, you need to use exactly that size in the HTML code.

I found a solution. All I do is save it as an svg file

Ned Murphy

Legend

If you are resizing the image from its actual size then it is likely to lose clarity. Based on downloading the image it appears you might be enlarging it slightly on the web page.

R

raiden92Author

Participating Frequently

Nope I'm not enlarging it at all, I'm just saving the image how It is as a png and it's coming out blurry.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded