All our infrastructure uses standard artwork in a variety of ways. For instance, events, articles, and other content, displays header and social media sharing artwork.
Artwork is attached as file attachments to any entity (such as events or articles). They use category and sub-category assignments to identify the artwork as such.
Required Asset Formats
The following standard formats and categories/sub-categories are supported:
- Header/Large: This is a large header displayed across the top of an entity on the web page. Standard size is 1600x600 pixels.
- Header/Wide: This is a wide version of the large header, displayed across the top of an entity on the web page when the total height of the browser is too short to make the regular large header look good. Standard size is 1600x400 pixels.
- Header/Small: This is a header displayed across the top of an entity on the web page (in small sizes or mobile versions) or the mobile app. Standard size is 1000x600 pixels.
- Header/Rectangle: This is a version of the art asset that is mainly used to share on social media. Standard size is 1200x800 pixels. Since this is usually shared outside our page, it should have a CODE logo as well as information about the element shared (such as event date), since this isn't embedded inside other infomration on our site.
- Header/Vertical Rectangle: This is a vertical version of the rectangular asset. This is used in places such as the homepage carousel. Standard size is 600x800 pixels. Note that this version may be used stand-alone, so it should have a logo and other information embedded.
- Header/Small Rectangle: This is a small version of the rectangular asset. This is generally used in lists. Standard size is 250x160 pixels.
- Header/Square: This is a square version of the header, usually used in space-constrained lists. Standard size is 250x250 pixels.
- Header/Video: This is a version of the art asset used to display as a media player background asset. Standard size is 430x263 pixels. Note that this version is used stand-alone and shoudl therefore have a logo. It will also be used for a recording from an earlier date, therefore, it should not have information such as dates in it (otherwise, it is getting dated too quickly).
Note: Assets are not necessarily displayed in the actual pixel dimensions. Often, they are displayed smaller, but especially in mobile device scenarios, that will result in higher resolution dispay.
Example Usage scenarios
- The following is a large header used to display an event:
- This is the same page displayed in a window that is not as tall (wide header):
- This is what the same page looks like when displayed in a very narrow window, or on a mobile device (small header):
- When this event is shared on social media, the “header rectangle” format is used.