Assets and Images

• All files available for download (i.e., PDFs) must meet accessibility standards outlined in Web Content Accessibility Guidelines 2.0 Level AA.
• When possible, build document content into a webpage instead of providing it as a separate document. 
• If secured, restricted access is required, work with MSU IT to determine the best method for file sharing. For example, a SharePoint file with restricted link access may meet unit needs. Clearly communicate restrictions in the website copy.

• Only use images for which the unit has usage rights. Owned images are fine. Creative Commons, stock or user-generated images are permitted if terms of service allow for use on the website and proper attribution standards are followed.
• Use images that are large enough in their used context to display clearly on large display monitors without pixelating. For example, larger and higher resolution images must be used for banners, but smaller images can appear in other sections of a webpage.
• Compress image files to reduce file size and help prevent slow webpage loading times. Use a free tool, such as ImageOptim or Adobe Express Image Compressor.
• For video thumbnails, upload an image still from the video with a resolution of 72 DPI.
• Note: In Sitecore, a play button will automatically be added. Do not manually add a play button graphic to the image prior to uploading.
• Suggestions for optimization of Photoshop images.
• In Photoshop, save as JPG using File > Export > Save for Web (Legacy)
• Use a quality setting of 20-30. The image may appear grainy at first but should be okay for web. The goal is to reduce file size as much as possible.
• Compress the file using ImageOptim or similar compression tool.
• Follow image size guidelines, where necessary, as outlined in component and system documentation.
• All images should have appropriate alt text.
• Add “high-res” to the name of any high resolution image uploaded to the CMS.
• When uploading images to a website media library, create subfolders to organize by page or site section.
• Recommended image file types include JPG or WebP for photos and WebP or PNG for logos and line art.

• Favicons are 16x16 icons displayed by browsers to the left of the URL bar and for bookmarks to websites.
• Favicons for all MSU websites should feature the MSU helmet. (See “Resources and Downloads” on the MSU Brand Studio website.)

MSU forbids the use of individual unit logos. Units are directed to use MSU Logos and Marks instead, to leverage MSU’s world-class brand.