Images not being shown in Google Image Search after redesign

Question

We launched a new website design late February and since then 99% of our large product images do not show up on Google Image Search. We monitored the Image impressions after the launch of the new design, and the images impressions immediately dropped from nearly 30,000 to now 2,000. The only images that show up in the image search are the small thumbnails and not the full resolution images that the thumbnails link to. We did not mess with the image directories or any page directories... it was purely cosmetic. What could of triggered such drop?

From my understanding Google bots should follow the thumbs href to the full-res image, and index it. Is this correct?

We already made some modifications/suggestions such as adding titles to the large image in the lightbox, made sure ALL images have 301 redirect to make sure they are served as https, and brought back the "View Detailed Images" link which we hid initially on the new design. We have been fighting this for months now, and no one can give us a straight answer.

Here are snippets of the code for the images.

Thumbnails linking to large images:

<a href="http://localhost/tst/images/D/N300_INT_magnifier1.jpg" class="lightbox cboxElement" rel="dpimages" title="TST Industries Kawasaki Ninja 300 Integrated Taillight">
  <img src="http://localhost/tst/images/D.cache.dpicon/144.jpg" alt="TST Industries Kawasaki Ninja 300 Integrated Taillight" title="TST Industries Kawasaki Ninja 300 Integrated Taillight" width="64" height="40">
</a>

Lightbox & Large Images:

<div id="cboxLoadedContent" style="width: 530px; overflow: auto; height: 330px;">
  <img src="http://localhost/tst/images/D/N300_INT_magnifier1.jpg" id="cboxPhoto" alt="TST Industries Kawasaki Ninja 300 Integrated Taillight" style="border: none; display: block; float: none; cursor: pointer; margin-left: auto; margin-right: auto;">
</div>

Funny thing is, that we have cloned a few products and the thumbnails of the cloned product (for some odd reason) are the actual large images just sized down to thumbnail size. Well, those particular images, for that cloned product, show up in the Google results. BUT, in the Google page speed test, they complain for having such large image in such a small container. You're damned if you do, and you're damned if you don't I guess.

Here an example of the same product but different brands. The Yamaha is the original and the Kawasaki is the cloned.

YAMAHA ORIGINAL: https://www.google.com/search?q=yama...M8zPCJvqcCM%3A

KAWASAKI CLONED: https://www.google.com/search?q=Kawa...GApv2b TRM%3A

As you can see when I search the Yamaha Product only displays the Yamaha's thumbnail - the large images all point to the Kawasaki product. But for the Kawasaki (cloned product) it displays its large images no problem.

The website is - www.tstindustries.com

Answer 1

You can scan your site or it's development copy with tools like Xenu (free) or/and Screaming frog SEO spider tool (free up to 500 URLS). I think this is the easiest way to check your robots.txt file settings.

By the way, looks like you do not use it right now - https://tstindustries.com/robots.txt returns 404 error page

Did a test scan, got some ideas Try using in your urls not

<img src="http://localhost/tst/images/D.cache.dpicon/144.jpg" alt="TST  Industries Kawasaki Ninja 300 Integrated Taillight" title="TST Industries Kawasaki Ninja 300 Integrated Taillight" width="64" height="40">

but ( without "http:")

<img src="//localhost/tst/images/D.cache.dpicon/144.jpg" alt="TST Industries Kawasaki Ninja 300 Integrated Taillight" title="TST Industries Kawasaki Ninja 300 Integrated Taillight" width="64" height="40">

maybe your problem is about mess with http and https protocols in your URLs.