PHOTO

OPT

IMIZ

ATIO

N

PR

ES

EN

TA

TI O

N B

Y : EB

ON

Y H

UG

HE

S &

DA

ES

HE

N S

MI T

H

PHOTO OPTIMIZATION

What is it? Changing/altering components of your graphic(s) to reduce

the loading time of a web page.

Why is this important? The patience level of online visitors is very low, so they tend

to click out of those sites that take more time to download.

PHOTO OPTIMIZATION PROGRAMS

1) Adobe Photoshop- Photo editing programs range from recreational photo takers to professional photographers and graphic designers

2) Imageoptimizer.net- Free online photo optimizer, users can easily such properties as quality width and height of the picture before it is compressed

3) Xat.com- Online program that users can download and try before they buy it. Allows users to just play around with photo optimization and manipulation

GUIDELINES OF PHOTO OP

Some of the points that the web developers of a website design company follow are:

Conversion of graphic text into stylized text.Changing the resolution of all images to 72 Pixels per Inch (ppi).Cropping the images to the actual size required.Specifying the actual height and width of all images.Minimizing depth of color when it is not needed for quality.Using thumbnails where required.

*http://www.quality-web-solutions.com/blog/how-to-do-photo-optimization/

RESIZING AND COMPRESSION

Object: Balance size with appearance

1) Resizing- changing the size Pixels Cropping

2) Compression- minimizing the size in bytes of a graphics file without degrading the quality of the image to an unacceptable level.

Image File Formats (JPEG, GIF/PNG)

*http://searchcio-midmarket.techtarget.com/definition/image-compression

RESIZING

Pixels: digital images are composed of pixels- the smallest controllable elements of a picture represented on the screen

http://vimeo.com/10829255

Cropping: cutting away some at the edges, to include less area in the final image

Cropping discards those trimmed pixels, making the image dimensions smaller, but primarily, it changes the scene included, and often the shape too

Instagram

COMPRESSION

Image File Formats

1) JPEG (Joint Photographic Experts Group) - generally used for photographs

2) GIF (Graphics Interchange Format) - commonly used for line art and other images in which geometric shapes are relatively simple

3) PNG (Portable Network Graphics) – replaces GIF as a patent-free image compression file format

COMPRESS IMAGES SO THAT THEY LOAD QUICKER, BUT BE CAREFUL NOT TO DISTORT THE ORIGINAL IMAGE

C O M P R E S S E D V S U N C O M P R E S S E D I M A G E

L E V E L S O F C O M P R E S S I O N

BANDWIDTH

The transmission capacity of an electronic communications device or system; the speed of data transfer: a high-bandwidth Internet connection

The more bandwidth you have the faster you can receive the data.

Example: If your bandwidth is 1Mbps and the image you want is 5mb in size then it should take about 5 seconds for you to get the image.

Kbps-Kilobits per second. (Normally used for dialup)

Mbps- Megabits per second

MBps- Megabytes per second(Not usually used in residential internet plans)

Gbps- Gigabits per second. Hardly used for internet plans. The costs make them unpractical for families and small businesses

BANDWIDTH(CONTINUED)

Even though it is expensive companies must make sure they have an adequate amount of bandwidth.

Too little bandwidth means people who may have dialup or any other slow internet connection may be waiting too long to download content

INSTAGRAMW H AT I S I T ? F E AT U R E S

• Confines photos to a square shape, similar to Kodak Instamatic and Polaroid images

• Variety of effects(Earlybird- Faded, blurred, focuses on yellow and beige)

• Add-Ons(Instamap- app available for iPad that allows users of Instagram to find photos based on their location or a hashtag)

• Cropping

• Free photo-sharing program and social network that was launched in October 2010

• Enables users to take a photo, apply a digital filter to it, and then share it with other Instagram users they are connected to

• Currently has 100 million registered users

WHAT IS FLICKR?

Flickr is a free photo sharing website that is linked to a yahoo account

Users can add tags to categorize their photos and they can comment directly on the photo

User can “favorite” the photos to make it easier to find later

PRIVACY

Flickr users can make photos public or private and designate who can see them.

Any public photo can be viewed by anyone with or without a flickr account

Flickr users can also send guest passes to people who don’t have a flickr account

FLICKR GUEST PASS

The URL from the photo or set of photos that the user wants to share.

Users copy the URL into an email and send it to the person they want to share photos with

A user can expire guest passes whenever they choose

EMBEDDING 1) Instagram and Flikr pictures can be embedded into websites

and blogs using their bandwidth.

• Use widgets and/or plugins

2) Remember to balance size with appearance.

3) DON’T COPY AND PASTE URLS FROM OTHER SOURCES!!!

• Hotlinking- direct linking to a another web site's files

HOTLINKING

COULD COPY THIS…..

AND GET THIS!

QUESTIONS???