A responsive website, such as typical BirdDog websites, has no fixed display "size." Displayed images, regardless of their actual dimensions, are usually resized to fit the screen, or more often, the width of the container they appear in: the content area of the website, or if divided into columns, the width of the column. The only practical limitation to image sizes used on the website is loading time—larger images take longer to load completely.
For Pages and Items on a BirdDog Ecommerce website, there are a number of Image slots available, and sizing recommendations:
- Icon Image (Items only) - Not currently used
- Small Image: This image appears in lists, on the cart, checkout, order and invoice pages. Optimal size of the small image will depend on the Page Layouts used on the site, but a rule-of-thumb is probably no bigger than 500px
- Medium Image: This image appears at the head of a Category or Item Page as the main illustration, and doesn't need to exceed the width of the "content area" of the site at full size, which will usually be around 1200-1500px wide.
- Large Image: This image is only used for a "preview popup" and has no limitation on size, other than, perhaps, the average computer/device's screen resolution, though very large images may be accompanieed by excessively long load times.
- Original Image: This image is intended for storage of the full sized image, but is sometimes used when the smaller images are not populated.
Images displayed in lists—usually the Small Image—should, optimally, all have the same aspect ratio (usually "square"), so they appear uniform when displayed in a row. The "actual' dimensions of the image are less important than the aspect ratio in this respect—different sizes will generally appear the same when restricted by their container.