{"id":2405,"date":"2016-02-16T14:11:15","date_gmt":"2016-02-16T14:11:15","guid":{"rendered":"https:\/\/www.searchenginewatch.com\/2016\/02\/16\/how-to-optimize-images-for-seo\/"},"modified":"2019-11-05T17:13:25","modified_gmt":"2019-11-05T17:13:25","slug":"how-to-optimize-images-for-seo","status":"publish","type":"post","link":"https:\/\/searchenginewatch.com\/2016\/02\/16\/how-to-optimize-images-for-seo\/","title":{"rendered":"How to optimize images for SEO"},"content":{"rendered":"

There are many ways to make your articles easier to read on the web – lots of paragraph breaks, short snappy sentences, headings, sub-headings, Gifs of Kanye West\u2019s mood swings – but one of the key ways to make your content look attractive is by using lots\u00a0of lovely images.<\/strong><\/p>\n

And the best thing about images, is that they can be used to bring in organic traffic via search engine<\/a> image results.<\/p>\n

But in order for this to happen, they need to be optimised accordingly.<\/p>\n

Here\u2019s a guide to make you aware of the key things you need to be doing when it comes to uploading images to your site, which\u00a0a surprising number of people often ignore.<\/p>\n

Choosing images<\/h2>\n

It’s important to use images related to the text of the article. This is mainly from a user experience point of you, as you don’t want to baffle people with an obtuse choice of image.<\/p>\n

\"black<\/a><\/p>\n

Cute, for sure, but Otis doesn’t belong here (although try telling him that).<\/em><\/p>\n

Your images need to be of a good quality, in the correct aspect ration, with good resolution and of a size large enough to be visible across devices.<\/p>\n

Another thing to consider is your use of ‘stock-photos’.<\/p>\n

We introduced a strict \u2018no stock photos allowed\u2019 policy when I took up the position as Editor of SEW. Stock photos are the worst. They make your website look like a marketing brochure for a characterless business that \u2018leverages thought-leadership into hot leads\u2019 or some such rubbish. They\u2019re also hackneyed, over-used and cheesy as hell.<\/p>\n

And expensive.<\/p>\n

Be really careful, even if you think an image is copyright free, the original owner could still be Getty, or Shutterstock<\/a>, and you may find yourself presented with a \u00a3500 invoice months down the line.<\/p>\n

I\u2019ve made this mistake before when I used an image of Justin Timberlake that had already been memed to death and I therefore assumed it was \u2018fair usage\u2019. I was wrong.<\/p>\n

It\u2019s also very difficult right now to give you an example of a stock photo without incurring a fee so I\u2019ll just show you one we have paid for in the past.<\/p>\n

\"Young<\/a><\/p>\n

Look at those Millennials. They\u2019re just like you and me right?<\/em><\/p>\n

Stop paying for stock photos. Instead pay for your own photographer to take images for you, or get out there and do it yourself.<\/p>\n

You should also be creating your own graphs, charts and visual designs too.<\/p>\n

But if you don\u2019t have the time or resources to do that – and frankly who does? – there are plenty of free and easy-to-use resources out there\u2026<\/p>\n

Free image resources<\/h2>\n

Google image search – usage rights<\/h3>\n

When you search for an image, you can filter out the results that are copyrighted. Just click on Search Tools, then Usage Rights and select Labeled for Reuse.<\/p>\n

\"Google<\/a><\/p>\n

You won\u2019t always strike gold here, but there may be something interesting that nobody else has used before.<\/p>\n

Flickr Creative Commons<\/h3>\n

Flickr is an awesome resource for photos, and you can use any that are labelled with a Creative Commons licence<\/a>.<\/p>\n

It\u2019s an alternative to full copyright, you just have to make sure you give full credit and link to the Flickr profile of the person who took the photo.<\/p>\n

Be careful when you use Flickr Creative Commons, as there are various licences available, for instance some photographers only allow their images to be used for non-commercial purposes.<\/p>\n

Unsplash<\/h3>\n

One of my favourites, Unsplash<\/a>\u00a0images are all copyright free, you just need to credit and link to the photographer. Occasionally they border on \u2018stock photo\u2019 but they are all of a much higher quality than your standard \u2018model looking at iPhone and smiling\u2019 images.<\/p>\n

Other handy tools<\/h2>\n

Gif grabber<\/h3>\n

Available for the Mac, Gif Grabber<\/a> is the best way to make so many wonderful Gifs for free. You can capture anything within your desktop or laptop screen, and resize and trim the finished product.<\/p>\n

Awesome screenshot<\/h3>\n

This is a Chrome extension<\/a> that allows you to take screenshots of your browser window (either partial or the whole web page) very easily, and you can also annotate before downloading it to your browser.<\/p>\n

Piktochart<\/h3>\n

One of the most popular data visualisation tools, Piktochart<\/a> is free, simple to use and has loads of great templates for infographics and other creatives.<\/p>\n

I made the following Gif of how to use Piktochart using Gif Grabber…<\/p>\n

\"how<\/a><\/p>\n

Optimising images for search<\/h2>\n

Once you\u2019ve found or created your desired image. You\u2019re then ready to upload to your site.<\/p>\n

Image size<\/h2>\n

You\u2019ll definitely want to resize your photo so it\u2019s not such a massive file. It\u2019s very easy to overlook the fact that most iPhone photos can be in excess of 3,000 pixels wide (which can be 2,500 pixels bigger than you really need).<\/p>\n

Huge image files can drag the page-load time of your site down and directly affect your rankings on search engines<\/a>, so be sure to resize them before you upload.<\/p>\n

If you\u2019re using a Mac, it\u2019s easy to resize, just open the picture, navigate to Tools then select Adjust Size.<\/p>\n

\"how<\/a><\/p>\n

You can also use Photoshop if you have it, or\u00a0you can use one of many online resizing tools, such as Picresize<\/a>.<\/p>\n

Alternatively if you\u2019re on a PC, you can use Paint.<\/p>\n

Yep, good old MS Paint. Just open up Paint, then click Open, choose the picture you want to resize and open it. Then on the Home tab, under Image group, click Resize.<\/p>\n

Warning about using iPhone images<\/h3>\n

If you are uploading iPhone pictures to a WordPress site there is a bug that can become very annoying. When you’ve taken a picture of something with your iPhone in portrait, it can appear as landscape once your article is live. It doesn\u2019t happen for everyone and it depends on what generation iPhone you use and your WordPress template.<\/p>\n

You can avoid this by only taking photos in landscape (with the volume button facing down) or there are various fixes available in this forum topic<\/a>.<\/p>\n

File\/Title name<\/h2>\n

Before you upload the image to your site, make sure you give it an accurate file name.<\/p>\n

Again to use the iPhone photo example, these tend to be called something generic like IMG_6056. So do yourself a favour and rename it, this won\u2019t necessarily help your SEO<\/a>, but it will help if you ever need to search for it in the back-end of your site.<\/p>\n

In WordPress and other sites, the image\u2019s file name will automatically be used as its title.<\/p>\n

So not this…<\/p>\n

\"wordpress<\/a><\/p>\n

But this…<\/p>\n

\"wordpress<\/a><\/p>\n

Alt-text<\/h2>\n

Most important of all is how you describe your image in the Alt section (can be known as Alt-tags or Alt-text). Google can\u2019t \u2018see\u2019 your images, but it can \u2018read\u2019 them and what it reads is what you write in the alt-attribute.<\/p>\n

Alt-text should be clear, descriptive, concise and not stuffed with keywords<\/a>. Alt-text is also what\u2019s used by screen reader software to describe images to people with visual impairments.<\/p>\n

In fact the one rule I always use when it comes to alt-text is write as if you\u2019re describing it to a person with a visual impairment. So the above example I would write \u2018black and white cat asleep on a purple pillow\u2019.<\/p>\n

The alt-text is also what shows up in the text box that appears when you hover over an image.<\/p>\n

Description & Caption<\/h2>\n

In WordPress you will also see fields for Description and Caption. These don\u2019t necessarily add any SEO<\/a> value to your images, but they can be useful for other reasons.<\/p>\n

The Description can be used to add a lot more extra detail, such as how the picture was taken, when it was taken and any other interesting elements.<\/p>\n

The Caption will show up underneath the image on the live article. It\u2019s up to you whether you use one or not. It can be helpful to describe or comment on the image.<\/p>\n

\"wordpress<\/a><\/p>\n

Image reclamation<\/h2>\n

Occasionally you may feel the need to check that your own self-created images aren\u2019t being rampantly used throughout the internet without proper credit.<\/p>\n

You can do this by using an automated reverse search tool, such as Image Raider<\/a>.<\/p>\n

Just add your images to the catalogue, then it will alert you any time another site uses your image. If that site hasn\u2019t given you proper credit, you can get in touch and ask them to do so.<\/p>\n

You don\u2019t have to be an intimidating jerk about it though, as it was probably done by accident.<\/p>\n","protected":false},"excerpt":{"rendered":"

There are many ways to make your articles easier to read on the web – lots of paragraph breaks, short snappy sentences, headings, sub-headings, Gifs of Kanye West\u2019s mood swings – but one of the key ways to make your content seem attractive is with the use of images.<\/p>\n","protected":false},"author":136,"featured_media":2406,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[1754,653,756],"content_type":[27095],"class_list":["post-2405","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-seo","tag-alt-attribute","tag-alt-text","tag-image-optimization","content_type-news"],"acf":{"tad_independentcommercial":false,"tad_content_format":false},"post_info":{"name":"Christopher Ratcliff","title":"","thumbnail_url":"https:\/\/searchenginewatch.com\/wp-content\/uploads\/2018\/10\/cats-that-look-like-kylo-ren-1-120x90.png","category":"SEO","timeago":"10y"},"_links":{"self":[{"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/posts\/2405","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/users\/136"}],"replies":[{"embeddable":true,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/comments?post=2405"}],"version-history":[{"count":0,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/posts\/2405\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/media\/2406"}],"wp:attachment":[{"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/media?parent=2405"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/categories?post=2405"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/tags?post=2405"},{"taxonomy":"content_type","embeddable":true,"href":"https:\/\/searchenginewatch.com\/wp-json\/wp\/v2\/content_type?post=2405"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}