Photos and Pictures: Where is the best place to use them?

What's the best way to use pictures on my website?

  1. Use a picture in the "Primary picture on page" location to show people what they will be downloading when they click the download icons. If they are downloading a video, the ideal picture would be a screen shot from one of the video segments. If they are downloading a PDF file, the picture should be an illustration from the text, a picture of an old manuscript, a picture of a book, or a picture relevant to something mentioned in the story (preferably from their local culture.)
  2. Use pictures to illustrate pages containing Scripture text or stories. If you have pages full of text on your website, insert small pictures into the text to help explain the story, or that tell a visitor what the story is about. A person "skimming" the page will use the picture to decide if they should read the text.
  3. Use pictures (sparingly) to communicate who this website is for. Relevant pictures in the banner of the page can give a local flavor to a website. You may decide to use a photo background, or just choose a colored background. (You can create a tiny jpg with the background color of your choice, and upload it with the filename background.jpg)
  4. Although it is permissible to use local pictures to decorate the various pages of your site, care should be taken to examine the relationship between the media content and the picture content.

Quote from: Photos as Web Content:

Information-Carrying Images = Good

The commonality across all of these examples (and thousands more in our other studies) is that users pay attention to information-carrying images that show content that's relevant to the task at hand. And users ignore purely decorative images that don't add real content to the page.

Quote from: Preparing an image for the web (wordpress article):

File size

This is the most important part of preparing an image for your website. Images with a large file size take longer to download to a visitors browser and slow down your website.

For most ‘full page’ web images, you want the image to be 80Kb-100Kb at most. If the image is only part of a page (e.g. half the width of a blog post), then 20Kb-30Kb is usually fine.

Dropping image quality to 30-50% of the original usually doesn’t make any difference you can pick with the naked eye. Try it and see.

You can drop 2-3Mb images to 80kb-120kb and not really be able to see any change in quality.