Create a High-quality Professional Email Signature in Photoshop & Easily Fix Blurry Images

In this video, I will show you how to fix blurry email signature images. Screen resolution (72 dpi) images often appear blurry on modern devices with retina or higher density displays. This video has some quick tips on how to optimize your images and keep them looking sharp and crisp on all devices.
Make sure your final signature is 400px or less to be most compatible across all devices. When designing your signature, start with a higher resolution than your final signature size.

[@asif8208]

thanks miss. it's worked for me.

[@rubenlopezusa]

This is good for only pictures, but what if the signature is a combination of picture, text, and hyperlink, and you don't want to convert the whole thing into one picture for not losing the hyperlinks?

[@salparadise4212]

Hey Ashley - first of all, THANK YOU for this video! I'm pretty new at this kind of stuff and I've been tasked with making email signatures for my company and this video was the first one that actually helped. Using this method in your video, the images in the signature look great on my MacBook screen. BUT when I open the same exact signature on the monitors at our office, they appear blurry. I'm assuming this has some something to do with the display settings of the monitors, which I've tried to adjust but with no success. Is there ANYWAY I can get them to look clear on both? The first initial save of my splices I do at 384x164 px (96ppi - because after other research I've found, this is the resolution that Outlook uses?) The next save I do, to enhance the image quality, I do 768x327 (192ppi) - do you know why this still appears blurry on the desktop monitors? SIDENOTE: If I were to just leave the images at the initial saves resolution and size (96ppi), they look clear on the desktop monitors BUT blurry on my Mac.

[@ashleycam3ron]

I usually save out 2x the resolution and in PNG, which tends to be clearer than JPG.

[@asif8208]

this happens to me also

[@asif8208]

I have a png signature and I convert in into html in Photoshop. I looks sharp on desktop but in mobile in Gmail in looks little bit blurry. why? how can it be resolved?

[@kwclmmarketing186]

WHen I do that last step with improving the images, I open up that file in finder and a bunch of coding pops up instead of the image.

[@rebecca-woods]

The same thing was happening to me and then I realized I had to select the actual images folder to replace the PNG image file (not replace the HTML). Now, I just have to figure out how to put this HTML into the signature?? So, I got as fas as she shows, but not sure how to put it in the actual signature. :( Ashley...can you help with that?

[@RedNovaCreative]

how do you add the links to the Social Icons?

[@HaiderAli-l8g]

How can I sent it to the clients

[@oberpullendorf]

Hey Ashley, how do you convert the text to live text then?

[@ashleycam3ron]

Hello! I replace the image tag in html with the live text and style with inline CSS

[@RedNovaCreative]

what does that mean lol, would love to see how you do that. Cheers, Thanks for the great content. @@ashleycam3ron

[@ashleycam3ron]

@RedNovaCreative you'll need to open the html code file in a text editor. Find the image you want to replace with text. Delete the image html tag and type in your text in that and then style using inline css. So... it requires some knowledge of html & css

[@ecomodyssey4255]

How do you upload this to gmail?

[@ashleycam3ron]

You will need the signature on a live web hosting server that you can copy the html path location of the image file or coded signature.