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.

Slides:

Advertisements

Similar presentations

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

Advertisements

Raster Graphics 2.01 Investigate graphic image design.

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

Images. Image File Formats All browsers support All browsers support –GIF (Graphic Interchange Format)  limited to 256 colors  lossless compression.

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.

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.

Chapter 3 Adding Images in HTML. Agenda Understanding Web Page Images Prepare Your Images for the Web Insert an Image Specify an Image Size Add Alternative.

BASIC HTML TUTORIAL Amber Brady. HTML tags are keywords surrounded by angle brackets like HTML tags normally come in pairs like and The first tag in a.

1 Creating Web Graphics Outline 2.1 Graphics Types 2.2 Vector Graphics 2.3Bitmapped Graphics 2.4Graphics for the Web 2.5 GIF (Graphics Interchange Format)

WEB GRAPHICS. The Pixel Computer displays are comprised of rows and columns of pixels. Pixels are indivisible. Some common screen resolutions are:, 600.

Task 01 – Explain how different types of graphical images relate to file formats, file conversions, formats and compression. Emily Riley.

File Formats COM 366 Web Design & Layout. Native file format –Format native to software program –.psd > PhotoShop default Preserves layers –Use “Save.

Web Graphics Image File Formats Image optimization Accessibility issues Using images and colors on the web.

File Formats About graphic file formats And image compression.

THE COLORS OF LIGHT RED, GREEN and BLUE

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.

XHTML Images. Images are important Purpose: to enhance your web site. Add only when they complement or add additional impact to your message.

Chapter 5 Web Graphics Styling Basics Key Concepts Copyright © 2013 Terry Ann Morris, Ed.D 1.

Common file formats  Lesson Objective: Understanding common file formats and their differences.  Learning Outcome:  Describe the type of files which.

Computer Images Can store color info about each pixel, but makes file BIG Compression for Web 15.

File Formats and Vector Graphics. File Types Images and data are stored in files. Each software application uses different native file types and file.

Types of Graphics  Vector Individual scalable objects defined by mathematical equations  Bitmap Pixels (tiny, single-colored square) in a grid Most.

Graphic Format Factors

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

Chapter 3 Image Files © 2013 Cengage Learning. All Rights Reserved. May not be scanned, copied or duplicated, or posted to a publicly accessible website,

Using the Sony DSC-P52 Camera Sunday, December 06, 2015.

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.

Web Graphics. Web graphics Bandwidth is king Graphics must load quickly Graphics must be optimized All other components except for text, gif and jpg are.

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

Image File Formats. What is an Image File Format? Image file formats are standard way of organizing and storing of image files. Image files are composed.

WWW, Web Design, Multimedia Winny Wang Image Types.

AGCJ 407: Web Authoring in Agricultural Communications Understanding the File/Folder Fracas AGCJ 407 Web Authoring in Agricultural Communications.

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

Digital File Formats By Ali Aslam. JPEG JPEG Stands for Joint Photographic Experts Group. JPEG uses a lossy compression routine. Lossy compression means.

HTTP transaction with Graphics HTML file + two graphics files.

Image File Formats Which one is right for me?. The Only Three Image Formats Your Will Ever Need: Names Jpg “Joint Photographic Experts Group” Png “Portable.

CHAPTER 21: IMAGES. IMAGE SOURCES 3 options: Create your own images Find images Hire someone to make images.

2.01 Investigate graphic image design.

2.01 Understand Digital Raster Graphics

Common Bitmap Image File Types

2.01 Understand Digital Raster Graphics

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

Introduction to raster graphics

Sci Vis I Exam Review Unit 6 File Formats.

1.01 Investigate graphic types and file formats.

2.01 Investigate graphic image design.

JPG vs GIF vs PNG What is the difference?

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.

1.01 Investigate graphic types and file formats.

Web Development & Design Foundations with HTML5 7th Edition

Web Design and Development

2.01 Understand Digital Raster Graphics

Photoshop: Creating and Preparing Images for the Web

2.01 Investigate graphic image design.

2.01 Understand Digital Raster Graphics

2.01 Investigate graphic image design.

2.01 Investigate graphic image design.

2.01 Investigate graphic image design.

2.01 Investigate graphic image design.

2.01 Investigate graphic image design.

Lesson 7—Part 1 Working with Graphics

2.01 Investigate graphic image design.

Lesson 6 File Types.

Presentation transcript:

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 – LOSSLESS Lossless – does NOT lose information to minimize file size – may be a larger file Notes/Issues Larger file Supports transparency, animation, interlacing

JOINT PHOTOGRAPHIC EXPERTS GROUP (JPG) Best used for photographs or natural artwork Supports 16.7 million colors! Compression – LOSSY Lossy – eliminates extra information to help minimize file size Compresses the file EVERY TIME it is saved! Notes/Issues Can be a larger file due to amount of colors Wait till all changes are made before saving as JPG due to lossy compression Does NOT support transparency in backgrounds

PORTABLE NETWORK GRAPHICS (PNG) Best use depends upon how many bits 8-bit = similar to GIF 24-bit = similar to JPG Compression – LOSSLESS Notes/Issues Similar to GIF but does NOT support animation Default file type for Fireworks creations

BITMAP (BMP) Best used for storing original images in Windows Compression – LOSSLESS Notes/Issues Can become distorted if resized May take longer to load Frequently cannot be used like other images

HYPERTEXT MARKUP LANGUAGE (HTML) Main markup language for web pages Read by web browsers (such as Firefox, Chrome) Provides a way to create structured documents Allows images and objects to be embedded ALL pages for our websites need to be saved with the.html file extension