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)

Post A Comment