IEEE Web Presence Style Guide: Branding and Visual Elements (Look and Feel)

Web publishers should ensure that navigation, layout, design, and other site elements are used in a predictable way across the site.

Consistency with overall Web and industry best practices is also generally advised to satisfy user expectations and to allow more time to be spent focusing on content rather than learning how to use the site.

Finally, sites should align with the IEEE brand and should look like they are all part of the same family. However no two sites should look identical or even similar enough that it may be unclear which site the user is on. For example, IEEE sites should not use the same color combination and layout as IEEE.org as this could create confusion.

Following IEEE guidelines will help sites create an appropriate level of consistency.

Imagery used consistently can support the IEEE brand identity.

• If imagery is used on your site, it should reflect the The six imagery themes below. These  themes are based on key pillars of the IEEE brand and reflect the IEEE brand personality and style, as well as IEEE members, areas of expertise, and history;

People	Technology	Knowledge	Connected	Global	Archive

• Real photographs (not clip art or stock images) should be used whenever possible to convey these themes. When real photographs are not available, stock photography that looks real is acceptable, but should only be used in meaningful ways;*
• Learn more about how to use imagery in the IEEE Visual Identity Guidelines (PDF, 3.11MB) document within the "Design System: The Wedge" section.

*Royalty-free images are available to purchase from various stock photography collections on the Web and can be purchased for a one-time fee for usage in an unlimited number of applications, an unlimited number of times.

IEEE sites should utilize the IEEE color palette to create a more unified look and feel throughout the IEEE Web presence. Although the palette offers a broad range of colors, it is advised to use only 2-3 colors from either palette predominantly throughout the site. Additional color usage within or outside the palette should be used sparingly and purposefully.

View the IEEE color palette in the "Brand Basics: Color" section of the IEEE Visual Identity Guidelines (PDF, 3.11MB)

IEEE Primary Color

#006699

IEEE Bright Color Palette

#CC0033

#E37222

#FFCC33

#66CC33

#008542

#009FDA

#6B1F73

#FFFFFF

IEEE Dark Color Palette

#800031

#CB7E2B

#CC9933

#669933

#336633

#0B5172

#541868

#000000

IEEE typefaces can be referenced in the IEEE Visual Identity Guidelines (PDF, 3.11MB) in the "Brand Basics: Typography" section.

IEEE Web presence sites should use a font designed especially for screen such as Verdana.

Font sizes should be set using relative units such as ems, percentages (%), or pixels so that users can resize text. Points (pt) are intended for print media only, and should not be used.

The minimum body text size should not be smaller than 0.75 ems if the body text is set to 12 pixels. The minimum disclaimer/secondary text should not be smaller than 0.7 ems.

The primary text color should be black or dark grey (recommended color is #000000 or #333333) across the site; do not use different colors for unlinked text.

The wedge device, based on the graphic style of the diamond symbol from the IEEE Master Brand, is also a key element of the IEEE design system. This symbol, which has a long history at IEEE, has been enhanced to create a unique and dynamic look-and-feel system that can be applied across all of the IEEE branded communications. Using this graphic style correctly and consistently will help build a recognizable and powerful brand look-and-feel, creating equity for the IEEE brand.

Learn more about how to use the wedge design in the IEEE Visual Identity Guidelines (PDF, 3.11MB) document within the "Design System: The Wedge" section.