Web Design Essentials (Professional Studio Techniques)

"Create Great Web Graphics Using
Photoshop, Illustrator, and GoLive"

Click on a thumbnail to enlarge it. Use your browser's "BACK" button to return to this review when done.
coverTitle: Web Design Essentials (Professional Studio Techniques)
Author: Maria Giudice with Anita Dennis
Publisher: Adobe Press Book published by Peachpit Press http://www.peachpit.com
Publication Date: December 1999
Pages: 120
ISBN: 0-201-70011-5
Price: $40.00

Type of BookWeb Design Essentials (Professional Studio Techniques) will delight users who are familiar with the other books in the Adobe Professional Studio Techniques series, which are wide-format books that lie flat on your desk as you work through step-by-step instructions and learn tips on using Adobe's popular software titles. This book focuses on using Photoshop 5.5, Illustrator 8.0, and GoLive 4.0 to create Web sites, pages, rollovers, batched icons, animations, and many other useful elements. These techniques are provided by several professionals using examples from their own projects. The book presents some 40 step-by-step procedures, and organizes tasks into three categories of difficulty, though none should be beyond the beginner who has a basic grasp of the programs. The procedures are easy to follow and many of them rarely exceed ten steps. Most of the page space in the book is devoted to wonderful color illustrations of the material. The book is suitable for both PC and Macintosh users.

User LevelAdvanced Beginning, Intermediate, and Advanced users. This book is appropriate for just about anyone who has a basic knowledge of Photoshop, Illustrator, and GoLive.


Web Design Essentials (Professional Studio Techniques) is divided into six chapters: Planning Production; Preparing Graphics; Managing Type; HTML, Tables, and Frames; Animation and Rollovers; and Appendices. Each chapter is further broken into numerous sections. As with the other books in the Professional Studio Techniques series, it has an interesting layout. It is a long book, rather than wide, being 12" wide by 9" tall, with two and occasionally three pages for each section. Each section starts on the left side of the book and includes a large color graphic using the techniques covered in it. Then instructions are given with additional screen shots and images. This layout makes it easy to flip through the book and find exactly what you want. Below is a description of what the book contains. I have mentioned just some of the professionals and their tutorials as I describe the chapters.

Chapter 1: Planning Production--Planning Sites with Flowcharts; Managing Site Content; Automating Tasks with Actions; and Automating Tasks with Droplets.

This chapter contains an excellent section on creating a flowchart. There is a section by HOT designer Renee Anderson on creating an action for naming and saving the navigation buttons for a prototype online-banking site for Bank of America.

Chapter 2: Preparing Graphics--Converting Raster Images to Vector Graphics; Selecting and Replacing Colors; Shifting Colors to the Web-Safe Palette; Dithering Only Part of an Image; Expanding on the Web-Safe Palette; Creating Drop Shadows; Tiling a Background Pattern; and Creating Static Motion.

There is a creative section by HOT designer Hyland Baron who shows how to use Streamline to convert a scanned inked drawing into a vector format and another by illustrator Sandra Kelch who shows you how to find and change colors in a scanned gouache painting with many areas of flat color. Plus CNET senior designer and production specialist Casey Caston explains how to dither just a portion of an image and Minneapolis-based designer Jason Kottke explains how to create the illusion of motion in your graphics without actually animating them.

Chapter 3: Managing Type--Specifying Fonts for Your Site; Understanding System Fonts; Using Anti-Aliasing; Simulating HTML Text in a Graphic; Creating a Quick 3D Text Effect; Applying Style Sheets to HTML Pages; and Understanding Style Sheet Attributes.

This section has a variety of useful charts on fonts, such as system fonts, popular fonts, cross-platform font appearance as well as a great chart on understanding style sheet attributes. Jason Kottke demonstrates how to simulate HTML text in a graphic.

Chapter 4: HTML, Tables, and Frames--Slicing Images for HTML Tables; Making Slices for Complex Grids; Making Image Maps; Creating a Graphical Frame for Text; Setting Up Tables with Drop Shadows; Making Framed Sites Searchable; and Designing Forms for the Web.

I found this section to be very informative, especially the following tutorials. Frank Kolodziej shows how to slice up an image in ImageReady with all of the complex elements. Designer Ben Seibel shows how to prepare a tables with drop shadows in Photoshop and ImageReady and import and place the slices in nested tables in GoLive.

Chapter 5: Animation and Rollovers--Slicing Images for an Animated Download; Creating Animated GIFs; Creating a Complex Animated GIF; Using Layers to Create Rollover Effects; Using Blending Modes to Create Rollover Effects; Understanding Blending Mode Effects; Combining Animation and Rollovers; Designing "Remote" Rollovers; Animating with DHTML; and Producing Animated Movies.

HOT designer Florian Fangohr shows how to create an animated GIF using ImageReady's Tween feature, which automatically creates intermediate frames of motion between the start and final frame of an animation. There is a creative tutorial by freelance computer graphic artist Steve McGuire showing you how to create a complex animation of a perennial favorite: fireworks. This particular animation is used on Hewlett-Packard's sponsorship page for the 1998 World Cup. HOT designer Florian Fangohr shows how to design remote rollovers; Amy Franceschini shows how to animate with DHTML using a 3D image of a boat that she created for an online game.

Chapter 6: Appendices--Creating a PDF Style Guide; Hex/RGB Conversion Chart; and Contributors.


Personal CommentsWeb Design Essentials (Professional Studio Techniques) is an inspiring book. It is user-friendly yet has a wealth of information. The illustrations are high-quality and beautiful. If you are not inspired by this book, I don't think anything could do it. A great book for any designer who wants to create professional images.


Graphics: Adobe Illustrator & Adobe Photoshop
Web Page Editor: Macromedia Dreamweaver 3.0
Scanner: Hewlett Packard ScanJet 6250C Professional Series