Graphics & Images What File Format Do I Use?. Graphics & Images …..are visual images presented on some form of media (drawings, print, web, digital video)

Slides:



Advertisements
Similar presentations
Raster Graphics 2.01 Investigate graphic image design.
Advertisements

Introduction to Computer Graphics Raster Vs. Vector COMMUNICATION TECHNOLOGY.
Web Design Vocab 3 PNG, JPG, GIF, MP3, MPEG.
L.Ghadah R. Hadba CT1514-L1.  Computer Graphics :refers to processing of creating a new image from Geometry, Lighting parameters, Materials and Textures.Using.
Droddy.  “Pixel” is short for two words: Picture and Element. Pixels (tiny squares) combine to form the image the human eye perceives Too small for the.
Raster graphics. Colour depth 01 1 bit pr pixel = 2 combinations (2 1 ): 2 bits pr pixel = 4 combinations (2 2 ): bits pr pixel = 16 combinations(2.
Graphics CS 121 Concepts of Computing II. What is a graphic? n A rectangular image. n Stored in a file of its own, or … … embedded in another data file.
Image Processing, Illustration (Drawing), Paint Programs, and Scanning Dr. Warren C. Weber Cal Poly Pomona.
IT-Academic Technology Services Using Microsoft PowerPoint 2010 for Digital Storytelling.
Graphics and Animation Chapter 8. 8 Graphics in Multimedia Graphics are an element that virtually all multimedia applications include.
Introduction to Computers Section 11A. home Types of Graphics File Bitmap Vector.
Components Text Text--Processing Software A Word Processor is a software application that provides the user with the tools to create and edit text.
Manipulating Images Image A visual representation of something that is seen in real life. It can be two-dimensional or three-dimensional A visual representation.
File Formats By Jack Turner. Raster (Bitmap) Raster or bitmap is a dot matrix data structure, containing columns of dots and rows, of a graphics image.
File Types, Sizes & Dots Per Inch (dpi) Best practices applied to Photoshop file formats when creating media-specific documents. Bit Depth is the number.
Part A Multimedia Production Rico Yu. Part A Multimedia Production Ch.1 Text Ch.2 Graphics Ch.3 Sound Ch.4 Animations Ch.5 Video.
Lesson 7—Part 1 Working with Graphics
Introduction to Graphic Arts Technology PRINT Versus WEB.
Russell Taylor Week 3. Image File Formats - TIF, JPG, PNG, GIF - which to use? The three most common and important image file formats for for printing,
Graphics Ms. Brewer Spring Bellwork Edmodo – log on! Quiz? Take it if you need to! Policies and Procedures Powerpoint in Shared Folder! Get to Know.
Internet as a resource tutorial – part steps, 3 different actions 1. Search content 2. Use Text 3. Use Images.
Understanding Web Graphics Web Design Section 5-4 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development.
Image Storage Bitmapped Graphics – in which an image is represented as a collection of dots Vector Graphics – in which an image is represented as a set.
Presentation Design: Graphics. More About Color “Bit depth” of colors -- This is based on the smallest unit of information that a computer understands.
Photoshop Software Rasterized, file formats, and printing choices.
SOFTWARE TYPES Word processing Page layout Paint Draw.
Graphics and Images Communicating Information : Documents and Publications.
Raster Graphics. An image is considered to be made up of small picture elements (pixels). Constructing a raster image requires setting the color of each.
File Formats and Vector Graphics. File Types Images and data are stored in files. Each software application uses different native file types and file.
Chapter 3 Image Files © 2013 Cengage Learning. All Rights Reserved. May not be scanned, copied or duplicated, or posted to a publicly accessible website,
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.
FILE TYPES FOR WEB DESIGN 1 HOW SHOULD I SAVE?. GRAPHICS INTERCHANGE FORMAT (GIF) Best used for flat-color, sharp-edged art or text Clip art, logos Compression.
Mirjana Devetakovic, M.Sc. CAAD - Images Beograd, 2011.
Raster Graphics 2.01 Investigate graphic image design.
Graphic definitions Summary of Chapter 10 of the Non-designer’s web book by Robin Williams and John Tollet. Pages ( ) Miss Mary Victor.
Editing Images for the Web. Optimization/Compression Graphics optimization is important for fast web page display.
Graphics Concepts Presentation
Exploring Web Design Chapter 1. Objectives Develop a new perspective of the WWW Learn what makes a website good or bad Discover how to apply objective.
Digital Image Editing Presented by John Hohn. File Formats JPEG – Joint Photographic Experts Group PNP – Portable Network Graphics GIF – Graphic Interchange.
Introduction to Images & Graphics JMA260. Objectives Images introduction Photoshop.
8 Graphics Digital Media I. What is a graphic? A graphic can be a:  Chart  Drawing  Painting  Photograph  Logo  Navigation button  Diagram.
HTTP transaction with Graphics HTML file + two graphics files.
Image File Formats Harrow Computer Club – Wed, 1 Dec 2010 Bob Watson MA CMath MIMA MBCS.
2.01 Understand Digital Raster Graphics
2.01 Understand Digital Raster Graphics
Understanding Web Graphics
Digital Illustration Chapter 6 File format.
Chapter 3 Image Files © 2013 Cengage Learning. All Rights Reserved. May not be scanned, copied or duplicated, or posted to a publicly accessible website,
2.01 Understand Digital Raster Graphics
Image Formats.
PROPERTY OF PIMA COUNTY JTED, 2010
2.01 Investigate graphic image design.
Graphics Basics Ellen Eyth.
Chapter 3 Image Files © 2017 Cengage Learning®. May not be scanned, copied or duplicated, or posted to a publicly accessible website, in whole or in part.
A computer display is made up of small squares, called pixels.
Digital Images.
Graphics and Animation
1.01 Investigate graphic types and file formats.
Graphics Basic Concepts.
2.01 Understand Digital Raster Graphics
Terms 1 Terms 2 Terms 3 Terms 4 Terms 5 1pt 1 pt 1 pt 1pt 1 pt 2 pt
2.01 Investigate graphic image design.
2.01 Understand Digital Raster Graphics
2.01 Investigate graphic image design.
Lesson 7—Part 1 Working with Graphics
Graphics and Animation
2.01 Investigate graphic image design.
Lesson 6 File Types.
Creating Digital Graphics
Presentation transcript:

Graphics & Images What File Format Do I Use?

Graphics & Images …..are visual images presented on some form of media (drawings, print, web, digital video) with a purpose to brand, inform, illustrate or entertain.

Graphics/Images on the web:

WHY WHY do we need to make images small for the internet? Small file = web site loads faster

HOW HOW do we make images small for the internet? COMPRESSION Image Compression Is the reduction of redundancy in the image data resulting in the storing and transmission of information in an efficient form.

Images/Graphics are stored in different formats. IMAGE FILE FORMAT Image file formats are a standardized means of organizing and encoding information for storage in a computer file.

There are different kinds of formats for different purpose Some formats store very particular sorts of data, while some store very different types of data. Programs see files as streams of data. A method is needed to identify one file format from another.

File Extension.JPG.PSD.GIF.PNG.AI A file extension is the portion of the filename following the final period, generally designated by 2 to 4 characters.

The 4 Most Common Image File Formats.JPG.GIF.PNG.TIF

Web pages require these image file types.JPG.GIF.PNG

PHOTOS & GRAPHICS are different types of images What’s the difference digitally? A PHOTO is a Continuous Tone image ….adjacent pixels that often have very similar colors.

Continuous Tone Image

GRAPHIC NOT Continuous Tone A GRAPHIC is often NOT a Continuous Tone image will not Graphics likely will not contain gradients few colors Graphics use few colors Logos Logos are good examples of graphics

.PNG Portable Network Graphics Successor to the.GIF Bitmap image format Supports millions of colors Supports Transparency Web graphics NOT FOR PRINT

.GIF Graphics Interchange Format Bitmap image format Limited to 256 colors Supports Transparency Supports Animation Graphic with few color

.JPEG Joint Photographic Experts Group Bitmap image format Supports millions of colors DOES NOT support transparency DOES NOT support animation Photographs

.TIFF Tagged Image File Format Bitmap image format Supports millions of colors DOES NOT support transparency DOES NOT support animation NOT supported by web browsers Stores images with NO COMPRESSION

Photos must FIRST be DIGITIZED Digitizing Digitizing is the process of converting images into a format that the computer can recognize and manipulate.

RESOLUTION RESOLUTION refers to the amount of PIXELS PER INCH DPIDOTSPER INCH. Information stored for each image and is measured in PIXELS PER INCH or referred to as DPI or DOTS PER INCH. Newspaper Web Brochure Frame Print

4 X DPI 4 X 6 72 DPI