How to Resize Images To Fit on Screen
At diglloyd.com, images on the subscriber pages are displayed in two ways:
- Example pages containing “inline” images on a mainpage.
- Standalone “gallery” pages displaying the full resolution example along with its actual-pixels crops.
The “inline” images are typically displayed at 1280 pixels wide for landscape orientation images, and ~800 pixels wide for portrait orientation images. In most cases, clicking an image opens a new window with a higher resolution version on a black background.
Web browsers vary in speed and responsiveness and quality of display. Apple Safari or Google Chrome recommended in most cases.
If the image does not fit, a size control is available.
Scaling to fit
The most basic control affects the whole page, not just images: in Apple Safari, useout ( or to scale the entire page proportionally. This is not image scaling per se because it scales everything on the page, but it can be quite useful.
Screen sizes are changing with time. For this reason and others, the large gallery pages offer a resize control, shown below.
Please note that after changing the sizing, the page must be refreshed for all the images on it to be resized (otherwise only the chosen image is resized). This is the Refresh command in browsers (in Safari).
Especially for users with lower resolution screens, the “Fit to window width” setting is most convenient. But this is also very useful for even larges screens, because sometimes the images can be wider than even the highest resolution screen.
The Fit to window width choice is intelligent; it won’t show a crop at a width greater than its actual size (to avoid pixellated display).
Clicking the popup menu above shows the choice as follows:
Try it out
Click the image below then use the sizing control to experiment.