So you want pictures on your web site ?

1
(No Transcript)
2
So you want pictures on your web site ?

• ECUSA Digital Media Services Workshop by

John Rollins,
Cindy Meneghin
and Jan Paxton
3
Simple Overview

• Put all of your pictures into one folder
• Enhance and resize your pictures for web quality
• Make a web page (or pages) on which you can
  display your pictures and put it into the same
  directory as the photos
• Put the pictures into the web page(s) with
  suitable identification
• FTP the pictures and the web pages to their
  directory on the server

4
Whats this one folder??

• Html links on web pages need complete information
  
• When all of the items for a web page are in one
  folder, the links are easy to make
• If the items are not all in one folder, the
  program makes local links which will not work on
  the internet

5
Enhance

• Crop photographs
• Adjust lighting/color
• De-speckle scanned photographs
• Sharpen images unsharp mask is good
• Discard photographs that are not of adequate
  quality!

6
Resize

• The general low resolution screen width on the
  web is 600 pixels
• Pictures larger than 300 pixels will fill most of
  the screen
• Uniform height for pictures on a page is
  esthetically more pleasing than assorted heights

7
More Resizing

• Check the dimensions of your original photograph
• Resize in jumps of about 200 pixels
• Use unsharp mask from the filters menu
  between each stage of resizing

8
Make a Web Page

• Set up your web page with all of the
  identification information for your site
• Figure out a navigation system if you are doing a
  whole set of picture pages
• One or two small pictures can be placed in a page
  of text using align left/right

9
More web pages

• A photo-album web page should not have more
  than 6 pictures
• Make a table with a cell for each picture and an
  adjacent cell for a caption
• With pictures 200-250 pixels wide, a table with 6
  rows and 3 columns works well (narrow, empty
  middle column, captions below)

10
And More Web Pages

• Use thumb-nail pictures with links to larger
  photographs
• Consider placing a photo album folder on your
  site
• Place the pictures in the album and thumb-nails
  on text pages
• Find a page you like and copy it!

11
Suitable Identification

• When possible, the photographer should be
  credited
• Check spellings and titles when identifying
  people in a photo
• If you cant identify the people, try to identify
  the group
• Avoid using photos of clearly identifiable
  children

12
Make a Title Image

• Open a new image 300 pixels by 150 pixels works
  
• Choose a background color or make it transparent
• Select the Text tool and click on your image

13

• Select a font and font color
• Use anti-alias
• Choose a justification
• Type your text
• Move the text to the correct place on the image
• Apply any effects drop shadow, etc.
• Save as .gif or .jpg

14
FTP

• Check to make sure all of your images are in the
  same folder with your web pages and that there
  are no local links
• Make sure that there is a corresponding directory
  structure on the server for your web site
• Check your web pages on-line to make sure
  everything works

15
Weve got trouble

• None of the filters in Photoshop are available
• You may need to increase the number of colors for
  your image
• The image may not be in RGB mode
• Use the Colors menu to make those changes

16
Yes, Weve Got Trouble

• My pictures wont work in the html editor
• Make sure they are either .gif or .jpg
• Make sure that their file names are no more than
  8 characters, no spaces

17
Trouble With a Capital T

• When I check my web page, some of the images are
  not there
• Check the code of your web page to make sure
  there are no local links to images
• Check to see that you got all of the pictures
  uploaded when you ftp-ed
• Check to see that the file name of the image is
  the same as the path name in the html

18
Allow Yourself Enough Time!

• It takes time to scan pictures and put them on a
  disk
• It takes more time to fuss with them and enhance
  and resize
• It takes even more time to design the web pages
  on which they will go

19
Make sure your supervisor knows!

• Your department head has just handed you the
  digital camera with 30. pictures from the great
  conference.
• You have a minimum of 5 hours of work ahead of
  you before the web pages will be ready.

20
This is fun, so enjoy yourself!