Designing web graphics.3 /How to prepare images and media for the Web How to prepare images and media for the web

By:

Weinman, Linda

Material type: Text

TextPublication details: USA New Riders 1999Edition: 3rd edDescription: 456p., 254 x 203mm, Colour and b&w illustrations, paperbackISBN:

1562059491

Subject(s):

DDC classification:

006.66 WEI

Holdings
Item type	Current library	Call number	Status	Barcode
Standard Loan	Thurles Library Main Collection	006.66 WEI (Browse shelf(Opens below))	Available	R07833KRCT
Standard Loan	Thurles Library Main Collection	006.66 WEI (Browse shelf(Opens below))	Available	R07832KRCT
Standard Loan	Thurles Library Main Collection	006.66 WEI (Browse shelf(Opens below))	Available	R08584KRCT

Browsing Thurles Library shelves, Shelving location: Main Collection Close shelf browser (Hides shelf browser)

Previous								Next
Previous	006.66 LEN Mathematics for 3D game programming and computer graphics /	006.66 WEI Designing web graphics.3 /How to prepare images and media for the Web	006.66 WEI Designing web graphics.3 /How to prepare images and media for the Web	006.66 WEI Designing web graphics.3 /How to prepare images and media for the Web	006.66 WRI OpenGL superbible : comprehensive tutorial and reference /	006.66 WRI OpenGL superbible : comprehensive tutorial and reference /	006.66 WRI OpenGL superbible : comprehensive tutorial and reference /	Next

Enhanced descriptions from Syndetics:

Designing Web Graphics.3 is being completely revised and updated to cover the latest web technologies. The book will feature all new images and text, a new interior design, and a new cover. Written in Lyndas trademark style, Designing Web Graphics.3 will provide extensive step-by-step coverage of how todays best and most-used web tools, including Adobe Photoshop, Adobe Illustrator, Paint Shop Pro, Photo-Paint and more are used to create web images and media. Designing Web Graphics.3 will also include real-world examples, case studies, and galleries of the web's best content. The book will cover the following new topics: HTML editors; Web strategies; Cross-platform and cross-browser fonts; Tools for optimization; Understanding links; Color theory; Plug-ins; Using frames for alignment; Using tables for margins; Using tables for animation; Cascading style sheets; Fixing bad scans; DHTML; QuickTime 3.0; WebTV; Flash, RealAudio; RealVideo; Dreamweaver; Fireworks; and ImageReady.

This text provides step-by-step coverage of how the most-used web tools (including Adobe Photoshop, Adobe Illustrator, Paint Shop Pro, and Photo-Paint) are being used to create web images and media. Real-world examples, case studies and galleries are included.

Table of contents provided by Syndetics

Introduction (p. xxiii)
1 Getting Started (p. 1)
Lynda's Career Counseling (p. 2)
Training (p. 3)
Teach Yourself (p. 4)
Improve Your General Design Skills (p. 4)
What Skills Are Important? (p. 4)
Web Design Skills (p. 4)
First Career Steps (p. 5)
The Importance of a Portfolio (p. 5)
Knowing What to Charge (p. 6)
How to Find Jobs in Web Design (p. 7)
Pricing Resources (p. 7)
Use Search Engines (p. 8)
Don't Believe Everything (p. 9)
Hardware Choices (p. 10)
Which Flavor: Macintosh or Windows? (p. 10)
Macs Versus PCs (p. 10)
Some Mac Advantages (p. 11)
Some PC Advantages (p. 11)
Which Platform Is Best? (p. 11)
System Requirements (p. 12)
Shop for Discounts (p. 14)
Software (p. 14)
Imaging Programs (p. 15)
Summary (p. 16)
2 HTML Editors (p. 17)
What is HMTL? (p. 18)
HTML in a Graphics Book? (p. 18)
Why Is HTML So Troublesome for Design? (p. 19)
Should You Learn HTML? (p. 20)
How to Learn HTML (p. 21)
Online HTML Reference (p. 22)
Important HTML Terms (p. 22)
What Does HTML Look Like? (p. 23)
HTML Editors (p. 24)
Try Before You Buy (p. 25)
HTM Editing Features (p. 25)
Browser Feature Comparison Chart (p. 27)
Summary (p. 28)
3 Strategy (p. 29)
First Steps (p. 30)
Storyboarding (p. 32)
Case Study: From Storyboard to Production (p. 33)
Flowcharting (p. 34)
Navigation Approaches (p. 35)
More Navigation Approaches (p. 36)
Site Structure (p. 37)
Recommended Reading (p. 38)
Brainstorming List (p. 38)
Metaphors (p. 38)
Metaphors: Help or Hindrance? (p. 39)
Summary (p. 40)
4 Web Authoring Environments (p. 41)
Browser Differences (p. 42)
Resources for Tips on Browser and HTML Differences (p. 43)
Guidelines for Compatibility (p. 44)
The Dreaded AOL Browser (p. 45)
Cross-Platform Color Calibration Issues (p. 46)
Gamma Differences (p. 47)
Average Factory Settings (p. 47)
Understanding Value and Contrast (p. 48)
High Resolution Versus Low Resolution (p. 49)
Setting Photoshop Preferences (p. 50)
Bit Depth (p. 51)
Monitor Bit Depth (p. 52)
How to Change Your Monitor's Bit Depth (p. 53)
Type Differences (p. 54)
Monitor Size Considerations (p. 55)
WebTV (p. 56)
WebTV Supports (p. 57)
Unsupported HTML Tags (p. 57)
WebTV Design Tips (p. 58)
Comparing WebTV to the Net (p. 59)
Summary (p. 60)
5 Web File Formats (p. 61)
Bitmap or Vector (p. 62)
Lossless or Lossy (p. 64)
GIF Pronunciation (p. 64)
GIF Compression (p. 65)
Interlaced GIFs (p. 66)
Transparent GIFs (p. 67)
Animated GIFs (p. 68)
JPEG (p. 69)
Progressive JPEGs Versus Standard JPEGs (p. 71)
PNG (p. 72)
Gamma Correction (p. 73)
Alpha Channel Transparency (p. 73)
PNG Resources (p. 73)
Digital Watermarks (p. 74)
MNG (p. 75)
Summary (p. 76)
6 Low-Bandwith Graphics (p. 77)
File Size and Downloading Speed (p. 78)
There's More to Downloading Speed Than Small Images (p. 78)
What Size Your File Really Is (p. 79)
Photoshop Icons Take Space (p. 79)
File Size Reporting in ImageReady and Fireworks (p. 80)
Evaluating the Style of Your Image (p. 81)
Saving Photographs as GIFs--None Dither Method (p. 82)
Saving Photographs as JPEGs (p. 82)
Saving Photographs as GIFs--Dither Method (p. 83)
Saving Graphics as GIFs--None Dither Method (p. 84)
Saving Graphics as JPEGs (p. 84)
Saving Graphics as GIFs--Dither Method (p. 85)
Making Small JPEGs (p. 86)
Older Browser Concerns (p. 86)
JPEG Examples (p. 87)
Photoshop Plug-Ins for Making Small JPEGs (p. 88)
Don't JPEG a JPEG! (p. 88)
Making Small GIFs (p. 89)
Bit Depth Affects Size (p. 90)
Anti-Aliasing Versus Aliasing (p. 91)
Aliased Artwork (p. 92)
GIFs for Line Art-Based Imagery (p. 93)
GIF Color Palettes (p. 93)
Dithering and Banding (p. 94)
Dare to Dither (p. 96)
Four Rules of GIF Compression (p. 97)
Reducing Colors in GIF Files Using Photoshop (p. 98)
Reducing Colors in ImageReady (p. 99)
Auto Setting in ImageReady (p. 99)
Reducing Colors in Fireworks (p. 100)
Reducing Colors in Paint Shop Pro (p. 101)
The Windows 16 Palette (p. 101)
Hybrid Images (p. 102)
Photoshop Plug-Ins for GIF Optimization (p. 103)
Reducing File Size Online: GIFWizard (p. 104)
Animated GIF Issues (p. 105)
Making Small PNG Files (p. 106)
Batch Processing (p. 107)
Photoshop Actions (p. 107)
Photoshop and ImageReady's Batch Processing (p. 108)
ImageReady's Droplets (p. 109)
Firework's Batch Processing (p. 110)
DeBabelizer's Batch Processing (p. 111)
Image Optimization Resources (p. 111)
Summary (p. 112)
7 Color Calibration Issues (p. 113)
RGB Versus CMYK (p. 114)
RGB and ICC Profiles (p. 115)
What Is sRGB? (p. 115)
What Is an ICC Color Profile? (p. 117)
My Thoughts About ICC and sRGB (p. 118)
Helpful URLs (p. 118)
More Gamma Issues (p. 119)
sRGB in Photoshop 5.0 (p. 120)
How to Turn Off sRGB in 5.0 (p. 120)
Web Sites That Need Accurate Color (p. 121)
Summary (p. 122)
8 Browser-Safe Color (p. 123)
What Is the Browser-Safe Palette? (p. 124)
Browser-Safe Color Charts Organized by Value (p. 126)
Browser-Safe Color Charts Organized by Hue (p. 128)
Why Does the Browser-Safe Palette Exist? (p. 130)
Do Browser-Safe Colors Really Matter? (p. 130)
When to Use the Browser-Safe Color Palette (p. 131)
Hexadecimal-Based Colors (p. 132)
Non-Safe Colors Shift! (p. 133)
Illustration-Based Artwork (p. 134)
Photograph-Based Artwork (p. 135)
How to Use Browser-Safe Colors (p. 136)
Browser-Safe Hex Color Picking (p. 136)
Other Conversion Methods (p. 137)
Hex Color Aides (p. 138)
Pantone's Browser-Safe Solution (p. 139)
CMYK Is Not Browser Safe (p. 139)
Browser-Safe Color Picking (p. 140)
What Is a CLUT and What Do You Do with One? (p. 140)
How to Load a Browser-Safe Swatch Palette into Photoshop (p. 141)
How to Load a Browser-Safe Palette into ImageReady (p. 142)
How to Load a Browser-Safe Palette into Fireworks (p. 143)
How to Ensure That Your GIF Artwork Stays Browser Safe (p. 144)
Safe GIF Files in Photoshop (p. 144)
Safe GIF Files in ImageReady (p. 145)
Safe GIF Files in Fireworks (p. 145)
Vector-Based Software: Illustrator and FreeHand (p. 146)
Browser-Safe Colors in Illustrator 8.0 (p. 146)
How to Work with Illustrator 8.0 Swatches (p. 146)
Illustrator 7.0 and 8.0 CMYK Problem (p. 147)
Working with FreeHand 8.0 (p. 148)
JPEG Artwork Cannot Retain Browser-Safe Colors (p. 149)
Hybrid Image Challenges (p. 150)
Hybrid Image as GIF in Photoshop (p. 150)
Hybrid Image as GIF in Fireworks (p. 151)
Hybrid Image as GIF in ImageReady (p. 152)
Non-Safe Images with Solid Colors (p. 153)
Summary (p. 154)
9 Color Aesthetics (p. 155)
Color Vocabulary Terms (p. 156)
Choosing Color Themes (p. 158)
Color Relationship Terms (p. 158)
Applying Color Relationships to Web Design (p. 160)
Color Relationship Tools (p. 162)
Coloring Web Graphics.2 (p. 162)
Color Harmony Photoshop Plug-In (p. 166)
Readability (p. 167)
Color Gallery (p. 168)
Summary (p. 172)
10 Color HTML Tags (p. 173)
Default Colors (p. 174)
Color Attributes (p. 174)
The Body Tag (p. 175)
Link Colors (p. 176)
Using Color Names Instead of Hex (p. 177)
Color Names Are Rarely Browser Safe (p. 177)
Color Attribute in Netscape (p. 178)
The Font Tag (p. 178)
The Table Tag (p. 179)
Summary (p. 180)
11 Linking Basics (p. 181)
Identifying Links (p. 182)
Linked Images (p. 183)
Turning Off Image Borders (p. 183)
Importance of Width and Height (p. 184)
Shrinking and Enlarging Bitmaps (p. 185)
Visual Effects with Width and Height (p. 185)
Importance of ALT (p. 186)
American Disabilities Act (p. 187)
Thumbnails and Large Image (p. 188)
Linking to Other Media (p. 190)
Sound and Movie File Embedding (p. 190)
File Types and HTML (p. 190)
Aesthetic Cues for Linked Graphic (p. 191)
Summary (p. 192)
12 Background Tiles (p. 193)
Tiling Backgrounds (p. 194)
Determining Tiled Pattern Sizes (p. 195)
Full-Screen Body Backgrounds (p. 196)
File Formats for Patterned Tiles (p. 198)
Seams or No Seams, That Is the Question (p. 199)
Seams (p. 199)
No Seams, the Photoshop/ImageReady Way (p. 200)
Seamless Tiles in ImageReady (p. 200)
Seamless Tiles in Photoshop (p. 201)
Directional Tiles (p. 202)
Aesthetics of Backgrounds (p. 203)
Summary (p. 204)
13 Transparent Artwork (p. 205)
What Is Transparency? (p. 206)
Faking Transparency (p. 207)
Masking (p. 207)
Trickery (p. 207)
Browser Preferences (p. 208)
There's No Faking Patterned Tiles (p. 208)
GIF Transparency (p. 209)
Pro and Anti-Aliasing (p. 210)
Glows, Soft Edges, and Drop Shadows with GIF Transparency (p. 211)
Tools and Techniques for GIF Transparency (p. 212)
GIF Transparency in ImageReady (p. 212)
GIF Transparency in Fireworks (p. 214)
GIF Transparency in Photoshop 5.0 (p. 215)
What Is GIF89a? (p. 215)
PNG Transparency (p. 217)
Summary (p. 218)
14 Rules, Buttons, and Bullets (p. 219)
Horizontal Rules (p. 220)
Horizontal Rules, the HTML Way (p. 221)
Fancier Horizontal Rule Tags (p. 222)
Horizontal Rules and Background Tiles (p. 224)
Horizontal Rules the Do-It-Yourself Way (p. 224)
Using Photoshop 5.0 to Create Custom Rule Art (p. 225)
Vertical Rules (p. 228)
Clip Art Rules, Too (p. 228)
Bullets (p. 229)
HTML Bulleted Lists (p. 229)
Creating Ordered and Definition Lists (p. 230)
Organized Lists (p. 231)
Creating Custom-Made Bullets (p. 232)
Creating Custom Bullet Art (p. 233)
Buttons Using Photoshop's Layer Effect Settings (p. 234)
Button Clip Art (p. 235)
Summary (p. 236)
15 Imagemaps (p. 237)
Client-Side and Server-Side Imagemaps (p. 238)
Client-Side Imagemap (p. 240)
Server-Side Imagemap (p. 241)
Combining Server- and Client-Side Imagemaps (p. 242)
Importance of the ALT Tag (p. 243)
Importance of Width and Height Attributes (p. 243)
Do You Really Need an Imagemap? (p. 244)
What's a Comment? (p. 244)
Creating an Imagemap with Fireworks (p. 245)
Creating an Imagemap with ImageReady (p. 246)
Other Imagemap Resources (p. 247)
Summary (p. 248)
16 Web Typography (p. 249)
Glossary of Key Typographic Terms (p. 250)
Glossary of Elements Not Possible with HTML (p. 251)
Type 101 (p. 252)
Microsoft Typography (p. 252)
Aesthetic Considerations (p. 253)
Printing Web Pages (p. 253)
HTML-Based Typography (p. 254)
HTML Font Choices (p. 255)
Font Face Tag (p. 256)
Basic Fonts (p. ????)
Verdana and Georgia (p. 256)
Font Size Differences Between Macs and PCs (p. 257)
Graphics-Based Typography (p. 258)
Alizsing or Anti-Aliasing (p. 258)
Using Fireworks for Type Design (p. 259)
Great Resources for Online Fonts (p. 260)
Writing HTML to Place Text Graphics (p. 261)
What About Font Embedding? (p. 262)
TrueDoc (p. 262)
TrueType Embedding and OpenType (p. 263)
Security Measures (p. 264)
Type Designers Against Embedding (p. 265)
What About PDF? (p. 266)
What About Flash? (p. 267)
Summary (p. 268)
17 Alignment and Tables (p. 269)
How Big Is a Web Page? (p. 270)
Using HTML for Alignment (p. 271)
Text Alignment Tags and Attributes (p. 272)
Leading with HTML (p. 273)
Image Alignment Tags (p. 274)
Horizontal and Vertical Space Tags (p. 276)
Width and Height Attributes (p. 276)
Alternatives to HTML Using Artwork (p. 277)
Width and Height Attributes for Spacers (p. 277)
Tables for Alignment (p. 278)
Data Tables (p. 278)
HTML Table Tags (p. 279)
Graphic Tables for Page Layout (p. 282)
Percentages Versus Pixels (p. 282)
Percentage-Based Tables (p. 282)
Pixel-Based Tables (p. 283)
Terminate Your Tables! (p. 284)
Indents Using Tables (p. 285)
WYSIWYG Tables (p. 286)
Imaging Software Tables (p. 287)
Summary (p. 288)
18 Frames (p. 289)
What Are Frames? (p. 290)
Frames Pros and Cons (p. 291)
Frames Basics (p. 292)
Learning Frames (p. 293)
Code for a Frameset (p. 293)
Code for Increasing Border Size (p. 293)
Code for Zero Border (p. 294)
Code for Clipping the Content (p. 294)
Code for Relative Positioning (p. 294)
Code for Nested Frames (p. 295)
Target Practice (p. 296)
Code Inside the Container HTML (p. 296)
Code for Using Your Frame as a Target (p. 297)
Code for Replacing the Frameset (p. 297)
Target Tags for Frames (p. 297)
Fun with Frames (p. 298)
Bleeding Borders Simplified (p. 302)
Code for a Frameset Using Solid Background Colors (p. 302)
No Frames! (p. 303)
Summary (p. 304)
19 Cascading Style Sheets (p. 305)
What Is a Style Sheet? (p. 306)
Anatomy of a Style Sheet (p. 307)
Cascading Defined (p. 307)
Hiding Styles from Older Browsers (p. 308)
External, Internal, and Inline (p. 309)
Type and Measurements (p. 310)
Working with Typography (p. 311)
Selectors (p. 312)
ID Versus Class (p. 312)
Absolute Positioning (p. 313)
DIV and Absolute Positioning (p. 314)
Layering Text and Images (p. 315)
Code for Layering Text and Image (p. 316)
Code Deconstruction (p. 318)
WYSIWYG Editors (p. 319)
Summary (p. 320)
20 Scanning for the Web (p. 321)
What Resolution? (p. 322)
Dictionary of Scanning Terms (p. 323)
Scanning Equipment (p. 323)
Digital Cameras and DV (p. 324)
Photo CDs Instead of Scans (p. 325)
Resizing Images in Photoshop 5.0 (p. 326)
Do Not Resize in Indexed Color (p. 327)
Dot Screen Patterns and Moires (p. 328)
Image Processing Techniques (p. 330)
Levels (p. 330)
Hue/Saturation/Brightness (p. 331)
Summary (p. 332)
21 GIF Animation (p. 333)
The Aesthetics of Animation (p. 334)
Animated GIF Format (p. 335)
Animated GIF Tech Notes (p. 335)
Animated GIF Resources (p. 335)
Glossary of GIF Animation Terms (p. 336)
How to Create Animation Content (p. 338)
Common Animation Terminology (p. 339)
Tools and Techniques for Frame-by-Frame Animation (p. 340)
Frame Animation in ImageReady (p. 340)
Frame Animation in Fireworks (p. 341)
Motion Graphics in ImageReady (p. 342)
Using Instances and Tweening for Animation in Fireworks (p. 343)
Other GIF Animation Tools of Note (p. 344)
Summary (p. 346)
22 JavaScript: Rollovers and More (p. 347)
The Short History of JavaScript (p. 348)
Learning JavaScript (p. 349)
Rollovers (p. 350)
Creating Rollover Artwork (p. 350)
Replacement Example (p. 351)
Highlight Example (p. 351)
Multiple Example (p. 351)
Photoshop Layers for Rollovers (p. 352)
Cutting the Rollovers Apart (p. 352)
ImageReady for Slicing and Optimization (p. 353)
Simple Rollover in Fireworks (p. 354)
Fireworks Rollover Code (p. 355)
Rollovers in Fireworks (p. 356)
Rollover in Tables Using Fireworks (p. 357)
Rollovers in Dreamweaver 2.0 (p. 358)
Dreamweaver's Replacement Rollovers (p. 358)
Dreamweaver's Rollover Code (p. 359)
Dreamweaver's Pointing Rollover (p. 360)
Dreamweaver's Pointing Rollover Code (p. 361)
Dreamweaver's Multiple Rollover (p. 362)
Dreamweaver's Multiple Rollover Code (p. 364)
Backwards Compatibility (p. 365)
Browser Detection (p. 368)
Browser Detection Code (p. 368)
Launching Another Window (p. 369)
Code to Launch Another Window (p. 369)
Summary (p. 370)
23 Dynamic HTML (p. 371)
DHTML Overview (p. 372)
Cascading Style Sheets (p. 372)
JavaScript (p. 372)
Plug-Ins (p. 372)
DOM (p. 372)
Cool Things with DHTML (p. 373)
Appropriate Uses of DHTML (p. 373)
Layers (p. 374)
Animation (p. 376)
Drag and Drop (p. 380)
DHTMLzone (p. 385)
Summary (p. 386)
24 QuickTime 3.0 (p. 387)
QuickTime Basics (p. 388)
Web Advancements (p. 388)
QuickTime 3.0 Web Features (p. 389)
"Poster" Movies (p. 389)
HREF, Sprite, and Text Tracks (p. 389)
Multiple Data Rate Samples (p. 390)
Streaming (Sort Of) (p. 391)
Image Format Support (p. 391)
DV Camcorder Support (p. 391)
QTVR Support (p. 391)
Common QuickTime Commands (p. 392)
Cons of QuickTime (p. 392)
Digital Video Terms Glossary (p. 393)
Summary (p. 394)
25 Flash and Shockwave (p. 395)
Plug-In Reliance (p. 396)
Sending Visitors to Plug-In Pages (p. 396)
Flash File Format (p. 397)
Learning Flash (p. 398)
Flash Resources (p. 398)
Drawing in Flash (p. 398)
Scenes and Symbols (p. 399)
Making Symbols (p. 399)
Managing Symbols and Scenes (p. 399)
Timeline and Keyframes (p. 400)
Rollover Buttons (p. 400)
Add a Sound to the Button (p. 401)
Interactivity in Flash (p. 402)
Flash Web Integration (p. 403)
HTML Frames with SWF (p. 404)
Shockwave Content (p. 405)
Saving Shockwave Files (p. 405)
Intro to Director 7 (p. 406)
Director Interface (p. 406)
New Web Features (p. 408)
Aftershock for Director and Flash (p. 409)
Summary (p. 410)
26 HTML for Visual Designers (p. 411)
HTML Naming Protocols (p. 412)
Common File Names (p. 412)
File Extensions (p. 412)
Relative Versus Absolute Path Names (p. 413)
Troubleshooting (p. 414)
Checking Your Pages (p. 414)
Uploading Your Pages (p. 415)
Common HTML Tags (p. 416)
Head Tags (p. 416)
Body Tags (p. 416)
Alignment Tags and Attributes for Text (p. 416)
Text Tags (p. 417)
Horizontal Rule Tags (p. 417)
Linking Tags and Attributes (p. 417)
Alignment Tags and Attributes for Images (p. 418)
Image Tags (p. 418)
List Tags and Attributes (p. 418)
Comments Tag (p. 418)
Table Tags (p. 419)
Table Tags and Attributes (p. 419)
Frames Tags and Attributes (p. 419)
Summary (p. 420)
27 Web Graphics Resources (p. 421)
Design Conferences (p. 422)
Digital Art Programs (p. 422)
Helpful URLs (p. 424)
Web Site Design Galleries (p. 424)
Magazines (p. 424)
Glossary (p. 425)
Index (p. 431)

Author notes provided by Syndetics

Lynda Weinman is an author, instructor, and designer specializing in graphics and design for screen-based media. She has taught digital arts at numerous seminars and colleges, including Art Center College of Design, American Film Institute, San Francisco State, and UCLA.
Lynda's a featured columnist on digital graphics and animation, and writes for numerous national and international magazines. Most of her Web design books have been translated into many languages, and are published in second and third editions. She has recently opened her own training center in Ojai, California, and has launched a series of training videos under her lynda.com video imprint. Her Web site is located at http://www.lynda.com.