Blog Tips Tuesday 3: How to add titles and alt text to images

Blog Tips: How to add titles and alt text to images

If you enjoy my weekly blog tips but you’d like some help that’s a bit more personal and tailored specifically to your blog, take a look at my blog coaching page! I will work with you one-on-one to help you build your blog traffic and earn money from blogging.

We all know that it’s important to include at least one image in every blog post – they break up the text, give you something interesting to look at, and provide the reader with an idea of what the post will be about at a glance. But thinking you can just plonk any old image in your post and be done with it is a mistake – try taking two minutes to add titles and alt text to your images to improve your SEO.

Two stars

This is an ‘intermediate’ blog tip, aimed at people who already have a blog set up and who want to improve their SEO to gain readers and build traffic.

 

How to add titles and alt text to your images

SEO can be really confusing to beginner bloggers, but here’s something really simple you can do to gain search engine traffic.

What is alt text?

An alt tag is an html attribute that explains what an image shows. You know how sometimes when your Internet is playing up, instead of an image loading properly you’ll see a little red cross with some writing next to it? That’s the image’s alt text. It’s also used by blind people who use a screen reader – the alt text is what will be read out loud, to allow the person to know what to image shows.

So why should you use alt tags? Well, as well as being helpful to blind people, they’re great for your SEO. Google isn’t a person – it can’t look at an image and know exactly what it shows. Instead, we need to tell it in words. If you do a Google image search for ‘veggie pot pie’, it’s not going to be looking at the images themselves, it’ll be looking at their alt text, so only images with that alt text in place will show up.

If possible, try to get your blog post’s keywords into your alt text – again, this is really straightforward for a food blog (we have an easy ride!) because your focus keyword is usually going to be the name of the recipe, and your photos are usually going to be taken of the recipe too. Occasionally you’ll need to use other words for your alt text, but that’s ok – it’s better to use relevant words that accurately describe your image than to force in keywords where they don’t belong.

What are image titles?

You can also add a title to an image, which is the text that appears when you hover over the image, like this:

Titles and alt text

As you can see, the title of the image appears in a little yellow box if you hover the cursor over the image for a couple of seconds. Adding titles is also great for your SEO.

Sometimes your alt text and image titles will be the same, other times they may not. It’s up to you to use your common sense to decide what’s appropriate in each case. For example, if my image showed just one slice of my ricotta and tomato tart, I might decide to keep the title as ‘ricotta and tomato tart’, but change the alt text to ‘slice of ricotta and tomato tart’, since that phrase more accurately describes the picture.

How to add titles and alt text to images on WordPress

If you’re on WordPress, it’s really easy to add all this information without knowing anything about html. Just insert your image, click on it, then click the ‘edit image’ button in the top left corner (see blue arrow):

How to edit an image on WordPress

This will bring up the image editing window, where you can add your title and alt text. You can also add a link here if you want the image to link to a different page when clicked.

Adding image titles and alt text on WordPress

How to add titles and alt text to images on Blogger

I don’t currently use Blogger, but I did for over a year, so I can still help even if you’re not on WordPress! The method is very similar on Blogger: add your image, and then click on it, and this little bar will pop up:

Editing an image on Blogger

Click ‘properties’, and then simply fill in your title and alt text in the spaces provided:

Adding titles and alt text to images on Blogger

How to add titles and alt texts to images using html

If you’re not on WordPress or Blogger, or if you’d just prefer to add your title and alt text manually, you can do so with a really simple bit of html. If you don’t understand html or you’re perfectly happy using one of the above methods, ignore the following!

Just go into your html editor (which you can find by clicking the ‘text’ tab in your WordPress post editor or, unsurprisingly, the ‘html’ tab in Blogger) and add this to your image’s code:

alt=”alt text goes here”

(you need to keep the quotation marks in all these examples, and be really careful about where you add spaces, etc – one little mistake can ruin your coding!)

The html for an image’s title is

title=”title goes here”

It doesn’t matter what order you put these two tags, as long as they go within the image’s code. So your code could end up looking something like this:

 <img src=”http://www.mysite.com/imagelocation” title=”title goes here” alt=”alt text goes here”>

That’s all you need to do to add your title and alt text.

If you want to take things one step further and have the image linking to a page when clicked, you can keep these same title and alt tags, but just add your link code around the image, like so:

<a href=”http://www.siteimlinkingto.com”><img src=”http://www.mysite.com/imagelocation” title=”title goes here” alt=”alt text goes here”></a>

It might look a little confusing but if you take each element one at a time, it makes a bit more sense. Remember you can also add target=”_blank” to your link code to make it open in a new window, like I mentioned when I talked about bounce rate.

And there you have it! You should now be able to go and add titles and alt tags to every single picture on your blog. It might take a bit of time, but the improvement in your SEO should be worth it. Just a few small changes like this can really help you get search engine traffic!

As usual, let me know if there’s anything in particular you’d like me to talk about next week!

Other posts in the Blog Tips Tuesday series:

How to reduce your bounce rate
How to find out how many times a blog post has been pinned

Comments

  1. Julia says

    Dear Becca!
    I don’t remember where and when I found your blog but I’ve been reading it for a while now and like it very much. Your idea of telling tipps about blogging is great for me! I’m having my foodblog since the beginning of the year but only start now to learn more about the world of foodblooging and I’m loving it! So thank’s a lot for your advice!! The funny thing is, it works! When I read your post about the bounce rate I came across your thai curry noodle soup recipe and tried it while reading your advice. So the idea of “related posts” really works :-) By the way: The soup was delicious!
    Culinary greetings from Cologne in Germany!
    Julia

  2. CakePants says

    Your blog tips are extremely helpful (and I really appreciate that you take the time to explain things in a way that even people who aren’t super tech-saavy can understand!)! After reading this post, I understand why alt text for images is important, but is there a specific benefit to adding image titles? Thanks!
    CakePants recently posted…Chocolate Hazelnut TrufflesMy Profile

  3. Lindsay Eidahl says

    Hello! I just found your site and this post. I will be starting to add ALT texts to all my pictures. I had no idea! I am new to blogging and get a little overwhelmed with all there is to know. I want 2014 to be a growing year for my blog. I have so much to learn, but have signed up for your emails to help me out! Thanks so much!
    Lindsay Eidahl recently posted…Kiwi Crate Has DIY InspirationMy Profile

  4. Nicole LeDrew May says

    I have been trying to figure out how to do this for a day now and finally you explained it so easily! thank you so much! I still have a lot to figure out but slowly getting there. Will definitely be back here to learn more. thanks, much appreciation!
    Nicole LeDrew May recently posted…Barefoot boys on the BeachMy Profile

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

CommentLuv badge