Image guidelines

This page gives you a rough guide for creating images for the platform.

Format

Recommended format for images: .svg

Size guide for image elements

• Landing page hero image: Depends on the art direction, but if you want to use the full width of the screen: width 1920px and height 602px. If you wish, you can make the image wider, but you'll have to keep the image height.
• Chapter card image: width 528px and height 370px
• Body text image: Maximum width 768px; the height is not defined - any height is fine as far it doesn’t break the aspect ratio of the image.
• Hero-image on chapter page: It is possible to place .svg (Scalable Vector Graphics) images to chapter page hero sections.
• Hero-image on (lesson) pages: It is possible to place .svg (Scalable Vector Graphics) images to page hero sections.

Hero images

• Image format: .svg (Scalable Vector Graphics)
• Smaller is better: Make hero images as small possible in file size.
• Do NOT include a background color. Background color will be added in the course platform.
• Only use images up to 1 MB (1000 KB).
• Make images repeatable, pattern-like. This we can seamlessly repeat the same image on wider screens. OR Make image edges (left and right) end in the image background color. This way the image blends to the background on larger screens.

Send images to the MOOC Center team to see that they work within the course platform. Alternatively add the images to the course platform yourself and notify the MOOC team, so they can check that the images meet the requirements of the platform.