MyChapter4

MyChapter4 - MyChapter4 Lecture Notes on Chapter 4 Visual...

Info iconThis preview shows pages 1–9. Sign up to view the full content.

View Full Document Right Arrow Icon

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full DocumentRight Arrow Icon

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full DocumentRight Arrow Icon

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full DocumentRight Arrow Icon

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full DocumentRight Arrow Icon
This is the end of the preview. Sign up to access the rest of the document.

Unformatted text preview: MyChapter4.ppt: Lecture Notes on Chapter 4 : Visual Elements and Graphics and other related topics 1 MyChapter4.ppt MyChapter4.ppt 2 Actually, most of the topics discussed in Chapter 4 of our textbook have already been discussed in our class. So, we will essentially go very fast over the textbook’s materials. Further, we will also cover additional materials (that are in later chapters of the textbook. In section 4.1 page 122 of our textbook, the author discusses “Configuring lines and borders”. The book introduces the <hr/>, and the border and padding properties. We have already discussed these in our class. MyChapter4.ppt 3 4.2: Types of Graphics • Graphic types commonly used on Web pages: – GIF: Graphics Interchange Format – JPG: Often pronounced as Jpeg: Joint Photographic Experts Group – PNG: pronounce as “Ping”: Portable Network Graphics – And many other types. MyChapter4.ppt 4 Certain common terms in the “imaging” domain: • Transparency • Animation • Compression: A lossless compression means that nothing in the original image is lost when it is displayed by a browser. • Optimization: To avoid slow-loading images, we usually optimize the images. It is the process of creating an image with lowest file size that still renders an acceptable quality image. • Interlacing: As the browser downloads and renders an interlaced image, the image first appears fuzzy but gradually becomes clearer and sharper. 5 • Graphics Interchange Format • Best used for line art and logos • Maximum of 256 colors • One color can be configured as transparent • Can be animated • Uses lossless compression • Can be interlaced Page 128 MyChapter4.ppt GIF 6 JPEG • Joint Photographic Experts Group • Best used for photographs • Up to 16.7 million colors • Use lossy compression • Cannot be animated • Cannot be made transparent • Progressive JPEG – similar to interlaced display MyChapter4.ppt 7 PNG • Portable Network Graphic • Support millions of colors • Support multiple levels of transparency (but browsers do not -- so limit to one transparent color for Web display) • Support interlacing • Use lossless compression • Combines the best of GIF & JPEG • Browser support is growing MyChapter4.ppt MyChapter4.ppt 8 The XHTML <img> Element http://ore.to/htmllint/tagslist.cgi?HTMLVersion=XHTML11#IMG http://learningforlife.fsu.edu/webmaster/references/xhtml/tags/image/img.cfm The <img> tag is used to display an image. It is an empty element. Thus it cannot contain any text data or any other element. Some of its commonly used parents are: a, dd, div, dt, li, p, td, th Its mandatory attributes are: src: Here we provide an URL for the image to be displayed....
View Full Document

This note was uploaded on 12/03/2011 for the course INFS 3380 taught by Professor Ahmed during the Fall '11 term at Toledo.

Page1 / 83

MyChapter4 - MyChapter4 Lecture Notes on Chapter 4 Visual...

This preview shows document pages 1 - 9. Sign up to view the full document.

View Full Document Right Arrow Icon
Ask a homework question - tutors are online