Images and Multimedia
Images and multimedia, when used correctly, enhance the meaning and depth of the content on IEEE sites.
Learn more about how to use imagery in the IEEE Brand Identity Guidelines (PDF, 14.2 MB) within the "Imagery" section on Pages 22 and 23.
Learn more about how to use multimedia in the IEEE Brand Identity Guidelines (PDF, 14.2 MB) within the "Multimedia" section on Page 24.
Images Within Content
Images used to explain content should be used sparingly to enhance the content and add to the visual interest of the page. If your content alone is not conveying a clear idea, you can add a graphic that may help a user to understand it better. An example of this may be a table, pie chart, or infographic. Only add graphics that directly relate to and enhance written content. Avoid stock photography in favor of IEEE commissioned photography or images. Contact the Experience Design Team for more information on stock image options.
Image Formats, Compression And Naming
Formats and types of graphics Recommended image formats are GIFs, JPEGs, and PNGs
- GIF: solid-colored images, line art, clip art; 256 colors maximum, supports transparency images
- JPEG: photographs, continuous tone images; gradients, does not support transparency
- PNG: bitmapped image format that employs lossless data compression and supports transparency
Images should be compressed to a smaller size to decrease page load times. There are a variety of software packages available to assist in compressing your images, such as Adobe Photoshop or Fireworks.
These are some free digital-based tools for image compression:
The following online tutorial offers information on optimizing graphics for the digital platform: The designer's guide to image compression
- It is not necessary to repeat words that appear within the directory in the file name.
- File names should be made as short as possible, while still having meaning to the user.
- Each file name within a folder or ZIP file should be unique.
- Use all lowercase and avoid special characters when creating file and folder names.
- Dashes (-) are recommended in place of spaces, except on IEEE.org.
Size And Quality
- Background images: Try to keep the file size around or below 10 KB (IEEE digital sites only).
- Banners and header images: up to 70 KB is acceptable.
- Thumbnail images: up to 45 KB is acceptable.
- High-end photographs: up to 100 KB maximum. Reduce resolution to 72 dpi for the web.
- Test your graphics on multiple platforms (PC/Mac) and browsers.
- For IEEE original photography and illustrations, use captions to indicate the source and purpose of the image.
When using images on a web page, be sure to use meaningful alternative text ("alt text") so that users with disabilities using assistive devices are able to understand the image(s). Examples:
Example alt text: airplane taking off
Example alt text: engineers working on solar panel
Example alt text: wind turbines
IEEE Master Brand as an Image
For information on how to use the IEEE Master Brand, please see the IEEE Brand Identity Guidelines "How to use the IEEE Master Brand" section (PDF, 5 MB).
The IEEE Master Brand is available for download in the IEEE Brand Identity Toolkit Master Brand section.
Submit any questions via the IEEE Brand Inquiries Form.
Multimedia And Interactivity
Multimedia can be used on IEEE sites to support the page's content. Multimedia should be used in a meaningful way and should support the page's content.
These guidelines cover audio, video, animations, and other interactive features whether the viewer or player is embedded in a page or external.
Many of these requirements are important for accessibility. The relevant WCAG 2.0 guidelines are listed in parentheses.
Help users understand what the multimedia element is and how it works.
- Identify the content of the media with a heading or explanatory text. (WCAG 2.4.6, 3.3.2)
- If an interactive element has a series of steps, identify the number of steps at the beginning. (WCAG 3.3.2)
- If the viewer or player is not embedded in the page, include a link to download it. For example, some media types, such as Flash or Java, require a player or plugin to be installed on the user's computer.
- If you include a link to download the file, indicate file type and size in parentheses after the link. For example: (MP4, 6 MB).
Make sure the multimedia is accessible.
- Provide closed or open captions for any video file. (WCAG 1.2.2)
- Include a transcript for any audio. The transcript may be displayed as text on the page or a separate file. (WCAG 1.2.1)
- Do not include any content that flashes more than three times per second unless it meets the general flash thresholds. (WCAG 3.2.1)
Give users control of the media and how it plays.
- Provide controls for pause, stop, and replay. (WCAG 2.2.1 and WCAG 1.4.2)
- Do not play the media in an endless loop. (WCAG 2.2.1)
Design elements of multimedia.
- Adhere to the design elements and IEEE Master Brand standards within the IEEE Brand Identity Guidelines (PDF, 5 MB).
Usability and Accessibility Guidelines of Multimedia
- Clearly identify the number of steps at the beginning of a sequence. For example, step 1 of 5 (if applicable).
- Provide an explanation of the animation file before it begins to help users better understand the animation and associated content.
- Indicate which type of viewer/player is necessary and provide a link to download the viewer/player (if applicable).
- If the file is downloadable, always indicate file type and size in parentheses after the link; for example, IEEE presentation template (PPTX, 2 MB).
- Allow animation to be user-controlled. The user should be able to pause, stop, replay, or ignore animation or other multimedia elements.
- Place actionable controls (such as buttons) in an inherent place within the file so users do not have to search for a way to advance.
- The typeface size within the file should not appear smaller than 8pt or .07 em.
- The file should have an absolute end and not loop.
- Provide an HTML or transcripted version of the file for users using assistive technology. Learn more about creating transcripts.
Please contact the Experience Design Team if you intend to use or have questions regarding multimedia content.
Do not use content and/or images from another site (including IEEE digital sites) without permission. For example, do not use Google images found through search without permission of the owner. Provide the source, as a caption, of all content that is not original once permission for publishing has been obtained.