ALL YOU EVER WANTED TO KNOW ABOUT PREPARING IMAGES FOR WEB & PRINT A brief tutorial.

Slides:

Advertisements

Similar presentations

Digital Image Resolution Image Resolution Preparing Digital Images For press or monitor presentation.

Advertisements

Multimedia Mr. Sanchez.

Dan Sadler Montgomery County Department of Information Systems & Telecommunications - GIS Team (DIST-GIS) Map Gallery.

Introduction Replace the text in these columns with your own text. You can copy/paste text from Word or other PowerPoint files. Body text of 28 point Times.

Objectives Define photo editing software

The University of Adelaide Picture Perfect: Image Formats and Resolution Peter Murdoch March 2014 PREPARING GOOD LOOKING DOCUMENTS.

1 Making a Custom Photo Collage with Photoshop Elements SIR Phil Goff, Branch 116 February 17, /17/2011.

Web Graphics and Formatting 101 February 10, 2010.

Introduction to Graphic Arts Technology PRINT Versus WEB.

BY XAI LAO Photoshop: How to Image Size a Photo for Web – Beginner’s Guide ICT 710 | Learning Technologies | November 2011 by Xai Lao.

Image size and Image Sensors. Look at an image in Photoshop Two ways to specify Image size…

Bitmapped Images. Bitmap Images Today’s Objectives Identify characteristics of bitmap images Resolution, bit depth, color mode, pixels Determine the most.

IT Website Development Welcome!. Welcome to Unit 7! Optimizing Images and creating photo albums in Dreamweaver There are no textbook readings for.

SHESHE GIDDENS PUBLICATIONS COORDINATOR JANUARY 27, 2010 CREATING METHODIST-BRANDED FLIERS, POSTERS AND MORE: USING MICROSOFT PUBLISHER.

GRAPHICS/IMAGES INFSCI Source: Learning Web Design by Jennifer Niederst RobbinsJennifer Niederst Robbins Creating Images:  Scanning  Be aware.

Tutorial 2: Working with Image Files. Objectives Session 2.1 Learn about file formats and their uses Change file type, file size, and resolution Examine.

Preparing & Displaying Photos Photo Display Options Last Updated 2/2010.

Unit E. Image Measurements The size of an image can be measured 2 ways: Dimensions: the height and width, measured in pixels. File Size: measured in Kilobytes.

What is Pixelation?. Pixelation is an effect caused when viewing an image zoomed in enough to see individual pixels that make up the image.

Additive Color (RGB) is created by mixing a number of different light colors. When you add up all of these colors, you create white light. Subtractive.

CHAPTER 4 LINKS Creating links between pages Linking to other sites links.

Presented by the Virginia 4-H Science and Technology Committee.

Graphics and Animation Multimedia Projects Part 2.

ADOBE PHOTOSHOP VECTOR VS RASTER. Pixel A pixel is the fundamental unit of an image in Photoshop. It is a small square block of color. An image often.

FILE SIZES & TYPES OPTIMIZATION. The larger the file size, the better the quality, but the harder to upload and download. Designers are always mindful.

Task 3 Store and Present Your Digital Entry Guidance Notes.

Multimedia. What is a graphic?  A graphic can be a: Chart Drawing Painting Photograph Logo Navigation button Diagram.

Things to Remember When working with digital images.

Adobe Photoshop CS5 – Illustrated Unit A: Getting Started with Photoshop CS5.

Week 3  Adobe Photoshop Introduction  Create an Image Collage  Save For Web Please Visit:

PowerPoint Bloat How to avoid it. 1 PowerPoint technique, 4 image techniques PowerPoint 1.Split long PowerPoint files into several smaller files Image.

1-Touch Photo Engraving th Street Arlington, Texas /

Scanning Basics. An image can be created, opened, edited, and saved in over a dozen different file formats in Photoshop. Of these, you might use only.

Images Size & The Web. When putting your photos on the Web or sending them by , the smaller you can get them, the better. One simple thing you can.

Task 3 Store and Present Your Digital Entry Guidance Notes.

Editing Images for the Web. Optimization/Compression Graphics optimization is important for fast web page display.

PART 2 – Size, Display, Color Modes. Image Size Courtesy of Digital images are made up of pixels (picture elements),

The Web. Web Servers and File Transfer Protocol (FTP)

Introduction to Images & Graphics JMA260. Objectives Images introduction Photoshop.

WRA 210: 10/7/13 IMAGES. TODAY’S AGENDA Reminder about Module 8 - test your links!Module 8 Overview of hierarchies, naming How images work on the web.

Vector vs. Raster What’s the difference between vector and raster file formats? The real difference between the two formats is how they are used.

Finding and Using Digital Images Alastair Dunning, AHDS Executive Office King’s College London, Bradford 12 th December 2005.

Editing photos. Photoshop is the industry standard Microsoft Office Picture Manager Gimpshop – free alternative Gimpshop Picasa – free from Google Picasa.

RASTERIZING SHAPES IN PHOTOSHOP RASTERIZE: A process in Photoshop of converting a vector image into a bitmap (or raster) image VECTOR: A vector image is.

Digigital Fundamentals! Week 2,. Adobe Photoshop CS3 Photoshop Tools.

Adobe Photoshop CS4 – Illustrated Unit A: Getting Started with Photoshop CS4.

Adobe ® Photoshop ® CS6 Chapter 1 Editing a Photo.

Basic Web Design Week 3 - Graphics UVICELL. Web Graphics Concepts for Week 3 Selecting the right format for your image Creating a name banner for your.

Photoshop CS6 – Nelson Unit 3: Photoshop CS6. Objectives Define photo editing software Start Photoshop and view the workspace Use the Zoom tool and the.

“Rightsizing” Images for

HOW TO SAVE & USE FILES For Print & WEB.

How to get the best results from your website and images.

Chapter 1 Editing a Photo

Getting Started with Adobe Photoshop CS6

Getting Started with Adobe Photoshop CS5

Introduction to raster graphics

setting the resolution - 72 vs 300 dpi (300 better quality)

IMAGE SIZE AND RESOLUTION

LET’S LEARN ABOUT GRAPHICS!

Digital Images.

Guide to Creating Mask Files

ImageEditing Understanding Image Resolution.

E-Photo Guidelines of uploading photograph

People Who Did the Study Organizations and Affiliations

Adobe Visual Design 5.00 Apply procedures to publish digital images using Adobe Photoshop (2%) Apply procedures to publish illustrations using Adobe.

Photoshop: Creating and Preparing Images for the Web

Color and Images.

PRODUCTION PHASES CHANGES

Photoshop: Image size and resolution

Graphics Basics.

Presentation transcript:

ALL YOU EVER WANTED TO KNOW ABOUT PREPARING IMAGES FOR WEB & PRINT A brief tutorial

What we will cover: Acquiring Images Best Practices Optimizing for Web Optimizing for Print Where to Get Help Q & A

Step 1: Options for choosing your photo

Image Resources Use your own images images.ucmerced.edu Stock photography Multimedia Coordinator - Veronica Adrover

Best Practices Avoid clip art if possible Keep the photographic style the same Always keep in mind the UC branding Never use images that don't belong to you or the UC Avoid small, pixelated photos Optimize - optimize - optimize Request a photo shoot Use hypens (-) instead of underscores (_) in filenames for search engine friendliness and readability

Using Photoshop to Optimize Your Photographs For Web

Adobe Photoshop Industry standard PS Elements – Inexpensive, only $31.56 Well documented; lots of tutorials available

Photoshop Optimize Steps File > Open Image > Image Size: Reduce to 96dpi File > Save for Web: Select JPEG format, reduce Quality to k file size using slider – find a balance between quality and file size in this range

Optimize Steps for Web Use Open photo in Photoshop Reduce image resolution (dpi) to 96 Reduce image dimensions; 525 pixels width for full width, otherwise resize to desired in PS For custom sliders (not photographs), 450 x 300 pixels are the proper dimensions Save as JPEG, k is optimized. Use Drupal to upload to your site

Using Photoshop to Optimize Your Photographs For Print

Optimize Steps for Print Use Open photo in Photoshop Resize image resolution to 300 (dpi) Convert color format from RGB to CYMK Save as.TIF or.EPS; absolutely no JPEGS (jpegs are for web)

Overview Use only photos owned by you or the UC – images.ucmerced.edu Download Adobe Photoshop Elements Optimize for Web: 96dpi, max width 525px Optimize for Print: 300dpi, CMYK color mode, save as TIF or EPS Ask us for help FAQ’s available at communications.ucmerced.edu