Home →
Communications →
Policies, Guides and Standards →
Graphics Guide
1.5. Graphics Guide
FILE FORMATS
There are two basic types of computer graphic formats: bitmap and vector.
Bitmap
file formats: GIF, JPG/JPEG
program: Adobe Photoshop
- composed of a grid of squares (pixels)
- essentially a photo
- does not resize well
- used for both web and print communication
Vector
file formats: AI, EPS
program: Adobe Illustrator
- composed of points, lines and curves
- essentially an illustration
- resizes well
- used primarily for large-format and print pieces, especially when printing on items like pens, hats, banners, etc.
RESOLUTION
Resolution is measured by DPI (dots per inch). This refers to the amount of information per inch that a monitor can display or a printer can print. The resolution of an images should be optimized to the right DPI for the end format.
Web: 72 DPI
The greater the DPI, the larger the file size.
Newspaper: 150 DPI
Print: 300 DPI
The greater the dpi, the better the image clarity.
COLOR
Color Types
- RGB
- For the web/screen
- Consists of three numberical values/percentages for Red, Green, and Blue, respectively
- Images must be saved in RB for proper web use
- Example: Golden Orange would be: 255, 204, 0
- Hex (Hexadecimal)
- For web/HTML
- Consists of 6 characters, often designated by a preceding hash mark
- Most often used in HTML
- Example: Golden Orange would be: #ffcc00
- CMYK
- For print/photographs
- Consists of 4 numerical values for Cyan, Magenta, Yellow, and Black, respectively
- Example: Golden Orange would be: 1, 19, 200, 0
- Pantone
- For print/spot colors
- Pantone is a standard color matching system for ink colors for print shops
- Example: Golden Orange would be: Pantone 7406 PC
Color Usage
- Primarily you will use RGB and CMYK for images
- When you emphasize with color, emphasize sparingly, as when you emphasize everything, you emphasize nothing
- Please see the Graphics Manual for official UConn colors
FONTS/TYPOGRAPHY
Font Types
There are two basic types of computer graphic formats: serif and sans serif. Serifs are the small lines/curves or embellishment found at the ends of lines in a font.
Serif fonts
Examples: Adobe Garamond Pro, Century, Georgia, Perpetua, Times New Roman
- have embellishments (serifs)
- easier to read in print; great as headlines
- not ideal at small font sizes
Sans Serif
Examples: Arial, Calibri, Franklin Gothic, Myriad, Tahoma
- do not have serifs
- easy to read on the web/screen
- ideal at small font sizes
Usage
- Generally, do not use more than two fonts on one page
- Generally, use Sans Serif on the web and Serif fonts in print
- For a Western audience, fonts and copy usually read best when aligned left. Right or justified alignment reduces readability significantly
- Use bold/italic versions of a font sparingly because if you emphasize everything, you emphasize nothing