An Insight Into Image Optimising, Leveraging Those 1000 Words Options

[iamlost]

SocratesByTheSea highlights a most interesting Microsoft patent in his How Search Engines May Use Images to Rank Web Pages article. The comments are insightful as well.

While there have been many theses, patents, and whitepapers about content weighting I have seen little directly referencing images. What is particularly pleasing, to me, is that if you have been following webdev best practices with usability and standards in mind you are well on your way to 'doing it right' for the SEs as well. Yes, this patent is Microsofts but the logic is likely similar for all.

Basically there is an image relevance scoring system, i.e. algo input and/or filter, which considers:
1. Image level features (based on the image):
* photograph or CGI (computer generated image)
* person or not
* contrast, colour, blur
* size, dimension ratio

2. Page level features (based upon the relationship of image to page):
* x, y positions relative to page
* size relative to page
* dimensions relative to page dimensions

3. Site level features (based upon the relationship of the image to the site):
* image stored on/off site
* image usage frequency on pages within site.

And a text-image relevance scoring system:
1. metadata such as caption, alt text, anchor text (if image is a link).
2. surrounding text - especially within the same 'container', i.e. td or p or div.

Which all raises some questions such as:
* what about a fluid page vs. fixed page regarding the page-image relative size calculation?
* what about using an large image and sizing down on page via CSS?
* how does reuse frequency affect image value?
Some testing would seem to be in order - on these and several others that simply jumped out and said 'let's game this!'

As images are joined by multimedia the non-text content is going to become increasingly considered by the SEs. Every bit of insight such as this patent - thankfully in Bill's thoughtful 'plain English' translation - is gratefully received - and carefully tested.

[yannis]

A Fluid page versus a fixed page should not have much difference on image optimization unless you have larger images that let the page downsize them with CSS.

How does reuse frequency affect image value?

IMHO it lowers the score. Image repetition here is a 'tip' to the algorithms that the image is perhaps a logo! Not much of interest to other people and therefore search engines.

Some testing would seem to be in order - on these and several others that simply jumped out and said 'let's game this!

Based on some testing that I have done in the past here are my conclusions, recommendations and some tips.

(01) Enclose your images always in divs. Give your divs a class with either a div or a photo class. Display the image in the div as a block and slightly larger that the div size. Re-size accordingly with CSS. Size does matter! There is very little competition at the larger size images.

(02) Display images any images that you want the search engines to know about at the beginning of the page. Right hand at approximately 35-40% of page size.

(03) Give your images a title with a heading in <h3></h3> or higher.

(04) Naming of image is important. Treat it as a proper url. (For example image-of-gibraltar-rock-1985). Never ever give an image a name such as 12a_thumb.jpg! If you selling cameras don't name your file camera.jpg, rather model-XY-Sony-camera.jpg.

(05) Give the image a caption at the bottom. Possibly with relevant links. Display the caption as a paragraph, again preferably with a class named caption! Be descriptive in the caption.

(06) ALT text. Never to be missed. Treat it with the same reverence as the description meta.

(07) The title attribute is almost neglected by the search engines.

(08) LONGDESC forget it!

(09) Refer to the image from somewhere in your contents or link to it from other pages.

(10) Inconclusive test is about EXIF info. IMHO not currently used by the search engines, but one possible use in the near future is to score for duplicate image content.

(11) Some inconclusive tests but logical pointers are that a certain amount of image processing is done by G. This is based on the fact that they can pick-up faces (not difficult as an image processing problem) and possibly also filter images for safe search. When you display the potentially the same picture as other websites, the one with the better quality scores up. So treat your images nice!

(12) Last but not least, images attract the eye. People's photographs do more so. Your chance of your page being stumbled is directly proportional to the images you use on your page.

Hope this helps somebody and thanks to Bill and iamLost for bringing to light this 'great' microsoft patent. IMHO not shuttering news as the image processing community has been doing research on image search for years with some very good specialist image search engines out already! It is actually possible to search using an image rather than keywords already with very good results.


Yannis

<removed bottom white space: iamlost>

This post has been edited by iamlost: Sep 12 2008, 03:07 PM

[iamlost]

Nice overview, yannis.

My thought about fluid/fixed is that often the images are a set size and not always as fluid as the rest of the page. If the page area increases with monitor size but the image area remains constant would that have an effect? Just another thing to put on the quicky check list.

I agree that image reuse frequency would probably lower it's ranking value. However, what needs to be confirmed is the rate of drop-off, i.e. if one use is worth 10, how many uses drops it to 9, 8, 7, etc. Also the effect on reuse if the caption, title, alt, size, etc. are varied.

And your dozen recommendations/tips are great. As I mentioned - and your tips emphasise - following normal usability best practices gets one a good way along the right road.

While we have long known that images are valuable additions it is always nice to have some basis for a check list rather than going on mere gut feeling. And that you are willing to share some test results is an added bonus. Thanks much.

[yannis]

My thought about fluid/fixed is that often the images are a set size and not always as fluid as the rest of the page.

With right CSS - which is really simple you can have the images displayed proportional to the page. The SE will however see only the 'real' image size. Here is how to do it in a couple of lines.

1.0 Remove any size info from the image tag i.e width="" height=""

2.0 <div style="width:35%">
<img src="" style="width:98%" alt="" title="" />
<div>

You can see it in action here.

Yannis

[iamlost]

I have happily stolen swiped borrowed used many of your latenightengineer solutions. Including the image ones you outline. Very useful and appreciated resource. Rich luscious imagery, too.

Query: have you managed to apply CSS sizing methodology to HVAC?

This post has been edited by iamlost: Sep 12 2008, 05:43 PM

[yannis]

Query: have you managed to apply CSS sizing methodology to HVAC?

Trying very hard to do so!

[saschaeh]

Very interesting. I have a WP blog which is primarily images and later i will extend the site with extra functionality. (http://www.signatureillustration.org/illustration-blog)

One concern i had was that with the blog it has a set of images per post (3 to 5) and then each image is a link to a bigger version (img only) (so www.domain.com/post08/imh.jpg). Do you think i need to worry about diluting the post value at all with each image being a link to its bigger self? Perhaps better not to link the images at all and have all the big images directly in post?

I guess the best thing would be to build custom page so when you click on the image it takes you to a page that has soem text about that inidvidual image.

Also when you say big images are better what would you consider a large image?

This post has been edited by saschaeh: Sep 18 2008, 03:47 AM