GO! View Portal Logo Guidelines

RapidIdentity GO! View Portal Logo Guidelines

RapidIdentity GO! View will display a variety of theme logo formats, sizes, and aspect ratios however, there are some best practices that are likely to enhance the visual presentation of Classroom View themes.

Constraints

The Classroom View stylesheets will impose the following constraints at the following relative breakpoints. Note that most browsers default to a base font size of 16 pixels, so the values are given in "rem"s (root "em"), and the corresponding pixel value is based on the default base font size of 16 pixels.

1. Mobile (up to 576 pixels wide)
   max-height/max-width is 3rem/48px
2. Small (from 576 pixels to 768 pixels wide)
   max-height/max-width is 5rem/80px
3. Medium+ (above 768 pixels wide)
   max-height/max-width is 7rem/112px

Formats

Any image format that is compatible with an HTML image element will work, but the SVG format, as a vector format, is always the best choice for fidelity and resource size. If an SVG is not available, we would recommend PNG followed by GIF or JPEG.

See here for further information: https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types

Sizes

If you are using an SVG, then size is not an issue, as SVGs are vector formats that define an image mathematically as opposed to bitmap images which store information for each pixel based on the image size.

If you are using a bitmap format (PNG, GIF, JPEG, etc.) then you should avoid an image smaller than the largest display size of 112 pixels (in either dimension). You could consider future-proofing to support large image dimensions in the future by using an image up to 256 or even 512 pixels in either dimension. Either of these sizes would not represent an unreasonable increase in resource size and the key takeaway is that bitmap images will usually look fine when scaled down, but not when scaled up.

Aspect Ratios

The subject of recommended aspect ratios for SSO Portal logo images is somewhat subjective, but we would recommend staying with a range of 1:1 to 16:9. In other words, wider tends to look better than taller, but square/round works very well too.