Google Images' New (Bing-like) Layout

[levo]

Clicking on images now opens a layer with the larger image and a link to the page.

[img844.imageshack.us...]

[lucy24]

Oops, new page. This is in reference to the function discussed on the previous page, linked from [scriptsocket.com...]

The two variables are image format and URL format. Deal with one at a time.

To test locally you need a pseudo-server such as MAMP. If you don't have one, use some backwater of your real site and just upload the watermark.php and .png files. Put the request manually into your address bar as

http:/ /{aaa}?src={bbb}

where aaa is the URL of the watermark.php function-- starting with localhost:8888/ if you're testing locally --and bbb is the relative path from there to any jpg.

For me it wouldn't work as downloaded (full-color png with alpha channel); this gave me the original jpg with a black box the size and shape of the watermark logo. I had to change "watermark.png" to an indexed png with transparency. This is fine because it cuts the filesize in half, and you obviously don't need all those colors for a simple overlay. 16 grays is more than enough.

Getting the links sorted out will be a little trickier.

[HuskyPup]

I'm in love with lucy24 :-)

I know what she's typing, however lucy24, I think you just lost almost everyone else!

Whilst this overlay thing is a nice idea, simpler is better, just stop Google allowing "View Original Image". FFS they're complaining (GOOGLE) about bandwidth usage YET they're the ones hotlinking to your CURRENT image in their (so-called) lower resolution.

Haven't most webmasters realised this?

The image SERPs show one result, click on that image and it shows the current image from ones site in lower resolution using YOUR bandwidth, NOT Google's.

[lucy24]

Follow-up:

Well, color me gobsmackered. I've done some more fine-tooth-combing* and it turns out I've accidentally been doing exactly the right thing to minimize bandwidth gobbling. And it hasn't affected the human user one whit :)

Here's how it works.

When someone clicks on an image in the image-search results page, that unsuspecting user's unsuspecting browser loads up your image, giving /blank.html as referer, but they don't see it yet. The image they see in that black lightbox thingie is not your own hotlinked file; it's a cached construct that you may find in your cookie list as "gstatic.com". To make it more obvious, their version is a jpg even if yours was a png. (You can right-click and "view image" to see it in isolation.)

The user's browser doesn't display your actual image until the next step, when they click "view original image". This happens instantly for the user, since their browser loaded up the image several seconds ago and is now showing a cached copy.

Unless, like me, you have been rewriting images with /blank.html referers to a one-pixel gif. Then something different happens. The user doesn't know it, but you can take advantage of it.

For reasons that have nothing to do with google, my one-pixel gif has always been set to no archiving. At all. 'ExpiresByType image/gif "access"', period, full stop. (Note that this setting applies to the actual file served, not to what the human user and/or their browser think they're getting. That's the key.)

Now, because the browser isn't allowed to archive the image, it has to download it all over again. But this time the referer isn't /blank.html, it's the full referer that you'd see after a normal old-fashioned image search. Almost. It doesn't say /imgres at the end, but dig into the referer and you'll see "source=images" or "source=hp" or "source=anything-other-than-web". Not that it would matter if it did say "source=web" since you don't want those either. Not when they're going straight for a jpg.

Technically this step isn't a hotlink, since it isn't part of someone else's page-- not even google's. It's a deep link, showing only the image. But this in turn means that if the user's browser pays attention to the no-cache instruction-- some of mine apparently don't-- and puts in a new request, it can be smoothly redirected. You haven't expended any bandwidth beyond a couple hundred bytes for the initial dot.


* Paradoxically, this kind of testing is much easier to do on a tiny little site, because there are generally nice big gaps between consecutive log entries and you can see exactly what happens in what order. Clear away a few unrelated googlebots and what's left is your history.

[Play_Bach]

Wow alvin123, that's quite a hornets nest of comments. Unfortunately, I'm not optimistic that all the complaining and finger pointing at Google is going to change anything. Companies buy and sell contracts all the time and those iStock photographs look like just another Google acquisition.

[HuskyPup]

Soooo...all that you thought were yours is now ours?

I've been busy watermarking all weekend and now it looks like ALL next week...yeah G, do no evil!

[Play_Bach]

> Soooo...all that you thought were yours is now ours?

Yup. Unfortunately, that is how it appears.

- All your base belong to us.
[en.wikipedia.org...]

[gbk666]

Imaguard for Wordpress works relative well for me i use it since 4 days now, a bit traffic came back

People who click on original size are redirected to the homepage of my site, thats not a standard option but easily configurable with the plugin

However, the main traffic still stays on google, people seem to be kay with watching the big thumbs already in general.

Watermarking/darken images is also not the best solution, i think people just look at other images on google and dont click to see the big ones

Before the update i had around 1700 people at least through the google image search, now around 500 click on original size + the 20-30 which click directly on the google thumb to go to the website.

The images on google are too big and there are too much alternative images on google without any watermarks/darken images yet. It looks like only 1-3% of us webmasters are even trying to prevent that google keeps the traffic.

Take deviantART as example, the probably biggest website about art worldwide, they lost around 400-500000 visitors per day since the 24th january according to quantcast which is around 25% of their traffic (they have the most traffic through registered members)

So far they did nothing. i wonder why since this must affect their finances for sure and is not in the interest of the many artists there too.

[ianevans]

@lucy24,

Trying to follow what you discovered. My nginx.conf allows img requests that are blank, blocked or from my site. So the view original image link always hits my redirect script even with the new design.

It doesn't work when people are logged in to Google products because of the blank referer.

Does your discovery mean that we can handle the logged in-no referer case? Or are you saying that it makes it easier to redirect searches with the google blank.html to a watermarked/obscured version that will have them reaching for the view site/original image link? And does anyone know if there's any way to handle the logged in to Google case?

Thanks for all the digging!

[Play_Bach]

> It looks like only 1-3% of us webmasters are even trying to prevent that google keeps the traffic.

That's what I've noticed as well, probably even less than 1%. I don't know if Google will simply de-index those sites trying to thwart their new images layout or not. If they do, it wouldn't surprise me.

Their attitude is more like: "You can do anything you want to with your pages, and we can do anything we want with our index--like exclude your pages."
--
Google Hacks, O'Reilly, First Edition, 2003, page 306

[lucy24]

Or are you saying that it makes it easier to redirect searches with the google blank.html to a watermarked/obscured version that will have them reaching for the view site/original image link?

I didn't give the details of how I worked out the sequence, because it's boring, but here is the key part. Assuming the user is not logged-in, so there will be referers of some kind:

#1 User clicks image in SERP
#2 User's browser downloads image from your site, giving /blank.html as referer
#3 User sees gstatic dot com image based on google's previously cached copy. I verified this in two unrelated ways, because my test searches brought up a couple of images I'd only changed a few days earlier. Changes were small, but visible to the naked eye; search brought up the old version. And it was a jpg where my real images were png.
#4 User clicks "view original image"
#5 User's browser displays free-standing image which has already been downloaded although not previously seen by user.

It's #5 that is the key. If the image downloaded in #3 is cachable in the usual way, there will be no fresh request and you have no way of knowing whether the user ended up clicking "View Original Image".

But if it isn't cached, and the browser* honors the no-caching directive, there will be two separate requests. So the trick is to serve up a tiny non-cached image at point #3, where the human user will never see it anyway, and save your efforts-- bandwidth, coding and redirecting --for step #5.

:: wandering off to see if anything can be done when user is logged-in ::


* It also has to be honored by the user's ISP. If they don't, none of this will work.

[ianevans]

Thanks. I've just posted to the nginx mailing list to see how they would handle the one pixel gif rewrite. Their conf doesn't allow multiple or nested if's so it'll be a bit of a juggling act. Will post that info here.

[Sgt_Kickaxe]

I've been quietly following this thread and I think it's one of the best ever on webmasterworld. Problems detected, solutions discussed, actions taken.

Alvin123 - That link to your istockphoto situation is eye opening and, in conjunction with Google hotlinking, is a real problem. The official Google responses in that thread are equally eye opening - "yeah, we know there's a problem, but we paid for the image so they are ours" even if you never sold or gave rights to them... just wow. Hire a lawyer?

Lucy - Nice detective work on figuring out exactly what's going on with Google's image search, and how, heck a lot of you have added important bits here.

Huskypup - "I've been busy watermarking all weekend and now it looks like ALL next week...yeah G, do no evil!", this seems like the way to go to ensure proper attribution. If even the biggest internet company in the world is not going to have your back then it's time.

So I want to offer another and potentially better solution for some sites instead of the code mentioned earlier. Your mileage may vary.

Step #1 - add a 25 pixel strip to the bottom of all your images and add an attribution line via photoshop within the 20 pixels, something like "Check out example.com for more great images".

Step #2 - using css create a watermark div that is set to be -20 pixels in location(plus any image padding), and the same width as the image. Make it have the same color background as the page.

Step #3 - on page place the watermark div directly under your images and within the div place the image description.

Step #4 - Make sure it's working. On YOUR site you should see the image with a description directly underneath it, the watermark strip will be covered by your div. If someone copies the image they will have the watermark strip included in it, including Google images, but otherwise your visitors will not see a watermark.

Why it might work. In Google when your image is displayed you will have your watermark at the bottom of the image(or top if you set up the div that way) and the call to action nature of your wording may lead visitors of Google images to click on the image which is(for now) a direct link to your site. Hotlinkers will also be displaying an ad for your site and scrapers will at least have to work on the images to remove the watermark which should be deterrent enough. Certainly automated theft will be less worthwhile for the scraper. You can apply traditional hotlink protection for other sites still if you wish.

I just wanted to offer this alternative as a possible solution since, aside from a little css work and photoshop batch editing, there is no code to run that Google may or may not work around in the future.

If Google refuses to rank images as highly if they have a watermark strip on them then that is their problem, it looks badly upon them wanting to avoid people with a solution to a problem Google has created. I just had a backlink deja-vu just there...

[Play_Bach]

If Google refuses to rank images as highly if they have a watermark strip on them then that is their problem, it looks badly upon them wanting to avoid people with a solution to a problem Google has created.

Somehow (unfortunately), I don't see Google losing a lot of sleep over the handful of sites that are trying to find a way out of the new layout. With billions of images at their disposal, what do they care if they lose a few due to watermarks?

[Sgt_Kickaxe]

They likely won't Play_Bach and that would reflect upon them but it doesn't change the need to do what's right for your site.

[Play_Bach]

I guess I'm trying to see how it benefits a website from being excluded from Google. One of those "cut off your nose to spite your face" situations. If they were unhappy with the drop in traffic due to Google's new image search, then when they get even less traffic once they've been de-indexed, how does that work?

[helleborine]

About 15-10% of images for my keywords on any given image SERP is from my various related websites. That represents a gold mine of highly ranking images.

In my case the hover layout had already killed my Image referrals. The very few visitors that came from all these high-ranking images was already a trickle when the newest layout was implemented.

De-indexing my images means no significant loss of traffic. Add the nightmare of Google image hijack exploits to worry about, Pinterest, and copyright infringement by shady webmasters from Russia making phony websites with my images to inject viruses, I'm better off out of the index.

I don't quite understand the solutions that target BLANK REFERRER - there is no way to target image search engines?

[lucy24]

there is no way to target image search engines?

Sure: by user-agent in combination with IP.

Reminder for people coming in late: "blank" now means two entirely different things. One is a blank, i.e. absent, referer

^-?$

the other is the literal string

www.searchengine.com/blank.html

[matrix_jan]

@lucy24

In some cases (depending on logged in status, https, and browser) there is no referral data being sent. Plus the IP belongs to the user not the search engine. So the only way to spot such request is only through cookies.

[lucy24]

In some cases (depending on logged in status, https, and browser) there is no referral data being sent. Plus the IP belongs to the user not the search engine.

Oops. I thought the question was about the search engine's initial crawl: the one that yields the images that make up the SERP, and that are used in turn to generate the gstatic jpg's.

Incidentally, I'm not seeing any https on image searches. Only on regular text searches. And as far as I can tell-- this part is iffy-- the difference between logged-in and not-logged-in users is only visible on the first request: the one where the referer is either /blank.html or nothing. Unless I've made a complete botch of my own experimenting, the wording of the final request is the same either way. And when I'm logged in there are always two requests-- even though the first one didn't involve a no-cache rewrite-- and both of them show the real image. (I checked: the imagebot has not yet crawled one of my recently revised png's, so I could only be seeing the live download.)

Incidentally, Camino seems to be immune to the new improved image search. (I did my testing in other browsers for cache-and-cookie reasons.) Instead I get a version where clicking on the image takes me straight to a page with the image's source page on the left-- the real thing, not a Preview-- and the search-engine stuff on the right. It looks as if google thinks Camino is an elderly browser; I get the same search format in MSIE 5 except that then it complains of "script errors" and never does show me my page.

I also found out what the

Google/2.5.1.13455 CFNetwork/609.1.4 Darwin/13.0.0

user-agent is. I'd long suspected it had something to do with image search. Turns out it's the google app-- the one you can use on an iPad as an alternative to regular google with a browser.

[keyplyr]

I also found out what the
Google/2.5.1.13455 CFNetwork/609.1.4 Darwin/13.0.0
user-agent is. I'd long suspected it had something to do with image search. Turns out it's the google app-- the one you can use on an iPad as an alternative to regular google with a browser.

Since CFNetwork is an Apple propriety, I would guess (without doing further testing) that the UA string geberated by this app is from Apple appliances only, as Android, Windows, Palm and Blackberry have their own apps with distinctive UA strings.

[lucy24]

Oh, great. More UA strings to look out for :)

Further experimenting reveals that-- at least on my computer--

Safari always sends the "blank.html" referer, even if you are logged in, and

Opera always makes two requests for the image file, even if the first one wasn't no-cached so there's no reason to get a fresh one two seconds later. (This may involve Opera settings, but I don't remember changing anything...)

I also noticed-- and fortuitously just got a StickyMail confirming it-- that the New Improved image search is only available to MSIE 9 and up. So no wonder there hasn't been more of a fuss: half the people on the planet don't know anything has happened :)

I also discovered that my site is soooo small that the mere act of doing all this testing has bloated my regular log files beyond all recognition. This is depressing.

---

Now I've got a whole new question, admittedly about eleven pages late.

When you click "View Original Image" your screen is taken over by the image. Exact display format depends on your browser, but it's always the image by itself, just as if you'd typed in the filename on purpose, and it's always in the same window, not a new window or tab. In all browsers.

Now what?

You're stranded on a non-page with no links, so the only way out is via the browser's back-arrow.

What the ### kind of user interface is that?

[Play_Bach]

> When you click "View Original Image" your screen is taken over by the image.

On my iPad, once I've clicked on the Google image to enlarge it, I can endlessly scroll through all the images without there being any place on the Google screen to go to the source. Only time I see a link to the source page (located on the bottom left of the iPad screen) is after the first click. After that, I'm on the carousel.

[HuskyPup]

With billions of images at their disposal, what do they care if they lose a few due to watermarks?

In my experience they do not remove watermarked images. Many in my industry, especially the Chinese, have always watermarked their images and they rank fine, my own watermarked images of this past year or so have had no problems with ranking either and the images I have recently been watermarking are all still ranking well.

You're stranded on a non-page with no links, so the only way out is via the browser's back-arrow.

In my .htaccess I have the following:

RewriteRule .*\.(gif|jpe?g|png)$ - (NC,F)

ErrorDocument 403 /index.html

The important part is - (NC,F)

- serves no image
F is Forbidden

403 re-directs to the home page or wherever you want it to.

Note: If using .php, you may need to enter the full url to make it work correctly.

HTH, it's working fine on my sites.

[lucy24]

In my .htaccess I have the following:

RewriteRule .*\.(gif|jpe?g|png)$ - (NC,F)

You probably have more than that, or else you'd be denying access to all images everywhere all the time. What are the conditions that go with the rule? Referer /blank.html; something identifiable in the query string; null referer when not a search engine?
Oh and psst! the leading .* wastes server time and isn't needed. I assume the (NC,F) comes from typing it in freehand.

403 re-directs to the home page or wherever you want it to.

Hm. If you want them to end up on your home page, why not make it a redirect in the first place? Not the ErrorDocument directive, just the RewriteRule about images. Or do you need a record of the 403 for later use? You definitely don't want the full URL in the ErrorDocument line. That would change all your 403s into redirects, not just the images.

When I said

You're stranded on a non-page with no links

I was talking about the searcher, not the site owner. What on earth is the point of steering your searchers straight into a dead end? Sure you can beat a hasty retreat from a page too-- but you don't have to. There are other directions to go. I don't understand why the Original Image doesn't open in a new window or tab. Someone must have decided it was a good idea. They do do market research don't they?

[matrix_jan]

On my iPad, once I've clicked on the Google image to enlarge it, I can endlessly scroll through all the images

I just checked my logs, for the last 1000 requests for the watermarked image (one I show in google search), 604 come from iPad g image search, and only 6 of them visited the website.

I hope g counts CTR from ipads separately.

[HuskyPup]

You probably have more than that

Yep, I've got loads before that however I was assuming that others already knew that anyway.

Oh and psst! the leading .* wastes server time and isn't needed.

That's strange isn't it? I've tried it without .* and it wouldn't work properly at all that's why I merely write this is what I use since it works for me.

You definitely don't want the full URL in the ErrorDocument line.

And on my .php sites without this it won't do what I want. Wordpress seems to be the hardest to control, in fact I'm so pi$$ed of with two WP sites I've removed everything and I'm going to upload the images to my CMS gallery.

[HuskyPup]

Damn me it's now working without .* !.!.!

I forgot to mention the following:

Opera obeys all the rules and also redirects WP

Firefox obeys however you may need to refresh the browser it also redirects WP

MSIE 9.0.8112 tries to obey yet tends to crash a lot for me

My Chrome obeys images but NOT for WP

[Play_Bach]

I just checked my logs, for the last 1000 requests for the watermarked image (one I show in google search), 604 come from iPad g image search, and only 6 of them visited the website.

So just about 1% visit your source? As an iPad user, obviously I like not having to click back and forth between pages to see the next image. Too bad Google only offers a link to the source after the second click. That's a pretty weak position for the image holder to be in as the iPad user has a much stronger drive to get to the carousel than they do to visit the site.

[matrix_jan]

I think I have an idea. Why don't I advertise on my images through watermarking? :) The 604 image requests I was talking about were made in two minutes. Imagine the amount of content(images) I serve to google users.

An "buy $##%#@ app for ipad" ad would look nice at the bottom of every image...

[gbk666]

After trying out around 10 watermark solutions, redirect solutions, and wordpress plugins like google break dance and imaguard, i saw no real increase of traffic.

20% of my old traffic back yeah..but what are those compared with the traffic i had before?


i added the google image bot to the robots.txt now (after bing weeks ago) and it will stay that way as long as google screws with us webmasters.

What i do in the following weeks to get traffic back is to use facebook and twitter, writing more texts into galleries, and also join related forums every or every second day and talk there about my site or specific images including a link. In the long run that should work without relying on google.