How to resolve image quality issues

The resolution of the image affects how clearly it is displayed. We recommend that images be between 72 and 150 DPI. 96 DPI is optimal.

You can use tools such as Photoshop, MS Paint, or GIMP to check the resolution of an image. 

To check an image's resolution in MS Paint:

1. Open your image file in MS Paint.
    
2. Navigate to File > Image properties.
   
   The DPI is displayed next to Resolution.
   
   

If your image is lower than 72 DPI, then it is advisable to recreate or enhance it in a tool like Adobe Photoshop.

If you have access to Adobe tools, you can use Adobe Illustrator and Adobe Photoshop to increase the DPI/PPI value of an image. This increases its sharpness. 

To edit an image with Adobe tools:

1. Open your image in Adobe Illustrator and select it on the canvas.
    
2. If your image is a PNG or JPG, select Image Trace in the Properties panel, then select Default. 
   
   
   _{Select Image Trace.}  
    
3. Open the Object menu and select Expand.
   
   
   _{Select Expand.}  
    

4. Open the Object menu and select Make Pixel Perfect.

   NOTE: This may not be suitable for thinner taglines. If your image looks strange, undo this setting.

   
   
   _{Select Make Pixel Perfect.}  
    

5. Select the whole canvas and open the right click menu, then select Collect for Export > As Single Asset. This opens the Asset Export window.
    
6. [Optional] Enter a name for your asset by selecting the text following the thumbnail image. 
    
7. Under Scale, select the arrow to open the drop-down, then select Resolution. 
    
8. Enter a value in PPI in the text field. We recommend a value between 150 and 300 PPI. 
    
9. Select the thumbnail image, then select Export to save your image to your device. 
   
   
   _{The Export window with PPI values set.}  
    
10. Open the exported image file in Photoshop. 
     
11. In the Layers view, open the right click menu for the image layer and select Convert to Smart Object. 
     

12. Open the Image menu, then select Image Size... 

    NOTE: You may notice that your image has doubled in size. This is normal, as the export from Illustrator is as a high-resolution image.

    
    _{The Image Size window.}
     

13. Enter your required pixel values in Width and Height. 
     
14. Select Ok.
     
15. Export your new image as a PNG for use with Exclaimer. 

Enlarging or reducing the size of images will also reduce the quality of the image. Images may appear pixelated.
 
To prevent this issue, make sure your image files are the same size that you want to display at when you upload them - for example, if you want your image to display at 100x100px, then create or resize your image file to be that size.

Check your image dimensions:

1. Right-click on your image file and select Properties (Windows devices) or Get info (Mac devices).
    
2. Open the Details tab (Windows) or More info (Mac). The image size in pixels is listed in Dimensions.
    
3. In the Signature Designer, open your signature and select the image. Expand the Size menu in the Properties pane. The values under Width and Height are the image size in pixels.
    
4. If the dimensions in your signature template do not match the dimensions of the original image file, re-upload an image with matching pixel values.

PNG is a lossless image file format designed for transferring images on the internet and is an ideal format for use within email signatures. PNG also supports transparency, making it ideal for use with company logos and other graphics in your signature. Save your image as .png to use the PNG format.

Some high-resolution devices, such as those using Ultra-HD or 4k display output, automatically resize images to fit the screen. This can then affect the quality of the content. 

The best way to make images look better on high-resolution displays is to create them at a larger size. However, this can have an opposite effect on devices with lower resolution displays. Similarly, a widescreen HD display will have a different output to a small mobile device, for example. 

Consider what type of displays you want to optimize your images for when creating and uploading them. There is no one way to maximize quality on every type of possible display. 

If you render your signature or signature content as a bitmap, it becomes a bitmap image that can be affected by quality issues when displayed.

If you use custom fonts or background images in your signature, your signature will automatically be rendered as a bitmap. This is to ensure the font and/or image can be displayed across all devices.  To avoid rendering your signature as a bitmap, use font stacks instead of custom fonts and remove background images. 

For instructions on using font stacks, see How to use font stacks in Exclaimer.