Guide to Posting Images
For this web site, we follow these guidelines:
Content Module | Recommended Proportions (HxW) | Recommended Dimensions (px) | Max Width (px) | Max Height (px) | Min Width (px) | Min Height (px) | Notes |
Header – Large (incl. home pg) | 4×3 | 1800×1350 | 1800 | 1350 | 1800 | 1200 | Used as background, with some control on alignment. |
Header – Small | 2×1 | 1800×900 | 1800 | 1350 | 1800 | 800 | 4×3 ok to use here. Used as background, with some control on alignment. |
Teaser – Single | 4×3 | 1200×900 | 1800 | 1350 | 1200 | 800 | |
Teaser – 3 across | 4×3 | 800×600 | 1800 | 1350 | 800 | 600 | |
Teaser – Side-By-Side | 4×3 | 800×600 | 1800 | 1350 | 800 | 600 | |
CTA – Right Column / Sidebar | 4×3 | 800×600 | 1800 | 1350 | 800 | 600 | |
Articles – inline content image | NA | NA | 1800 | 1350 | NA | NA | Inline images can be any size desired. |
Posts – featured image | 4×3 | 800×600 | 1200 | 900 | 800 | 600 |
Featured images show up in blog feed, so using uniform proportions for all featured images is recommended
|
Posts – in-line content image | NA | NA | 1800 | 1350 | NA | NA | Inline images can be any size desired. |
Posts – gallery images | NA | 800×600 | 1200 | 900 | NA | NA | All images in a given gallery should be of the same proportions. |
Misc background images | 4×3 | 1800×1350 | 1800 | 1350 | 1800 | 1200 | Used as background, with some control on alignment. |
Important Notes:
*Image files should be cropped and then optimized (saved in a compressed file format such as .jpg or .png) before uploading, and file size should be kept below 1MB.
A given image can be used for multiple pages and modules.
It is better to re-use an image of the proper proportion even if it is larger than the recommended dimensions than to upload a smaller version of the same image.
No images wider than 1800px should be uploaded to the site for any reason. (Decreases site performance without improving image quality).
Image File Names
Image files should be chosen carefully before uploading. Use all lowercase and descriptive terms separated by hyphen. Remove non-descriptive or generic terms such as: to, of, from, with, photo, image, etc. Where possible, include the copyright owner’s last name. If necessary, retain numerical information in order to connect to the original image file. Example file names:
- Monardella-undulata-elizabeth-kubey-3×2.jpg
- abbotts-lagoon-dan-ocean-elizabeth-kubey-wide.jpg
- eriogonum-latifolium-artemisia-pycnocephala-ericameria-ericoides.jpg
Image Captions and Alt Text fields
Add content to the image caption and alt text fields when uploading images. This will help identifying content and photo credits in future searches, and for use throughout the site. (Note: Caption field is not always required, but Alt Text should be completed whenever the info is available).
Avoid Uploading Duplicate Image files
Images are stored on the site until manually deleted. Before uploading a new image, do a quick search in the media library for part of the filename you are about to upload. For example, if the filename is “vernal-pool-carol-witham.jpg” and a quick search in the image library for “vernal” brings up the same image in the same proportions, the existing image should be used, rather than uploading a duplicate.
PDF (and other uploads) filenames
File names should be chosen carefully before uploading. Use all lowercase and descriptive terms separated by hyphen or underscore. Remove non-descriptive or generic terms such as: to, of, from, with, etc. In order to facilitate back-end searches in the future (to avoid duplicate uploads and general clutter), files should be named with keywords describing the contents. Uniform labels are especially helpful in searching for all types of specific files and documents.
If in doubt about naming a new file for upload, do a quick search in the WordPress media manager for keywords relating to your new file. Examples:
- policy_cnps-lobbying-legislation.pdf (official CNPS policy docs)
- cc_cnps-201112_quarter_ed_report.pdf (chapter council related docs)
- chap_membership_functions.pdf (chapter-related docs)
- docs_articles-incorporation.pdf (official CNPS docs)
- bulletin-v36.2_apr-jun2006.pdf (CNPS Bulletin)
- fremontia_v36-2_3.pdf (Fremontia)