I am building an image-centric catalog website. It catalogs collectible gaming cards numbering 100,000+ pages. There are competitor sites receiving millions of hits each month, so with the possibility of excessive traffic, I need to moderate image bandwidth while also optimizing for image SEO. I'm looking for some tips on doing so.

Each page on the site features one card with appropriate tags and descriptions. There are however four images for each card - one on matte cardstock, one on foil cardstock, one digital, and one digital foil. In a world with unlimited bandwidth and no-wait page loads, I'd simply embed all four images on the main product page with titles, alt tags, and captions to rank them according to their version keyword. In reality, a JavaScript gallery image loader seems appropriate.

Here is a simplified example of my current code: I left out the thumbnail-to-full image replacement script for simplicity. Would this affect SEO in any way? Should I be doing anything differently? Note that I don't want to create a page for each image as I'd have to duplicate the card tags and descriptions on each one, diluting PR for the main page. Thanks for any insight!

<script type="text/javascript">
    <img src="thumbnail1.jpg" data-src="version1.jpg">
    <img src="thumbnail2.jpg" data-src="version2.jpg">
    <img src="thumbnail3.jpg" data-src="version3.jpg">
    <img src="thumbnail4.jpg" data-src="version4.jpg">
    <img src="version1.jpg">
    <img src="version2.jpg">
    <img src="version3.jpg">
    <img src="version4.jpg">
  • 1
    why can't you just print the thumbnails in the html with js/links to the full versions? You may lose SEO benefits if you js them, and it's still going to use the same bandwidth if you auto-display them through js. Commented Sep 18, 2012 at 17:39
  • @joshuahedlund - I thought about links but I've read that every extra link on a page dilutes the link juice each passes. Furthermore, won't loading an image as a popup break its keyword associations on the parent page? As far as bandwidth goes, I simplified my code for posting. I'm going to display only one by default. Clickable tabs will load the other images on demand.
    – skibulk
    Commented Sep 18, 2012 at 18:11
  • 1
    You don't have to use links, you can use js to bring up full images in the page. But if you're going to write the thumbnails w/ js, you might as well just stick them in the html. it's going to use the same bandwidth either way, but the js version is less reliable for SEO. Commented Sep 18, 2012 at 20:09
  • Oh good idea. But do I need to do anything differently to ensure my full-size images are indexed properly?
    – skibulk
    Commented Sep 18, 2012 at 21:46

1 Answer 1


For SEO you would like to add ALT attributes to each image. As for the names, it would be better if they describe what is on the image. If thats impossible take tags/category/subcategory and put that into your link. You may end up on making randomized names like:


  • Thanks. Back to the script though - Will the full-size images be properly indexed if I include them using JS and NoScript tags?
    – skibulk
    Commented Sep 18, 2012 at 21:45
  • 1
    Google will find your data-src, but for better use I would suggest using <div> around each <img> and the data-src inside the <span>. Also add microdata to tell Google what is that. You can tell google where is an image, description, image URL
    – Trouble
    Commented Sep 18, 2012 at 22:20
  • Google, Yahoo, and Bing have created schema.org as a replacement for microdata, microformats, and RDFa. googlewebmastercentral.blogspot.com/2011/06/…
    – skibulk
    Commented Sep 18, 2012 at 22:31
  • thats what I meant about microdata :) sorry for confusing
    – Trouble
    Commented Sep 18, 2012 at 22:56
  • 1
    @skibulk Schema.org is a microdata vocabulary, not a replacement for microdata.
    – GDVS
    Commented Sep 19, 2012 at 14:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.