LESSON 5 Module 4: Working with Images Image File Types.

Slides:



Advertisements
Similar presentations
The Web Wizards Guide to HTML Chapter Five Working with Images.
Advertisements

Web Design Vocab 3 PNG, JPG, GIF, MP3, MPEG.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 4 Key Concepts 1 Copyright © Terry Felke-Morris.
2.01 Understand Digital Raster Graphics
Ann Ware Digital Imaging 101. Digital Image Categories BITMAPVECTOR A bitmap is an image created with pixels (small squares of color) The number of pixels.
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.
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.
Ch10 QQ T F 1.The appearance of text (such as font face and style) incorporated into a Web page graphic will appear as it was when it was created, regardless.
Impact of Images Module 4: Working with Images LESSON 1.
All About File Formats Mr. Butler John Jay High School Department of Technology.
1 Lesson 3 Power Techniques HTML and JavaScript BASICS, 4 th Edition Barksdale / Turner.
Logos Module 4: Working with Images LESSON 2. Module 4: Working with Images LESSON 2 In this lesson, we will:  Investigate different logo types and their.
Common file formats  Lesson Objective: Understanding common file formats and their differences.  Learning Outcome:  Describe the type of files which.
Unit 10 – Web Authoring Web Authoring – Qatar Tourism Lesson 5 & 6.
Graphics and Images Communicating Information : Documents and Publications.
Image File Types Module 4: Working with Images LESSON 5.
File Formats Different applications (programs) store data in different formats. Applications support some file formats and not others. Open…, Save…, Save.
Web Graphics By Chris Harding. Contents  Software  Vector Graphics and Pixel Based  Transparent Images  Compression  GIF vs. JPEG  Animated GIF.
File Formats and Vector Graphics. File Types Images and data are stored in files. Each software application uses different native file types and file.
Assignment 3 – Graphic File Formats Jack Kelly 5/26/2012.
 JPEG is a standardized image compression mechanism.  JPEG stands for Joint Photographic Experts Group.  JPEG is designed for compressing either full-
Module 4- Build a Game Look at Me Mod 4 Lesson 3 Graphics.
Things to Remember When working with digital images.
Adobe Dreamweaver CC: The Professional Portfolio Project 3: Photographer’s Web Site Working with static images Controlling backgrounds with CSS Working.
Module 4- Build a Game Understanding Pictures Compression – Making things smaller.
Using the Sony DSC-P52 Camera Sunday, December 06, 2015.
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.
Raster Graphics 2.01 Investigate graphic image design.
Unit 2, Lesson 7 Creating Web Pages and Web Documents.
Digital File Formats By Ali Aslam. JPEG JPEG Stands for Joint Photographic Experts Group. JPEG uses a lossy compression routine. Lossy compression means.
© 2016 Pearson Education, Inc., Hoboken, NJ. All rights reserved.
LESSON 8 Module 4: Working with Images Digital Photography 1.
2.01 Understand Digital Raster Graphics
2.01 Understand Digital Raster Graphics
Understanding Web Graphics
Evaluating and Improving a Website
LESSON 7 Module 4: Working with Images Scanning 2.
LESSONS 13, 14 & 15 Module 4: Working with Images Final Project.
LESSON 2 Module 4: Working with Images Logos.
LESSONS 11 & 12 Module 4: Working with Images Banner Tutorial.
2.01 Understand Digital Raster Graphics
Introduction to raster graphics
Finding and inserting them
DW Tutorial 5 Sessions 5.1 & 5.2 REVIEW
Sci Vis I Exam Review Unit 6 File Formats.
LESSON 3 Module 4: Working with Images Banners.
"Digital Media Primer" Yue-Ling Wong, Copyright (c)2013 by Pearson Education, Inc. All rights reserved.
LESSON 4 Module 4: Working with Images Navigation Tools.
Lossy Compression and File Formats
LESSON 6 Module 4: Working with Images Scanning, Part I.
2.01 Investigate graphic image design.
A computer display is made up of small squares, called pixels.
1.01 Investigate graphic types and file formats.
Web Development & Design Foundations with HTML5 7th Edition
Graphics.
2.01 Understand Digital Raster Graphics
Louisiana: Our History.
LESSON 8 Module 4: Working with Images Digital Photography 1.
Photoshop: Creating and Preparing Images for the Web
2.01 Investigate graphic image design.
LESSONS 9 & 10 Module 4: Working with Images Digital Photography 2.
LESSON 1 Module 4: Working with Images Impact of Images.
2.01 Understand Digital Raster Graphics
Student’s Name EDU 521.0? Prof. R. Moroney Summer 2010
chapter 29: Creating Web Graphics
2.01 Investigate graphic image design.
Exam Objectives: Identify Design Elements When Preparing Images
ModernPresenter: How To Build A Storyboard
2.01 Investigate graphic image design.
Lesson 6 File Types.
Presentation transcript:

LESSON 5 Module 4: Working with Images Image File Types

In this lesson, we will: Use the Internet to produce a definition for three graphic file types most often used on the Internet. GIF JPEG PNG Work in cooperative teams and teach the rest of the class about your assigned graphic type Lesson 5 Overview

Guiding Questions In Web design, images are saved as different file types. What are they? When should the designer choose one over the other? Use the guiding questions as a class starter, allowing the students time to answer the questions in their journal. Discuss student answers to the questions.

Web sites Graphic file types: http://www.webstyleguide.com/graphics/formats.html Image file types and how to choose: http://www.wfu.edu/~matthews/misc/graphics/formats/formats.html All image files: http://www.fileinfo.net/filetypes/image Use Web sites to give background information and show examples.

Exploring image file types Research an image file type Create a mini-lesson Present the mini-lesson to the class Complete the Image File Type worksheet Students are assigned a working group and an image file type. Students will research using the Internet and the Image File Type sheet. After they find the pertinent information about their file type, they will create a mini-lesson utilizing PowerPoint, Word, Inspiration, or another appropriate program. Students then present their mini-lesson to the class. The audience participates in the mini-lessons presented by peers, and finishes the Image File Type from the information gathered.

Lesson Review JPEG: A graphic file type that is used primarily for photographs and has lossy compression. GIF: A graphic file type that is used primarily for line art and simple animations. PNG: A graphic file type that is used for static images with lossless compression. Summary and vocabulary

Assessment Why is it critical to know what file type you are working with or want to save as? If you were creating an animation for a Web page, what file type would you save the image as? What is the significance of a PNG file type, and when would you use it? What file type is commonly used in the photography world, and why? Ask students to answer the questions in their journal, with a partner, or as a whole class.