DAR Digital Spec Sheet

Websites

Page Banners
Block Page Banners
Campaign Page Banners
Stories
Giving Site Homepage: Featured Opportunity
Giving Site Homepage: Opportunities Thumbnails
Alumni Site Image Grid
Traveling Owls
AR Staff Directory

Email Banners
Email Footers
Alumni Newsletter
Events Digest
@Rice
Parents & Families Newsletter

Social Media

Facebook
Twitter
Instagram
LinkedIn
YouTube

Websites

Page Banners

Specs: 1600x500px; 72ppi; JPG/PNG

Examples: Most basic webpages outside of homepages, special landing pages and the campaign site.

Mobile Safe Zone: Keep the focus of the image within the middle 350px. The way in which Drupal resizes page banner images for mobile will crop out anything not contained in this "safe zone." In Photoshop, set guides at 625px and 975px and confine text/logo/design elements within them to avoid cropping on the majority of mobile displays.

Block Page Banners

Specs: 1920x600px; 72ppi; JPG/PNG

Examples: Homepages (alumni.rice.edu, giving.rice.edu) and landing pages that use the block structure (Traveling Owls homepage).

Mobile Safe Zone: Keep the focus of the image within the middle 350px. The way in which Drupal resizes page banner images for mobile will crop out anything not contained in this "safe zone." In Photoshop, set guides at 785px and 1135px and confine text/logo/design elements within them to avoid cropping on the majority of mobile displays.

Campaign Page Banners

Specs: 1920x900px; 72ppi; JPG/PNG

Examples: All pages within the campaign site with the Be Bold branding, including the home page, "Bold Goals" pages and "Schools & Units" pages.

Mobile Safe Zone: The campaign site is set up differently than the rest of the sites within Drupal and banners will remain at 100% width, so there isn't a need to design around the mobile cropping that occurs with other banners.

Stories

Stories require both a banner image and a thumbnail image to use in feeds.

Specs: Banner: 1380x500px; 72ppi; JPG/PNG; Thumbnail: 500x500px

Giving Site Homepage: Featured Opportunity

Specs: 1380x500px; 72ppi; JPG/PNG

Giving Site Homepage: Opportunities Thumbnails

Specs: 600x400px; 72ppi; JPG/PNG

Alumni Site Image Grid

Specs: 400x300; 72ppi; JPG/PNG

Traveling Owls

Trip Thumbnails: 800x550px; 72ppi; JPG/PNG

Trip Banners: 1920x600px; 72ppi; JPG/PNG

AR Staff Directory

Profile pics: 900x900px; 72ppi; JPG/PNG

Email

Email Banners

Specs: 600px wide; 72 ppi; JPG/PNG

Email banners should be 600px wide, but the height can vary for more narrow, traditional banners or bigger, splashier banners. However, for accessibility and deliverability reasons, emails should include live text and not be comprised solely of an image.