Since everything revolves around the product(s), those are what I'm referring to.

Quote Originally Posted by dbltoe View Post
So, any image taller than 742px will either scroll off the page or be forced to be resized by the browser, template, or some other image program like IH.
As I stated before, there are basically three ways images can be adjusted for whatever monitor is being used. If you were not using IH, your perfoormance score would be in the eighties versus your current 99.

Boootstrap does an excellent job without IH as long as the image is not too big to begin with.

In your case, with my 2048x865 monitor, your image is rendered at 640x480. It's the same for 1920x1080.

Therefore, if I use a smaller image to begin with, I can drop the IH and just let something like the current bootstrap take care of the sizing for other images.
So, let's compare your product (with responsive_classic and IH) to https://brothersandnobles.com/index....roducts_id=582 (with bootstrap)

Your page has a speed index of 1.0s while the B&N has a speed index of 0.6s. Part of the 1.0 is the number of images being managed, but still, that's almost double.

Your product image is rendered at 640x480 with the larger image starting at 888x795, then 663 high, then 635, then finally at 846x635 by IH.

B&N's product is presented at 274x300 (main reason for the 0.6 speed index) and the larger image at 600x656 (they went with max width of 600 for images) and more than fills the screen.

While I agree that putting the best foot forward is ideal, the larger image is where I would put my emphasis after making sure the page "paints" as quickly as possible.

The emphasis should be put on resolution vs size. https://largeprinting.com/resources/...n-and-dpi.html is a great article to discuss screen resolution versus print resolution.

Without a link to a competitor of yours, I can't compare their images to yours but you can see the importance of size and screen resolution. Thus, the reason for my recommendation of a standard max of 500 width for portrait images and 500 heighth for landscape images and a DPI of 72. Anything more and you run into overkill and overlap. i.e., if your Top Picks Popular Brands and Experience the ESC Circuit... were half the size, the customer would have access to a lot more data.