Image Specifications
Ensure the images/photos you plan to include in your site or in our programs repository meet the following specifications.
IMPORTANT - Image Copyright/Permissions - You must have proper copyright/usage permissions for the photos, images, graphics that use on your website. It is your responsibility to ensure that you do.
Requirements
- Quality - Original size (MUST meet minimums shown below); (If you don't have the capacity to optimize images for the web, then send us your images at the highest quality and resolution you have available, and we will resize and optimize them.)
- File Type - JPG or PNG; send logos and icons as PNGs or SVGs
- File Size - Ensure that the file size is reasonable. For example, photos directly from a camera will be too large for the web; they must be resized and saved for the web.
- Orientation - Horizontal, with backgrounds that are not busy
- Filenames - Short, clear, and descriptive. Filenames should be all lowercase, with no spaces or special characters. Do not name images with only numbers.
- ALT Text - Required for accessibility. Learn more about the accessibility requirements for non-text elements. ALWAYS provide short, descriptive alt text that explains what is in the image. In certain browsers alt text displays when a user hovers over an image. Alt text is required for accessibility, and read by screen readers used by blind individuals and/or those with low vision. In the alt text, include who is in the picture, where is it, and what are they doing.
- Text within Images/Graphics - Avoid including text within images since that text is not accessible by screen readers. If there is text within an image, the important text MUST be included in the alt text, captions, and/or body content, which surrounds the image. Learn more about the accessibility requirements for non-text elements.
Options
- Captions - Optional; short descriptive text, when needed/if available
- Credits - Optional; include photo credits when required and/or available
Dimensions & Resolution Specifications by Photo Location
Photo Location |
Width x Height (in pixels) |
Resolution |
Examples |
Hero: Image only |
940 x 460 |
72 dpi |
NYC.gov/ajc |
Hero: Image plus left status bar only |
820 x 460 |
72 dpi |
|
Hero - Image plus right side bar only |
720 x 460 |
72 dpi |
NYC.gov/veterans |
Hero: Image plus left status bar and right side bar |
600 x 460 |
72 dpi |
NYC.gov |
Programs |
480 x 480 |
72 dpi |
NYC.gov Programs Page |
Custom |
480 x variable height; all pics in module should be the same height |
72 dpi |
NYC Nonprofits - Refer to the "Related Links" module at the bottom of the home page |
In-line and Photo Gallery Images |
800 pixels wide max x variable height |
72 dpi |
NYC Design - City Hall's
Governor’s Room Third Floor
|