3

This is what is getting to me.

Currently, the mobile version of my photo site allows people the option to view the photo full-size directly in their browser even tho its larger than the standard hardware pixel resolution most phones can handle. Because of this, I need to change my strategy so adsense bots don't think I'm linking non-mobile-friendly pages to the mobile site.

The only idea I have come up thus far is gzipping the image and offering the download as a gzipped file. This works fine for people with desktop computers, but I think this can be a disaster for mobile since mobile phones have limited memory and people have limited budgets and might not be able to find the right unzipping tool for gzipped files.

I ran tests with google page-speed insights on all my image download ideas.

For the idea to gzip the file, upon accessing the URL, the browser processes headers similar to this:

Last-Modified: Wed, 03 Dec 2014 05:00:00 GMT
Cache-control: max-age=864000,must-revalidate
content-disposition: attachment; filename="Photo2.jpg.gz"
Content-Length: 247064
Accept-Ranges: bytes
Content-Type: application/gzip

The desktop browser responds correctly asking the user to open/save the file, and the contents are correct and the compressed file is extractable. No problem there. However, with google's page-speed insights, I receive this message on desktop:

An error has occured

The URL was fetched, but nothing was rendered. Ensure that the URL points to an HTML page that loads successfully in a web browser. You may refresh to try again. If the problem persists, please visit the PageSpeed Insights mailing list for support.

It seems ok to me. So then I proceeded to try a jpeg image file itself and the browser then processes these headers:

Last-Modified: Tue, 23 Dec 2014 21:57:46 GMT
Accept-Ranges: bytes
Content-Length: 86685
Age: 0
Cache-Control: max-age=2592000
Content-Type: image/jpeg

Every browser is happy to display the image but google page-speed insights has an issue, particularly when testing with mobile.

Should Fix:

Configure the viewport

Your page does not have a viewport specified. This causes mobile devices to render your page as it would appear on a desktop browser, scaling it down to fit on a mobile screen. Configure a viewport to allow your page to render properly on all devices.

I also tried the option to make the image a forced-download image, almost like the gzip setup. The headers processed are:

content-disposition: attachment; filename="test.jpg"
cache-control: max-age=864000,must-revalidate
Content-Length: 86685
Content-Type: image/jpeg

In this setup, browsers are happy to offer this image as a file to download via a pop-up which is normal, but what got to me is that google reports the exact same problem about configuring the viewport.

I'm curious. What would be the best way to offer a full-sized downloadable image from a mobile website without resizing the image to fit the screen and without google's page-speed complaining about it?

Will I be forced to use the POST method and pray google doesn't complain even tho the button will look different compared to the rest already on site?

I want to make the process easy for mobile users without requiring too many extra steps and/or apps incompatible to some devices.

  • Dang you come up with some good ones!! Not sure. It may be that there is a JS (link) solution that keeps the big G at bay and your users happy. – closetnoc May 8 '15 at 2:31
1

You could explore a few options that pop to mind - not sure which one would be best for you, but you're probably the best judge to decide that for yourself:

  1. As @closetnoc suggested, create JS links that Google might not follow. This isn't going to be a permanently reliable option as Google is getting really persistent with rendering and following JS off-late.

  2. Add a specific parameter for the mobile version of the image, which you then just block Googlebot from accessing via robots.txt

  3. Use a simple user-triggered event, such as a simple anti-spam catch image, which stops the bot from following the link

  • They're nice ideas, but I can't go with #2 because the number of links I'd have to deal with would be at least a few hundred thousand. I'm gonna avoid #1 because I want to make the file accessible to all (including users with no JS support) and #3 is asking for extra steps from the end user and I doubt they will appreciate that, but thanks for the ideas tho. – Mike Jul 18 '15 at 17:20
  • Could you write a script that just appends the parameter for links to the full size image on mobile but not on desktop? Sorry I couldn't be of much more help. Not sure if you have many other options. – FarhadD Jul 18 '15 at 17:44

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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