Size Images for the IUP Templates

  • Warning!

    Image file names that contain punctuation will not show up properly on the website!

    Be certain the file name does not contain commas, apostrophes, etc. before uploading the image.

  • The IUP templates look best when you use images that are correctly sized to fit them.

    Please choose the correct width from the tables below, based on whether your site has been converted to the new responsive design, or is unconverted. (Learn more about the IUP website conversion.)

    Please resize your images before you upload them to the CMS library, or before you overwrite an image. This gives you better control over the reduction process and ensures that your website visitors are not downloading unnecessarily large images. Please avoid artificially resizing images that have already been uploaded to the CMS library.  Here are some of the easiest ways to resize photos.

    Converted Websites

    Recommended Image Sizes for Converted Sites
    Use
    WidthSettings
    Full width
    750 pixels
    Responsive
    Half width and below
    737 pixels
    Left- or right-aligned
    Responsive
    Half-width

    Note that portrait-orientated images can take up a lot of visible space on a mobile device. Once they fill the column, they may take over the whole screen. Use with care.

    When images are placed into content (pages or news posts) they need to have the correct settings applied in order to work best within the new, responsive website.

    Unconverted Websites

    Note that the news post template is narrower on unconverted websites, and so full- and half-width images for news items are smaller than for regular web pages.

    Recommended Image Sizes for Unconverted Sites
    Use Width Height DPI
    Main Image (Spans 2 Columns, or Width of Page) 553 pixels 200–318 pixels 72
    Half-Width Image (Spans 1 Column, or Half of Page Width) 271 pixels 203–360 pixels 72
    Quarter-Width Image (Spans ½ Column, or a Quarter of Page Width) 130 Pixels 98–173 pixels 72
    News Post Image (Full Width)
    400 Pixels Follow aspect ratio 72
    News Post Image (Half Width)
    200 Pixels
    Follow aspect ratio 72
    Image on Personnel Page
    100 Pixels
    Follow aspect ratio 72
    Photo Gallery Image, Horizontal 640 Pixels Follow aspect ratio 72
    Photo Gallery Image, Vertical 480 Pixels Follow aspect ratio 72