working with images
DESCRIPTION
Working with images workshop slidesTRANSCRIPT
Working with
Images
What is a digital image?
1 inch
72 pixels
3 inches
216 pixels
1 pixel = 0.3mm
Images can be measured in
• Physical size – 2000 x 3000 pixels– 5 x 10 cm (or inches)
• Memory space– 2MB– 25kB
560 seconds
3000 x 2000 pixels3.5MB
250x1805 seconds
Image size - rule of thumb
• Website images should be no more than– 350 x 350 pixels – ½ MB
• Exceptions– Full width banner– Enlarged image
Image types
.gif
.jpg
.tiff
.bmp
.png
YESYESNONONO
Image types
• GIF - Graphic Interchange Format.– Oldest, most popular – logos, cartoons– background transparent– animated
• JPEG – Joint Photographic Experts Group - JAY-peg – photographs– Flexible compression
jpggif
Which format should these be in?
Saving images
• Avoid
&
*
%
£
. ,
NO spaces, replace with -
• canary palm.gif
• Balance-valentine’s50%res.jpg
What’s wrong with these?
canary-palm.jpg
carnations-crysanths.jpg
balance-logo.gif
• carnations & crysanths.jpg
Renaming images
• Use meaningful titles
Product185.jpg
lily-arrangement.jpg
Chippenham-flower-shop-lily-hand-tied.jpg
Images properties
In My pictures – Views tab change to thumbnail– Roll over image > image properties
• Dimensions - 200 x 400• Type - jpeg• Size - 200kb
Renaming images
• Right click – select rename
• Type in a new name
• Image will retain it’s own file type
Rule of thumb – saving
• No spaces, no characters
• Save with meaningful titles
• Use – not _
• Gif – for logos, graphics
• Jpg – for photos
• Don’t use bmp, tiff
How do we get images onto our PC?
• Digital camera
• Scan in a photo (or slide)
• From the internet
From the internet
Royalty-free and rights-managed
Getty Images
www.gettyimages.com
iStock Photo
www.istockphoto.com
Free Images
www.southwestbrand.info
www.swchambersonline.co.uk/devonimages
Look at Google
www.google.co.uk– Click on images tab
– Right click and save as
– Be aware of copyright
How do you change an image?
• Image manipulation software– Photoshop
– Free software download• Gimp - www.gimp.org• Irfanview - www.irfanview.com
– Websites• www.flauntr.com • www.picnik.com
Cropping
• Reduces the physical size and memory space
• Changing the shape
• Increasing the impact
Image shapes
Cropping for effect
Crop in picnik.com
• Upload photo
• Click on EDIT
• Now click on crop button
• Click on the frame and drag
• Double click
Re-sizing
• Reducing the size
• Reducing the memory space too
• Remember to keep proportions and change ONLY height or width NOT BOTH
Resize in Picnik.com
• Upload photo
• Click on EDIT
• Click resize button
• Enter new height OR new width,
• Keep proportions button is ticked
• Click save
Saving a jpeg
• Options to compress the image further…
– 100%– 95%– 10% compression
Create in picnik.com
• CREATE– Add text– Add shapes/images– Round corners, frame– Change to black and white
Questions?