Monday Marketing Tip | Image Optimization | Mother Baby Child

Have you ever wondered why HER mom blog pictures show in Bing / Yahoo and Google Images, but YOUR Blogger images do not?

This Monday Marketing Tip will explain how to optimize your pictures, so that people can find them in Bing / Yahoo and Google images. They will also see a message you have written when they put their computer mouse over the pictures. This is called image SEO and is part of the organic search engine optimization (SEO) process. It doesn't matter whether you have a website or blog; Blogger, Typepad or Wordpress, the need for image SEO optimization is the same for everyone and it does make a difference in the great scheme of things in the Internet Marketing world. Please keep in mind that this is just one type of "image optimization" and is also called optimizing an image with search engine optimization and / or image seo.

How Pictures / Images Upload To Your Blog

When you upload a picture to your blog, it stores in a virtual space on your server (hosting account). You do not realize the complexity of it because your blog generates an image code for you. You can see this code in the HTML tab in your blog editor. It looks like this and is in the upper left hand corner of your Blogger editor page. I edit my images and blog code a lot because blogs puts a lot of junk around our image code (this is why your pictures are clickable to a larger picture) and show up in a certain style. I typically remove this extra code unless I want my pictures to align or link to a different page. This is why my code example (below) will look a little different that what you might see in your editor. The next section explains what to look for in your image code, so that you can optimize them.

Image Code Basics

The basic image code looks like this:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinL8U8kIwE3aLUn4k4xS95t9j3uhN5BBQGgF7eRTcy7-YfnKQw8t_K7ZE5e7MFxOT0hRl7MlpOKo4RXGPwVEJTThUDf9VZ8cRUd1QIs2V6ugDB5c5yhbSZoAOTrTjDDBr7pC3hMGR7YFc/s1600/check-this-out.jpg" alt="Image Optimization - Monday Marketing Tip" style="border: none;" width="500" height="64" title="Learn how to optimize your Blogger images to get better website traffic and search engine rankings." />

The image code typically begins with the <img src= and has the link to the image in quotes ... some text editors (the area where you type posts in a blog) put the image HTML code out of order, therefore you have to look for the src="http://your-image.jpg" part even if it is not next to the <img

For example, the follow src=" is not next to the <img

<img style="border: none;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinL8U8kIwE3aLUn4k4xS95t9j3uhN5BBQGgF7eRTcy7-YfnKQw8t_K7ZE5e7MFxOT0hRl7MlpOKo4RXGPwVEJTThUDf9VZ8cRUd1QIs2V6ugDB5c5yhbSZoAOTrTjDDBr7pC3hMGR7YFc/s1600/check-this-out.jpg" alt="Image Optimization - Monday Marketing Tip" width="500" height="64" title="Learn how to optimize your Blogger images to get better website traffic and search engine rankings." />

Both snippets of image code will still produce the same result. All that matters is that you can find the <img and src=" in your editor, so that you can seo your images.

Your image code will need both an ALT and TITLE attribute. The following is example is for the CHECK THIS OUT picture at the top of this blog post. I have highlighted the 2 sections of this image code as follows: title=" " is marked yellow highlight and alt=" " is marked purple

Optimizing Image Code by Using The ALT Attribute

img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinL8U8kIwE3aLUn4k4xS95t9j3uhN5BBQGgF7eRTcy7-YfnKQw8t_K7ZE5e7MFxOT0hRl7MlpOKo4RXGPwVEJTThUDf9VZ8cRUd1QIs2V6ugDB5c5yhbSZoAOTrTjDDBr7pC3hMGR7YFc/s1600/check-this-out.jpg" alt="Image Optimization - Monday Marketing Tip" width="500" height="64" title="Learn how to optimize your Blogger images to get better website traffic and search engine rankings.

ALT = " "
As you can see, my image has an alt=" " that says "Image Optimization - Monday Marketing Tip" this tells the search engine to read this ALT attribute as if it is text on my blog, though specific to this image. So, using this alt="Image Optimization - Monday Marketing Tip" tell the search engine that my image is about or relative to the content of this blog post and, ideally, what the image is showing.

Notes on using the ALT=" "

It would be more appropriate for me to put alt="Check this out" if I wanted to the search engine to read this image as "Check this out" opposed to "Image Optimization - Monday Marketing Tips". Try to keep the alt=" " text relative to what the content of your page is about or specific to what the image is for sites that are about photography / photographs.

The key to using the alt=" " attribute is not to SPAM the search engine with what is called keyword stuffing (marked in red text to signify that stuffing images with keywords is a bad / horrible thing to do ~ Bing / Yahoo and Google can BAN your blog from showing in the search engines). Image stuffing is when you put a lot of text (keywords and sentences) in the alt=" " attribute. For example, alt="image optimization, picture optimization, best keywords, best image optimization, blog optimization, website optimization, image seo, picture seo, blog seo, website seo, wordpress seo, blogger seo, typepad seo, blogspot seo, blogger image seo, wordpress image seo, blogspot image seo, typepad image seo" and so on (some people stuff their images with even more "keywords" or a bunch of keyword rich sentences). DO NOT STUFF YOUR IMAGES!!! You should only put a few relative words (keywords) or a small keyword rich sentence in your images.

Optimizing Image Code by Using The TITLE Attribute

img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinL8U8kIwE3aLUn4k4xS95t9j3uhN5BBQGgF7eRTcy7-YfnKQw8t_K7ZE5e7MFxOT0hRl7MlpOKo4RXGPwVEJTThUDf9VZ8cRUd1QIs2V6ugDB5c5yhbSZoAOTrTjDDBr7pC3hMGR7YFc/s1600/check-this-out.jpg" alt="Image Optimization - Monday Marketing Tip" width="500" height="64" title="Learn how to optimize your Blogger images to get better website traffic and search engine rankings."

TITLE=" "
Additionally, my image code also has a title=" " attribute that says "Learn how to optimize your Blogger images to get better website traffic and search engine rankings." - this TITLE attribute is what your website visitors can see when they sit their computer mouse over the picture. *** GO TRY IT! Put your mouse on the Check this out! picture. ***

Notes on using the TITLE=" "

Similar to what is stated above in the Notes on using the ALT=" ", do not Keyword stuff your title=" " attribute because it can hurt your blog or website. Search engines can ban your blog from their results and this will most certainly happen if a human editor find that mess. You can get creative and write more personal messages in the title=" " area; just not too long. Your message should be short and sweet to guide the website user.

This is what your image code should look like with both the TITLE and ALT Attributes

img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinL8U8kIwE3aLUn4k4xS95t9j3uhN5BBQGgF7eRTcy7-YfnKQw8t_K7ZE5e7MFxOT0hRl7MlpOKo4RXGPwVEJTThUDf9VZ8cRUd1QIs2V6ugDB5c5yhbSZoAOTrTjDDBr7pC3hMGR7YFc/s1600/check-this-out.jpg" alt="Image Optimization - Monday Marketing Tip" width="500" height="64" title="Learn how to optimize your Blogger images to get better website traffic and search engine rankings."

That's it ... Now, you know how to optimize your images by adding the ALT and TITLE attributes. Other details like width, height, border and alignment are other useful image code details. You can see the width="" and height="" attributes in this example. Adding a border is as simple as border="1" (you can make this number larger if you want a thicker border) and the align="" property is written as align="left", align="center" and align="right". There is a more advance way to do all of this through additional programming called CSS, but this standard HTML code examples work, too.

I hope this was understandable and will help you get more website traffic from your images. There is a lot more to image optimization, but these 2 basic changes can make a huge difference for your marketing.

ONE MORE THING ... Don't forget to take the link code from around your images if you are not planning to link it to a page or blog post. There is nothing more annoying, to a person visiting your site, than to click an image and it goes to nothing but your original picture (well unless it opens to your Google image viewer). People will just steal your images this way, so remove the link code OR link it to a relative page. Learn how to make your image HYPERLINK TO A NEW POST or page that will add value to your blog!

Need help with your website, blog or marketing online? Does this feel like Chinese to you? Feel like you could use some help with design, content or marketing? Visit Mom Business & Blog Marketing page!

In Motherly Love,
Mother Baby Child