Image Size Reference for 2017 Templates

These image sizes should be used throughout the pages of Miami's website if using the 2017 template. (You will know if you are using it.)
* Remember to keep consistent image sizes for features with rotating images


Main Carousels

These replace the banner image banks and homepage slides from the old template.

Universal page, "thin-wide" layout (main carousel)

Example: Application for Admission

  • Width: 860px
  • Height: Variable (260px minimum, 400px maximum recommended)
  • Existing banner images will be stretched by the template to fit in the new space, it is not necessary to resize all of these images unless you want to.

Universal page, "wide" layout (main carousel)

Example: Financial Aid

  • Width: 1030px
  • Height: Variable (300px, 350px, or 400px recommended*)
  • Existing banner images will be stretched by the template to fit in the new space, it is not necessary to resize all of these images unless you want to.

Landing page (carousel)

Example: High School Admission

  • Width: 1200px
  • Height: Variable (250-400px* recommended)

News Article

  • Width: 1030px
  • Height: variable (400px recommended)

Mobile Images for All Page Layouts

Carousels provide fields to add a mobile version of your images. This is where you can insert a secondary image that is optimized for viewing on a mobile device (smart phone, tablet). Normally when a person views a page on a mobile device the banner image is simply reduced in size to fit; if you have text in your image it can become illegible. By including a Mobile Image, optimized for a smaller screen, you can preserve legibility.

Example: Visit the the Financial Aid page and reduce your browser window width to see this in action.

  • Width: 700px
  • Height: 600-700px*

Social Media

  • Facebook - 1200 x 628 (470 x 246 minimum)
  • Instagram Post - 1080 x 1080 (appears as 612 x 612 in feed)
  • Instagram Story - 1080 x 1920
  • Twitter - 1024 x 512 (appears as 440 x 220 in feed) (2:1 ratio)

News Articles: Sharing on Social Media

Make sure the "Facebook Thumbnail" field has an image attached if you would like for an image to automatically appear when sharing a news article on Facebook or Twitter. Reusing the image for a banner will work. The image must be less than 5mb or it won't appear, preferably less than 500kb.

Size (2:1 ratio):

  • Width: 800px
  • Height: 400px

Content Rows with Slots and/or Widgets

For Landing and Universal page types.

If MORE THAN ONE slot or widget per row

Example: Global Initiatives/ISSS

  • Maximum Width: = 700px
  • Height: Variable

Only ONE slot or widget per row

Example: Transfer Preview Days
Virtual tour banner at the bottom of the page.

  • Maximum Width: = 1170px
  • Height: Variable

Left Column content slots and widgets

Example: Accepted Students

  • Width: 700px
  • Height: Variable

Footers

Secondary Footer

Example: IT Services

  • Width: = Variable (200-300px recommended)
  • Height: Variable

News Articles