- Paperback: 494 pages
- Publisher: Apress; 1st Corrected ed., Corr. 4th printing edition (March 11, 2009)
- Language: English
- ISBN-10: 1590598040
- ISBN-13: 978-1590598047
- Product Dimensions: 7 x 1.2 x 9.2 inches
- Shipping Weight: 2.3 pounds (View shipping rates and policies)
- Average Customer Review: 37 customer reviews
- Amazon Best Sellers Rank: #1,571,499 in Books (See Top 100 in Books)
Enter your mobile number or email address below and we'll send you a link to download the free Kindle App. Then you can start reading Kindle books on your smartphone, tablet, or computer - no Kindle device required.
To get the free app, enter your mobile phone number.
Pro CSS and HTML Design Patterns 1st Corrected ed., Corr. 4th printing Edition
Use the Amazon App to scan ISBNs and compare prices.
All Books, All the Time
Read author interviews, book reviews, editors picks, and more at the Amazon Book Review. Read it now
Frequently bought together
Customers who bought this item also bought
Top customer reviews
This is the book that allows you to master CSS. It probably should be your primary CSS resource. It is a tour de force of CSS explication and moves one beyond guessing, "WTF? Why doesn't X work?", to knowing with a great degree of understanding how CSS works.
The author endeavors to systematically cover every usable feature of CSS 2.1, has run thousands of tests to tease out all the usable formulations of properties, and the book shows examples of each usage with HTML. The term "usable" is key. He's cut out the over 40 out of 122 properties and over 250 of 600 CSS rules that are not widely implemented by the major browsers. By doing so, he spares us the miserable task of cross-browser testing by providing only patterns that are guaranteed to work with all of them (and without the need for dubious hacks).
I did notice some seemingly missing coverage. The use of dynamic pseudo selectors on non-link elements barely gets a mention, as well as the outline property. I assume the author passes over them because they were deemed unsupported by all major browsers at the time of publication (2007), however currently they are widely supported and should be included in a subsequent edition. Current browsers support many items previously deemed "unusable". And any concessions made to support the disreputable IE 6 can be mercilessly excised. Mercifully, IE 6 is no longer a "major" browser.
There are some things that are outdated, such as the advocacy of XHTML over HTML. XHTML 2 has crawled into a corner, and HTML 5 is the new heir. This doesn't detract from the overall value of the book. The stuff here is classic in its utility. The fact that it works reliably in major browsers circa 2007 means that it will work with newer browsers as well. E.g., there may be new ways to accomplish rounded corners in CSS 3, but the older techniques shown in the book will also work in current browsers. You might even prefer to use the older techniques for reasons of backward compatibility.
Other books on CSS that I've seen, even advanced books, boil down to a few of the author's favorite techniques and tricks. You get spotty coverage, consisting only of what the authors happen to want to impart. Part of the problem is that CSS really is huge. There's so much you can do, with so many settings and properties to deal with in order to accomplish things. Other books I've seen don't even attempt anything near sweeping coverage.
Not only is CSS a big topic, it is full of seeming inconsistencies and mysterious black art ways of accomplishing various tasks. Part of the problem is that outside of the Official Spec, CSS is just not adequately covered in one place. This book offers systematic and thorough coverage of CSS. The author has also taken the mass of CSS/HTML rules and behaviors and organized them into a coherent taxonomy that lends sanity to the combinatorial explosion of CSS property formulations.
Without such organization CSS can appear to be a crazy-quilt of rules with myriad maddening and confusing exceptions. This taxonomy provides you with a rational conceptual model to understand CSS design execution. And when you understand a particular design formula applies to a particular element, you also know that the behavior applies to the larger class of elements, which widens the scope and practical applicability of your understanding, while at the same time streamlining your learning.
To use a specific example, consider the box model. Any decent book on CSS describes the box model, it is central to understanding how HTML elements behave with CSS. Officially the CSS spec discusses a single but varying box model. However, this oversimplifies things to the point of confusion. The problem is that the box model can have different behaviors depending on the HTML element and the CSS property combinations. And the same properties can have different results depending on the element. So designers wind up being befuddled by what seem to be oddities and inconsistencies of CSS which are irreconcilable with the simplistic box model they've learned.
The author has synthesized the various permutations into six specific, consistent models which can be applied to all HTML elements. This is necessary because the models aren't explicitly identified in the CSS specification, only implied. This synthesis of identifying implied behaviors as explicit models is a great part of what makes the book innovative.
Once you know these models, you see the behaviors as reliable intrinsic attributes of discrete model operation, rather than as random results which you vaguely understand, may not be able to replicate or control, and can't rely upon. They resolve the confusing inconsistency of a single box model. When you understand how a behavior works, you can execute the behavior on not just a specific element, but on the class of elements to which its box model applies. Since every element adheres to some box model, your understanding serves as leverage on every other element of that class.
I'll add that box models aren't simply trivial aspects of CSS design, they are a foundational core concept which apply to all HTML elements. I've not seen any other book take such pains to explicate the details of them. The author devotes three entire chapters to the box model alone in order to establish a comprehensive framework for understanding it. What he does for the box model, he also does for positioning - identifying six explicit models; sizing - three models; tables - four models. I.e., he establishes clear, complete models of behavior which one can rely on for predictably working with the CSS area at hand.
The book takes the approach of providing an organized collection of 350 reusable formulas, or solutions - the author uses the terminology of design "patterns". The term pattern is used in the computer programming world to connote not only solutions for particular problems, but also a kind of independent modularity that allows these solutions to be mixed and matched with other patterns to build a greater whole, as with Lego pieces. In other words, these patterns are elemental solutions which can be relied upon to work by themselves, and can be combined with other patterns to form more complex composite entities.
By breaking CSS into elemental, reliable, and reusable design patterns, you wind up with an extensive tool kit containing building blocks which you can combine to produce your desired effect in a dependable and efficient manner. From simple to complex manifestations, the patterns are guaranteed to work in all major browsers while at the same time being engineered with best practices and accessibility. This means you replace the guesswork and trial and error hacking about, which so often characterizes CSS programming, with predictable and reliable behavior and techniques. Find your pattern, tweak the values to your own needs - done. And know it will work in multiple browsers. You get the immense gift of confidence in your design work execution.
Taken as a whole, these patterns cover the major aspects of CSS design. They are organized into major design topics such as positioning, styling text, aligning content, layout, tables, etc. The list is extensive. In this way the book can function as a cookbook, allowing you to reference a specific issue by topic section. It can also function as a learning text, allowing you to read the section on, say, tables, and learn all about tables.
Each individual pattern is formatted so that when the book is open it is laid out with a screen shot of the pattern as it appears in a browser on the left facing page and the explanation and relevant code on the right facing page. This makes it possible to quickly flip through the pages for ideas or access a solution visually. This consistency of layout is a major feature: while keeping your eyes set at the same place it allows you to flip the pages of the book so that you can visually scan the images for the result you seek.
So let's say you are seeking to format a table with mixed column sizes. You can go directly to the table section and flip through the pages, all the while keeping your eyes fixed at the place where the image appears, until you come across the one that matches your desired result. It's actually pleasurable to use - you'll wonder why all design books aren't formatted this way.
Many books do not service well after first reading and make for terrible references. The organization of this book make it well suited for coming back to as a reference. By organizing all information related to a specific topic in one place it becomes easy to access later. It also allows you to contrast and compare related topic behaviors in one place. This localization aids in focusing, amplifying, and mentally organizing the information.
E.g., going to the Margin section you can see how margins affect various elements, and this helps you determine which type of element you may wish to use. Contrast this with having to recall all elements to which margins apply and checking them individually in different respective places. That's a lot of rooting around, and it leads to hit and miss coverage. Instead, you can see how the property affects all elements in one place.
This organization also helps with debugging. When something is not working as expected, a common method of debugging is to take away properties one at a time until the problem disappears. When the problem disappears, you know that the issue exists with the most recently removed property.
E.g., say you've figured out that the margin is causing your stretched table to overflow its container. You can go directly to the margin section of the book to see how the margin property affects tables, as well as alternative formatting of tables, as well as alternative elements with different margin behaviors.
Compare this to searching through a different book where the author covered such a thing in some arbitrary chapter where he happened to be using the design within another context, of perhaps displaying a calendar, and it could have been in the beginning of the chapter or the middle, you don't quite remember. You have to scan all over the pages fumbling around hoping to get back to that spot. It makes for very inefficient access to information.
The author also provides extensive cross-references to the related patterns, furthering your understanding of a pattern's relationship to the contextual whole. Access is further augmented by having a detailed table of contents, index, thumb tabs, chapter outlines, uniquely naming each pattern, and a link to the companion web site where you can see each pattern live. You can tell the author has thought much about making content accessible to the reader, but also about providing not just content, but context. He's not just doing a brain dump of his expertise, leaving it up to the reader to sort things out. He has written the book with organization, context, and accessibility as key parts of its architecture.
Organization is essential to pedagogy in general. It's not simply exposure to raw expertise that counts. That expertise needs to be presented in such a way as to produce a structured, cumulative framework of knowledge, free of internal inconsistencies, so as to be maximally useful and form what we call comprehension. This book is an example of how organization of content is as important as the content itself - typically, a poorly executed aspect of many instructional books. The meta importance of content organization is that it's not just an arrangement of content, but an implied directive on how to mentally organize and think about the material.
The book's concentration is about structure, not aesthetics. The book is about manifesting what is possible from an execution perspective. It's not about how to make things pretty, it's about how things are made. While CSS may seem technical, it is necessarily so by nature because there is ultimately a machine being instructed by it. But this is a happy circumstance. Being a technical discipline means that one can access the possibilities by objective means. It takes execution out of the realm of black art and into accessible mechanics.
The book is not without its warts. It reads like a technical manual and the explanations can seem abstruse. I wish the author did a better job of explaining some things, broke with the technical style of presentation in places, and wrote about some of the topics in a more informal manner. It would have been useful for many readers if the author had done a little hand-holding for the reader rather than stick so rigidly to the technical format.
The author makes reference to "terminal nodes" without any discussion of the Document Object Model which would have given context to what's being terminated. Terms confusingly cross-pollinate and the author could have done a better job of making items more distinct and contrasted. As the author's background is computer programming this style and approach is not surprising. However, to those not inclined, it can be a challenge to parse such spartan prose, requiring one to muster up a rigorous discipline of reading.
The topic of sizing could be more adequately explained. For anyone caring to use this review as an addendum, an element's "size" is a calculated value which may or may not include all the constituents of inner-box, padding, border, and margin. So, for instance, when a stretched table with a margin overflows its container, it is because the size calculated for it didn't include the margin (Chapter 5, pg 105). This holds true for tables, floats, and inline-blocks. A discussion of what causes overflow would have been quite instructional to have as well.
I think you will get the most benefit from reading the entire book front to back. If you jump to the positioning section, it describes how positioning affects various box models - but if you skipped the box model chapters you'll be lost. At least read the box model chapters before skipping around. While the patterns are self-contained in execution, the book content is cumulative, with subsequent chapters building on previous ones.
The book may require of the reader a fair amount of determination and fortitude to get through it. At first pass, the book can be overwhelming - it's highly concentrated stuff. Although the author has accomplished a great feat in making the CSS spec accessible to mere humans, it can still be a formidable read. You may need a third, fourth, or fifth reading of the book in order to grok it all. But after the fluff of other intermediate or advanced books, the compactness and concentration of content in this book will come as a welcome change in efficiency of access. I think one would benefit from re-reading it every few months, with each pass providing further perspective and ideas, and cementing the content in one's head. The reward is that you change from guessing about CSS to knowing CSS.
I've bought Apress (the publisher) books of wildly varying degrees of quality - I was unfortunate to have purchased one which was so poorly written it required more than an hour of making corrections from its errata and a number more posting new ones - but that didn't make up for the poor overall quality.
I'm dismayed at seeing that corrections I submitted to the publisher's web site months ago have not appeared in the errata. In fact, the web site doesn't show any corrections whatsoever for the book - no errata exists. A bad sign that the book is being ignored by the publisher or maybe that they are doing a poor job of maintaining their books. Readers are not likely to help improve a book by submitting corrections if it appears that the publisher doesn't care. Thankfully, this book contains few critical errors. The book is easily worth twice its asking price, and I consider it a classic in the field. Judging by the lack of a recent edition update, I think the publisher may not appreciate the gem it has on its hands.
To summarize, if you seek to master CSS, this is the book to get. In comparison, other books in the field pale with inadequacy. It presents coverage of CSS that is systematic and comprehensive, and it provides you with a structured framework of knowledge that brings order to CSS chaos, sparing you time and effort, and allowing you to confidently manifest reliable designs that work in all major browsers. But passive readers need not apply.
Final notes, if the publisher is listening: it is a poorly titled book. Marketing-wise it has no value. A more appropriate and less impenetrable one might be "The Elements of CSS Design".
Some of the examples would have benefited from having not only the schematic browser screen shot, but a real world example. E.g., we're shown that inline or block elements can be displayed as tables, rows and cells, but why would we want to do this? A concrete example would provide some guidance. Perhaps these could be provided on the companion web site so as not to bloat the page count of the book.
With a few changes and a bit more user friendliness, this book could go from being the unsung classic in the CSS field to being THE book for CSS, in the same way that "Agile Web Development With Rails" is to Rails programming or "The C Programming Language" is to C programming.
1. When you input the examples and view them in different browsers, they display differently, and don't match the display in the book.
2. Even the example pages up on the web site associated with the book do not display the same in all browsers. For example, the Display page from Chapter 4 has the p, li, table and strong elements all on the same line. Yet on some browsers the table and strong elements show up on the next line, and on others the table shows up on the next line and the strong element shows up on the line after that. Where are these carriage returns coming from, when all of these elements have the display value set to inline? The browser window width is not too small to show all the elements inline.
3. Learning and dealing with CSS and trying to make it do what you want and have it do the same in all browsers is a frustrating job of trial and error. My hope was this book would turn it into an exact science, so that when you add some CSS code, you know what your page is going to look like, no matter what browser displays it. Unfortunately, with CSS, I'm convinced you have no choice but to constantly do trial and error with every layout you write, in order to tweak it to get it right.
4. In many of the examples, the author leaves out "Nonessential rules". When I'm trying to understand the examples, I don't want any rules left out, so that I don't have to figure out why when I'm doing the examples my page doesn't look exactly as it does in the book.
Of course, I haven't seen any book on CSS able to provide a consistent set of rules that can be followed to get it to do what you want. I think this book is probably going to come as close as you're going to get.
This author presents the most complete presentation of all of the interactions between html properties and css selectors I have seen in any one book. Rather than just listing definitions of each element, but going into the myriad of effects that almost all selectors have applied to each property.
He brings programmatic design pattersn to his presentations which is of some use but; the most important thing is he takes a very systematic and detailed approach to the interactions stated above.
IMHO, i would take reviews too focused critically on the use of span tags in the examples with a grain of salt or two. Once you understand interaction between all of the specific CSS selectors and property elements (not that I'm there yet) you can of course use span tags for only presenting inline markup elements.
The real beauty of this book to me is the detailed coverage of the affect of each and every selector (that is applicable) to each and every property element and thus one learns to think outside the box..model.