How to get the best results from your website and email images. Image SEO How to get the best results from your website and email images.
The DAM and File Formats The DAM is simply a library offering images in various formats: .jpg, .png, .gif, .eps, etc. Websites and email will only display images in .jpg, .png and .gif file formats. Print formats such as .eps and .ai are “scalable” formats, which means you can enlarge or reduce the size of the image without losing quality. If your software will not open these formats you can ask a designer to convert the image for you. 6/28/2017
Using Images in Digital Apps The DAM, content management systems like Drupal, Sharepoint, or email applications like Click Dimensions do not have the ability to convert image size or file formats for you. Changing image file extensions in Windows Explorer results in distorted, poor quality, unusable images. Converting image formats and/or sizes requires image editing software. 6/28/2017
Image Naming for SEO The image name should be descriptive of the image contents Image name should contain a keyword that is relevant to the surrounding content. Avoid numbers and words in the image name that mean nothing to the end user or search engines Use – or _ between words in an image name instead of spaces. All these points are also good advice for PDF titles 6/28/2017
Optimum Image Size for SEO Why is sizing images before using for a website so important? Large images slow down the page load time Slow page loads result in increased bounce rate Users will leave your site if the page loads too slowly! Images should be no larger than the largest width that is displayed in the site design. 6/28/2017
What Size Should I use? Images used for print or downloaded from digital cameras are usually 300 dpi. Images for digital use should be no more than 72 dpi. Sizing images larger can cause pixelated or blurry images unless done while decreasing the dpi. Sizing images for dpi, then width at the same time will result in quality images with smaller file sizes. The image should be sized to the widest width used in the design, measured in pixels 6/28/2017
Same Image Used Twice? If an image is used in two places, for example, a “thumbnail” view in a list that is linked to a larger image on the detail page, you can use the larger image size and use html to restrain the thumbnail width. If you need to also provide a full sized printable image, it can be offered as a link that only loads when the link is clicked. That way it will not show down load time. 6/28/2017
Image Presentation for SEO Image HTML should contain an “alt” and a “title” tag. ALT tags provide alternate information for search engines and screen readers. It should include a description of the image and keywords from surrounding content. TITLE tags are similar to ALT tags, but are not crawled by search engines Browsers display the TITLE tag or the ALT tag when you hover over the image – different browsers use each When images are not yet loaded or cannot be shown these tags provide an explanation of the image. 6/28/2017
Summary: Using Images in Digital Applications Locate image on DAM and download to your local PC Open image in an image editor and save it with an optimized image name Resize the image to the correct size and dpi. Do not increase the size of the image unless you are reducing the dpi at the same time. If image is not .jpg, .png, or .gif, convert the file to one of these on save using the image editor’s ‘Save as’ feature. Do not change the image file format if it is already one of the compatible formats. Upload image to website using content management tools Insert image into website, including ALT and TITLE tags
Want to learn more? Download This PowerPoint Presentation: Image SEO Image Optimization (PDF Document with more detail) Donna Smith, Web Developer, donna.smith@boehringer-ingelheim.com 6/28/2017