Painting the Web (Paperback)

~ (Author)
Key Phrases: image magic, play dough, animated clock, Hello World, Google Maps, Paint Shop Pro (more...)

Editorial Reviews

Product Description

Do you think that only professionals with expensive tools and years of experience can work with web graphics? This guide tosses that notion into the trash bin. Painting the Web is the first comprehensive book on web graphics to come along in years, and author Shelley Powers demonstrates how readers of any level can take advantage of the graphics and animation capabilities built into today's powerful browsers. She covers GIFs, JPEGs, and PNGs, raster and vector graphics, CSS, Ajax effects, the canvas objects, SVG, geographical applications, and more -- everything that designers (and non-designers) use to literally paint the Web. More importantly, Shelley's own love of web graphics shines through in every example. Not only can you master the many different techniques, you also can have fun doing it. Topics in Painting the Web include: GIF, JPEG, PNG, lossy versus lossless compression, color management, and optimization Photo workflow, from camera to web page, including a review of photo editors, workflow tools, and RAW photo utilities Tricks for best displaying your photos online Non-photographic raster images (icons and logos), with step-by-step tutorials for creating popular "Web 2.0" effects like reflection, shiny buttons, inlays, and shadows Vector graphics An SVG tutorial, with examples of all the major components Tips and tricks for using CSS Interactive effects with Ajax such as accordions and fades The canvas object implemented in most browsers Geographical applications such as Google Maps and Yahoo Maps, with programming and non-programming examples Visual effects such as forms and data displays in table or graphics Web design for the non-designer

Graphics are not essential tothe web experience, but they do make the difference between a site that's functional and one that's lively, compelling, and exciting. Whether you want to spruce up a website, use photos to annotate your stories, create hot graphics, or provide compelling displays for your data, this is the book for you.

About the Author

Author of Practical RDF and co-author of O'Reilly's Unix Power Tools 3E

Product Details

• Paperback: 638 pages
• Publisher: O'Reilly Media (April 1, 2008)
• Language: English
• ISBN-10: 059651509X
• ISBN-13: 978-0596515096
• Product Dimensions: 9 x 7 x 1.5 inches
• Shipping Weight: 2.6 pounds (View shipping rates and policies)
• Average Customer Review: 3.8 out of 5 stars  See all reviews (5 customer reviews)
• Amazon.com Sales Rank: #509,000 in Books (See Bestsellers in Books)

Customer Reviews

Most Helpful Customer Reviews

10 of 12 people found the following review helpful:

4.0 out of 5 stars SVG and Canvas Primer , September 7, 2008

By	G. Barber (Australia) - See all my reviews (REAL NAME)

Painting the Web by Shelly Powers is not the type of book I would normally pick up. Having 14 years web design experience means that you tend to have absorbed something in the way of use of graphics on the web, from raster images, to Scalar Vector Graphics (SVG), which is what this book is all about.

Looking at this book from its title alone, I first thought, Painting the Web was a book on SVG. But I was wrong, well partly wrong.

Shelly, takes you through what makes up the graphics on the web now and into the future in a chatty friendly manner, however this book can be a touch dry when it comes to technical explanations.

Raster to Start, Plus a little SVG

It moves through image and colour theory onto a review of professional to budget applications both desktop and online. The book presents a no nonsense explanation of the software. It also supplies a few how to recipes on the building of raster graphics for the web.

A good third of the book is dedicated to the use of vector graphics on the web. Dealing with X3D, VRML (now that brings back memories), VML, SVG (noting it's restrictive browser implementation). I was expecting maybe a little discussion on desktop vector applications, but instead there is comprehensive introduction on SVG. It's not just a few pages folks, this goes from the simple to complex examples. There is also a good overview of the SVG tools and editors in the marketplace to round it off.

Web Design Basics

There is a small section looking at CSS. Now this is not meant to be a primer, it assumes you know your CSS, and I'll assume you do. The book looks at the more advanced elements of CSS 2, not bad if you're not using all the browser compliant elements already. It runs us through concepts such as pseudo-elements, specificity and styling microformats. Like with Raster graphics there are a number of CSS recipes as well.

For me this is where the book slips up a little; if we are uber CSS designers then we should know all the basics that she explains such as layered background, conditional statements, font unit resets, unordered list menus.

There is a section on the principles of good design, as well, detailing how to layout a good semantic web page, be that static or via a flexible layout grid.

One small point on the microformats front, a footnote reference to the microformats wiki would have been a nicety, it's not a biggie, something to consider for the 2nd edition. There is also no explanation what microformats are and how they are used. Slap on the wrist to the technical editor.

Lets Go Dynamic

Dynamic Web Page Graphics is also gets a look in. I was expecting a section on Silverlight, Flash, a little AIR and maybe a some Ajaxian animation. What the book presents is DHTML (shudder - does anyone still use that term anymore). This book steps through the DOM and the usual manipulation of the CSS styling moving onto lightbox and accordion functionality using the standard unobtrusive Javascript implementation. Again this is a quick visit into the ajaxian world.
Paint the Canvas

There is a interesting exploration into the realm of the canvas and it's extension into the use with SVG. This book explains the creation of simple objects and their comparison to SVG, to the use of canvas effects and transformations. The canvas element is one of those under used elements that I can see getting a greater use in the near future.

The section ends with an extensive bringing together of SVG and the canvas with a little Javascript and manipulation of the DOM. It is the use of this type of animation techniques demonstrated in the book, that make me really question the need for implementation of like functionality in traditional animation rendering platforms like Flash.

Overall

Overall it's not a bad book, like I said previously, not something I would pick up, but I'm a little jaded on the subject and looking for the edge. Still the sections on SVG and the canvas where informative.

These sections on SVG and canvas to some may seem to be worthless. Well I have the feeling that we are going to see a greater use of these to with the development of various dynamic canvas libraries as with have with Javascript. This book has just seeded the ground for this with a good primer in the subject. With the increasing compliance of browsers with SVG, it will not be long before this is another standard technique for front end developers..

However, the book could do with the gleam of a good technical editor, there are sections of the book that I was wincing over, not that they are technically wrong. It was just the sequence of the chapters and the information therein, a little too much on digital imagery and photographic aspects for my liking for instance.

This with some of the disjointed sections it tended to give me the impression that the book was all over the place not really knowing what it wanted to be, graphics, CSS, AJAX, SVG, Canvas or design overview; it does it all. A little streamlining and this could have been a better book.

That said if you want a good comprehensive overview on the graphical elements of the web, especially SVG at 600+ pages, Painting the Web, by Shelly Powers is a good place to start.

Side note

There is no way Shelly could have know about Javascript dynamo Dmitry Baranovskiy's awesome Raphaël JavaScript Library that provides cross browser support for browser generated vector graphics such as SVG. Considering the book was published in April 2008, I sure, if she had known this would have been included.

9 of 11 people found the following review helpful:

4.0 out of 5 stars Looking over the shoulder of the Web Graphics designer, June 2, 2008

By	Jay P. Vansanten (Indianapolis) - See all my reviews (REAL NAME)

In spite of the huge number of graphics on the Web, the practice is surprisingly underserved in terms of the literature. Of course, there are design books, books on software, but these focus on best use of a product. The nuances and requirements for the Web are harder to find.

This book is a practitioner's book. And, it's a quite personal work. Written in a conversational style, it's easy to read. The author covers a wide range of tools which she uses on a regular basis. That includes a variety of less-familiar open source tools.

There is a great deal of HTML, CSS and JS code related specifically to graphic representation. It's really convenient to have this foundation in one place.

At first glance, one might be surprised at the detail given to techniques of Photoshop and other tools. But again, as a practitioner's book, it reflects the techniques useful for specifically Web design. It's handy to have these in one place for reference.

Because it is a rather personal work, there will be emphases that one might change. There is a significant amount of space spent on SVG -- which, although a standard, I think is problematic because of the lack of inherent support in IE and Adobe's discontinuation of the plug-in. In any case, weighing in at 638 pages, there's a lot of good information, regardless of one's personal opinion.

The focus is on traditional and standards-based HTML programming. The author does broach the canvas object -- a part of the HTML 5 standard which provides another route to animation on the desktop. However, IE8, at the time of the book's writing, didn't support this object. There is no coverage of Flash, and Silverlight is mentioned simply to identify another non-standard MS approach. Indeed, both Adobe and MS focus their energies on Flex/Flash/AIR and Silverlight technologies respectively to provide a richer Internet experience.

As fits a book on graphics, illustrations are in color. This adds a lot to the vitality of the read, and helps portray information in a useful way.

As the author notes, no one book can address the many issues related to web graphics. This book is of a different character than Weinman's Designing Web Graphics.4. Though in need of an update, that volume presents a more structured and a complementary perspective to the present.

In any case, it's a good addition to the Web designer's bookshelf.

4 of 4 people found the following review helpful:

4.0 out of 5 stars Good Resource For Web Graphics People, August 27, 2008

By	Daniel McKinnon (Tewksbury, MA USA) - See all my reviews (TOP 500 REVIEWER)

'Painting the Web' by many-time author Ms. Powers is a look at graphical design and layout of said data on the web. Focus is on how things should/can/will look on the internet, specific graphics tools and approaches and a detailed look at the SVG file format. SVG is a standard image format for displaying vector-based images instead of point based output like JPEGs and GIFs. SVG is an XML-type format that can be read in and edited in any text editor. The book is full color which I always appreciate and it written by a seasoned pro.

This is a nice companion book for any and all that do graphics programming on the web and is easy to recommend. Jam packed with 600+ pages of content this is a massive text that probably could have been reduced in size but what is there is a positive effort for sure.

**** RECOMMENDED