Nikon AF-S Nikkor 200-500mm f/5.6E ED VR Lens Test : 500mm

Nikon AF-S NIKKOR 14-500mm f/2.8-5.6E ED VR Lens

Ok, so the headline is a joke, but it would be nice to own such a lens :)  I recently got the Nikkor 200-500mm f/5.6 lens and was in Squamish looking for Bald Eagles.  With me I also had my Nikkor 14-24 f/2.8 and Nikkor 24-70 f/2.8 lenses.  The 14-24 and 200-500 represent the two extremes of the focal lengths I'm able to shoot.  I thought it may be fun to do a test to see just how much difference there is between 14mm and 500mm.  I threw in a few intermediate focal lengths as well.  The scene is in Squamish, BC, Canada beside the BC SPCA and looking northwest to Mount Garibaldi.  All photos taken with the Nikon D810.

14mm

Nikon AF-S NIKKOR 14-24mm f/2.8G ED Lens Test : 14mm
Nikon AF-S NIKKOR 14-24mm f/2.8G ED Lens Test : 14mm

 

24mm (I noticed a slight difference at 24mm between the 14-24 and 24-70, discussed below.)

Nikon AF-S NIKKOR 24-70mm f/2.8G ED Lens Test : 24mm
Nikon AF-S NIKKOR 24-70mm f/2.8G ED Lens Test : 24mm

 

70mm (Sorry for the typo on the image text, obviously not the 14-24.)

Nikon AF-S NIKKOR 24-70mm f/2.8G ED Lens Test : 70mm
Nikon AF-S NIKKOR 24-70mm f/2.8G ED Lens Test : 70mm

 

200mm

Nikon AF-S Nikkor 200-500mm f/5.6E ED VR Lens Test : 200mm
Nikon AF-S Nikkor 200-500mm f/5.6E ED VR Lens Test : 200mm

 

300mm

Nikon AF-S Nikkor 200-500mm f/5.6E ED VR Lens Test : 300mm
Nikon AF-S Nikkor 200-500mm f/5.6E ED VR Lens Test : 300mm

 

400mm

Nikon AF-S Nikkor 200-500mm f/5.6E ED VR Lens Test : 400mm
Nikon AF-S Nikkor 200-500mm f/5.6E ED VR Lens Test : 400mm

 

500mm

Nikon AF-S Nikkor 200-500mm f/5.6E ED VR Lens Test : 500mm
Nikon AF-S Nikkor 200-500mm f/5.6E ED VR Lens Test : 500mm

 

Now an overlay between 14mm and 500mm, move mouse left/right to see both images.
[before_after border="true" border_width="2" border_color="#FFFFFF" direction="vertical" start=".50" angle="5" slide="hover" return_on_idle_interval="5000" return_on_idle_duration="1000" arrow_color="#FFFFFF" arrow_gap="5" arrow_offset="0" scrollbar_pos="top" scrollbar_color="#FFFFFF" scrollbar_thickness="8" scrollbar_button_color="#FFFFFF" scrollbar_button_thickness="30" before_image_id="5460" after_image_id="5467" arrows="true"]

 

When does 24mm not mean 24mm?
Finally, when reviewing images taken during the testing I saw a difference between the 24mm images shot with the 14-24mm and 24-70mm.  Here are the two images side by side.
[before_after border="true" border_width="2" border_color="#FFFFFF" direction="vertical" start=".50" angle="5" slide="hover" return_on_idle_interval="5000" return_on_idle_duration="1000" arrow_color="#FFFFFF" arrow_gap="5" arrow_offset="0" scrollbar_pos="top" scrollbar_color="#FFFFFF" scrollbar_thickness="8" scrollbar_button_color="#FFFFFF" scrollbar_button_thickness="30" before_image_id="5466" after_image_id="5465" arrows="true"]

 

I then applied Lightroom's lens correction to both 24mm images, to see if that would close the difference.  A greater change was made to the 24-70, but there is still a substantial difference between the two.  Here are the two corrected images.

[before_after border="true" border_width="2" border_color="#FFFFFF" direction="vertical" start=".50" angle="5" slide="hover" return_on_idle_interval="5000" return_on_idle_duration="1000" arrow_color="#FFFFFF" arrow_gap="5" arrow_offset="0" scrollbar_pos="top" scrollbar_color="#FFFFFF" scrollbar_thickness="8" scrollbar_button_color="#FFFFFF" scrollbar_button_thickness="30" before_image_id="5468" after_image_id="5469" arrows="true"]

 

If anyone is curious on how the 200-500mm performed when shooting eagles, I have yet to process most photos but here are a couple initial images.

Brackendale Bald Eagle in Flight : Nikkor 200-500 f/5.6 VR Lens
Brackendale Bald Eagle in Flight : Nikkor 200-500 f/5.6 VR Lens

 

Brackendale Bald Eagle in Tree : Nikkor 200-500 f/5.6 VR Lens (500mm)
Brackendale Bald Eagle in Tree : Nikkor 200-500 f/5.6 VR Lens (500mm)

Image Resize Resolution Irrelevant for Web Original File

Image Resolution Irrelevant for Web Display

I often see tutorials on the web about proper image resizing for the web, I actually found a few when looking for info related to my previous post on image compression.  All of these tutorials preach the '72 ppi' mantra saying that computer monitors can't display more than 72 ppi so setting this higher creates bigger images and is wasteful.  I'm not sure where this all started, but it's nonsense.  This page has some useful info and worth a read for another explanation.  What I'll demonstrate here is how this setting has absolutely no influence on images displayed in your browser.  This ppi (pixels per inch) setting only matters when you print your images.

When displaying images online, think in terms of pixels and forget about ppi.

This is the image I chose to work with, already exported and visible on my site.  It has image dimensions 1920x1366 and a file size of 112 KB.  I'm going to resize this image twice with two different image resolutions.

Image Resize Resolution Irrelevant for Web Original File

 

First, using these settings in photosho.  Notice the 72 ppi, the 'industry standard' and 'correct' way of doing things.  Anything more or less would just be wrong.

Image Resize Resolution Irrelevant for Web - Resize Options 1

The resize options create a file that is 55 KB in size and looks like this:

Image Resize Resolution Irrelevant for Web - Result 1

Now you can say that Wordpress is changing the dimensions, etc.  If you think I'm doing something odd here just look at the file on it's own in your browser window: link to image.

Now I'm going to resize the original image again, this time with a different setting for ppi but the same image dimensions.

Image Resize Resolution Irrelevant for Web - Resize Options 1

7200 ppi? You can't do that!  It will create a huge image and take forever to download for my users.  It won't look right in my browser.  This goes against everything I have learned.  Well, the options above create an image that is also 55 KB in size and looks like this:

Image Resize Resolution Irrelevant for Web - Result 1

Again, if you think Wordpress is doing something odd feel free to view the image directly: image link.

As you can see, the ppi setting in the image resize dialog is irrelevant for web display.  It doesn't change your file size or how the image is displayed in the browser.  I urge you to try this yourself and help end this 72 ppi myth that is so prevalent on the internet.


Lightroom export jpeg quality 30

Image Compression Shootout: Lightroom, Photoshop, JPEGmini, and Smush.it

Using the smallest images possible while preserving quality is important because small images load faster.  If your site visitors have to wait a long time for your site and images to load they are likely to just move on.  There are several methods of reducing the size of your images, here I compare four different methods, though there are certainly other methods (software).  I use Adobe Lightroom 4.2 for most of my image management and editing, with some work in Adobe Photoshop CS5 for some extra editing when needed.   To reduce the size of my images I most often used JPEGmini but then stumbled across a WordPress plugin called Smush.it, which is an easy way to tie in the web service from Yahoo.  Since there is a Wordpress plugin that can automatically shrink your images as you upload them, it seemed like the ideal solution to my compression workflow as it was easy and integrated into the website.  I decided to do a quick and rather non-scientific test between Lightroom, Photoshop, JPEGmini, and Smush.it to see which would work the best for me.

I took one of my photos and exported it from Lightroom with jpeg quality at 85, color space sRGB, and width on the long edge 1600.  This might be a common way people export photos for posting online and it was my 'control'.  The image size is 643 KB, which is certainly not small.  This is the image (click for full size).

Lightroom export jpeg quality 85
Running this image through Smush.it, it gets compressed down to 553 KB, which is a minor savings.  Note, the Wordpress plugin and Smush.it website produce the same results, in case you were wondering.

Lightroom export jpeg quality 85 with smushit

However, running the same control image though the JPEG mini site results in an image that is only 234 KB, which is a substantial savings in size over the control and, as promised, no reduction in image quality.

Lightroom export jpeg 85 with jpegmini

Next, I tried the Photoshop "Save for Web & Devices" option using "JPEG Medium" which was the default.  It was also set to JPEG quality 30, optimized, resize to 1600, quality bicubic.  The result is a file size only 111 KB in size which still looks excellent despite the low JPEG quality setting.

Photoshop save to web jpeg medium
So it looks like Photoshop's export option may be the best of the bunch so far, but I decided to do a bit more.  I exported a few more samples from Lightroom, at JPEG quality 50 which results in a file of 187 KB in size and a slight reduction in quality compared to the Photoshop export which is even smaller.  Note that the differences are relatively minor, but present.  Best if you can toggle between two images quickly as I was doing on my screen.

I also exported from Lightroom using JPEG quality 30, though I'm not sure if this is directly equivalent to the Photoshop JPEG quality setting.  If so, Photoshop's export and resize algorithm must be better than the one in Lightroom.  This option yields a file size of 129 KB, which is still bigger than Photoshop's and not as good in terms of quality.

Lightroom export jpeg quality 30

I also tried exporting from Lightroom using quality settings of 65, 60, and 55 and running all of those through JPEGmini to see if I can get smaller results than Photoshop but I couldn't.  A Lightroom export at 60 processed via JPEG mini was still 172 KB which is a significant difference over the 111 KB file that Photoshop produced.  For Lightroom to match Photoshop in terms of file size, I had to export the file with JPEG quality set to 20.  At that point there is a noticeable drop in quality.

You may also be wondering, why not use the Photoshop export then ALSO run it through JPEGmini or Smush.it.  I did that and Smush.it could do no better so it left the file intact.  JPEGmini reduced the 111 KB file to 104 KB, which is not enough savings to make the effort worthwhile.

CONCLUSIONS

  • Smush.it is not worthwhile, it really doesn't compress the images enough.  Also, the plugin timed out several times when I was trying to use it and the site is slow.  Also, the bulk compression for your Media library doesn't work, it timed out on me several times after only compressing a few images.  I'm not planning to use it and have removed to plugin from my Wordpress install.
  • JPEGmini does an impressive job of reducing the file sizes of images exported with a relatively high quality.  If you don't have Photoshop or find the export dialog or workflow cumbersome JPEG mini is a viable option.  It certainly warrants use over no compression or optimization at all.  It also does a good job of batch processing images, so you can upload a pile of them and download a zip file of your optimized files.  Fast and efficient, and what I have done for many of the images on this site.
  • Lightroom can get decent file sizes, but simply via JPEG compression settings.  If image size is important, it won't do a good job on it's own.  I would export a JPG with a quality setting somewhere between 60 and 85, then run the resulting image through JPEGmini.  You will optimize the image enough that it makes the extra step worth it.
  • Photoshop does the best job, at least in this limited test.  I suppose the most expensive option in this test should be doing the best job.  It seems that Adobe have created a very capable and powerful image export option here, use it for the smallest sizes while preserving quality.  If you have Photoshop, use it.  My only potential issue may be the workflow, though I need to do more testing with it.  JPEGmini makes it easy to process large batches of images.  Photoshop does have an automation/batch system, I'll have to give it a try to see if it will be as fast as the Lightroom/JPEGmini combo.

 

BEST: Photoshop Save for Web & Devices.  No other optimization needed.

GOOD: Lightroom export with JPEGmini optimization.

CRAP: Smush.it.  Not worthwhile for any images.

 

If you have any comments or suggestions, please leave a comment and I'll follow up.

 


Orange Flower Post Retina 2X Plugin

Testing "Retina 2X" Plugin for Wordpress

This content is password protected. To view it please enter your password below: