Image Help and Resources
Approved images
It is recommended to use Â鶹Æƽâ°æ approved images from our online photo gallery. Contact our staff photographer with any specific photo needs or requests. If you choose to go with your own images, be sure that the images are high-resolution quality. See the offical photo policy
Photo Sizing
OU does not limit the size of files to be uploaded, but it is still best practice to edit your images to the desired size before uploading. This is to make the loading of images much faster and easier for our webpage users, and also to conserve space on our server. You should always edit the full-sized image using your choice of image editing software, PRIOR to attempting to upload it to the web.
Sizes Images on a standard page
Header Background Image
The default header has a dark green background with the name of your site in white. You can replace that color with a photo background in a snippet.
Ideal dimensions
1920px wide
~240-360px tall
Standard Page - full-width
A full-width photo on the main content area of a standard page
Ideal dimensions
1070px wide
~350-600px tall
Standard Page - 1/2 width
A half-width photo on the main content area of a standard page
Ideal dimensions
535px wide
~200-600px tall
Standard Page - 1/3 width
A 1/3 width photo on the main content area of a standard page
Ideal dimensions
355px wide
~250-450px tall
Standard Page - 1/4 width
A quarter-width photo on the main content area of a standard page
Ideal dimensions
265px wide
~150-400px tall
IMAGES iN A photo Gallery
Default Photo Gallery
The basic photo gallery is a slider with hollow dots on the bottom-left. The most important thing to remember for this gallery is that every photo should have the EXACT same dimensions. If the photos do not have matching dimensions, you will most-likely see a grey bar appear that the bottom of the photos with a lesser height.
Suggest number of photos: 5-8
Filmstrip Photo Gallery
The gallery has a left and right arrow for the user to navigate around. It also includes a lightbox when the user click on a photo.
If you are working with photos with multiple dimensions, this gallery can adapt. The width can be whatever you'd like but the maximun height is 700px.
Suggest number of photos: 8-15
Column Gallery
This shows all your photos at once in either 3, 4, 5 or 6 columns. If you are working with photos with multiple dimensions, this gallery can adapt. The photos restructure themselves around automatically in order to create the most even columns possible. If the photos are all the same dimensions, it'll look clean and even. If the photos are not the same dimensions, the layout might remind you of a pinterest layout. The width of the photo can be whatever you'd like but the maximun height is 700px.
Suggest number of photos: 10-30
See examples of photo galleries and how to customize them
IMAGES oN A News Article
News Featured Image
This is the top photo at the beginning of the news article template.
Ideal dimensions
935px wide
~400-600px tall
News Article Image
This photo is full-width and sits on a line of it's own on the narrow news article content area.
Ideal dimensions
645px wide
~300-500px tall
News Thumbnail Image
This is the circle photo seen on the news index page.
Set dimensions
550px wide
550px tall
Things to consider
It's important to note that an image that is too tall will push your content down the page, particularly if you have an overlarge banner. Some widescreen monitors have a very narrow vertical viewing space, so it's a good rule of thumb to keep your images as small as possible.
In addition, some browsers will render overly large images poorly, so while a larger image may technically fit, you may find a better presentation with a smaller image. Also keep in mind that many users are visiting your web site on their smartphones, iPads and netbooks, which have very small screens, and load large images very slowly. Smaller is sometimes much better!
Updated on April 2019