CSS: The Missing Manual 151
Michael J. Ross writes "Ever since Cascading Style Sheets (CSS) first appeared on the Web scene in the late 1990s, a plethora of books have been written and published that purport to explain how CSS works, and how to make it work for you. So why would any publisher decide that what the technical world needs is yet another CSS book? Perhaps because they have taken a close look at the bulk of those available titles, and found them to be wanting — filled with overly theoretical explanations and sample code that is far too focused on some pet domain of the author. Such books may be adequate for the veteran Web developer, who has the time and inclination to separate the wheat from the chaff. But developers new to CSS need much more approachable material, with clear examples. Perhaps that is the thinking behind CSS: The Missing Manual." Read the rest of Michael's review.
CSS: The Missing Manual | |
author | David Sawyer McFarland |
pages | 494 |
publisher | O'Reilly Media |
rating | 7 |
reviewer | Michael J. Ross |
ISBN | 0596526873 |
summary | An accessible guide to using CSS with HTML. |
Written by David Sawyer McFarland, CSS: The Missing Manual is published by O'Reilly Media, as part of their Pogue Press series, under the ISBN 0596526873. It first came out in August of 2006. The publisher maintains a Web page for the book, where visitors can find a link to register their copy of the book (does anyone do that?), a page for submitting errata (none yet, as of this writing), a form for posting a review on the O'Reilly site (again, be the first!), and a sample chapter (Chapter 1: Rethinking HTML for CSS) as a PDF file. There are also links for purchasing the book in the U.S. or the UK, and for reading the online version, as a part of O'Reilly's Safari service.
The book's 494 pages are organized into 14 chapters and three appendices, grouped into five parts. In addition, there is an index, as well as a terse but meaty introduction, which even includes a summary of HTML. The humor for which the Missing Manual books are known, begins early, in introduction, though in this case probably not intentionally: Page 9 claims that the book "is divided into four parts," and then lists the five parts. Before commenting upon those five-ish four parts, it should be noted that the table of contents runs seven pages, listing the book's parts, chapters, sections, and subsections. Future editions of the book would benefit from an overview table of contents, similar to those used in an increasing number of technical books, to good effect.
The 14 chapters cover most if not all of the essentials: writing HTML for CSS; creating styles and style sheets; determining what to style; using inheritance; using cascading; formatting text; setting margins, padding, and borders; styling graphics; styling links and navigation bars; styling tables and forms; creating float-based layouts; positioning page elements; creating print stylesheets; and writing maintainable CSS code. The three appendices include a CSS property reference, a discussion of CSS use in Dreamweaver version 8, and a listing of CSS resources to supplement the book.
On the positive side of the ledger, the author does a commendable job of clearly explaining all of the essential topics that the typical developer would need to understand in order to begin developing a robust Web site based on HTML and CSS, or reworking an existing site that is in desperate need of an overhaul. The clear explanations and bite-sized examples demonstrate that David Sawyer McFarland is not only an experienced Web developer, but likely has spent considerable time explaining to others how to do the same — as a writer, trainer, and instructor. This book is not his first, for he has previously written Dreamweaver: The Missing Manual.
One valuable aspect of the book under review, is that McFarland discusses how to overcome the most commonly encountered browser problems, in which Web pages employing CSS are not being formatted as one would expect and as specified in the CSS standards, by misbehaving browsers (that means you, "Internet Exploder"). Moreover, the book is also one of the first to document the significantly enhanced, long overdue, and welcomed CSS support in version 7 of the most commonly used Web browser (yes, we're still looking at you, "Browser by Bill").
The book is one in a series of many so-called Missing Manuals, whose tagline is "The books that should have been in the box," and whose Web site characterizes them as "Warm, witty, and jargon-free, [with] enough clarity for the novice, and enough depth and detail for the power user." In many respects, McFarland's latest contribution matches that description. In addition to the straightforward and yet comprehensive discussions of each topic, the author imbues his writing with a bit of humor, without overdoing it, or trying too hard, as is sometimes seen in other books covering subjects that admittedly can be quite dry.
On the negative side of the ledger, someone — or, more likely, some committee — somewhere along the decision chain, stipulated that almost every page of the book should be formatted so that the outside 1.5 inches, which is the easiest for a reader to see, should be consumed by a mostly empty and useless gutter, the bulk of which is filled with a light gray bar. This pushes the text, which slightly more than 4.5 inches wide, further in, toward the book's binding, and thus more difficult to read. This is true even though O'Reilly has wisely chosen to use RepKover, a flexible lay-flat binding. This exasperating style of layout is not characteristic of O'Reilly's books, which are generally much easier to read, with more sensible margins and often larger font.
One of the first principles taught to those learning Web design, is to avoid using white text on a black background. Such Web pages usually try to appear cool and edgy, but instead often comes off as immature in the eyes of an Internet veteran, and sinister to the Internet newbie. It doesn't work on Web sites, and it doesn't work in Web books. Sadly, O'Reilly chose to use white-on-dark-gray for many of the book's sidebars, making them difficult to read, especially as the sidebar text font size appears to be a bit smaller than that of the regular text.
In a nutshell, the content of this book is excellent, while the presentation of that content leaves much to be desired — ironic for a book focusing on CSS, whose primary purpose is to modularize and simplify presentation, neatly separating it from content. Ranking the content and presentation on a scale of 1 to 10, I would give them 9 and 5, respectively. Yet on balance, just as is true for most Web pages, the content is more important than its layout and other aesthetic considerations. CSS: The Missing Manual is a well-written, lighthearted, up-to-date, and easily accessible guide to modern CSS and how to use it in the real world.
You can purchase CSS: The Missing Manual from bn.com. Slashdot welcomes readers' book reviews -- to see your own review here, read the book review guidelines, then visit the submission page.
Now if only (Score:5, Insightful)
Keep in mind... (Score:5, Insightful)
Re:I Use Google (Score:2, Insightful)
Re:Welcome to my hell. (Score:3, Insightful)
CSS is a great idea, but doing it in practice blows because the browsers vary so much in their implementation.
I actually find CSS to be very simple in practice, for automated styling and real world use with one caveat: I don't support IE. Seriously. I just follow the spec and it looks great in every browser out there, Firefox, Opera, Safari, whatever. For IE I make sure it sensibly degrades to plain, unformatted hypertext with a note that IE is broken and users should upgrade to any other browser.
Re:I Use Google (Score:3, Insightful)
However, there are still lots of people that like print. Plus, it is very convenient to have it all in one place. There are great CSS sites, but they usually only cover a few aspects, and even fewer very well. So, for true newbs having a single place to get "all the details" could be beneficial.
Speaking of googling for technical info (or really anything), while it is obvious to some (most
All that to say, print isn't dead it just serves a differnt role than it used to.
Re:Now if only (Score:2, Insightful)
Re:Welcome to my hell. (Score:5, Insightful)
Re:Now if only (Score:5, Insightful)
The problem is the browsers like IE that either only partially implement features or (as is most often the case of problems with IE) implement them in a way that goes against the standard. Then you have to either start throwing in cross-browser hacks, browser specific stylesheets, or change your page design.
I will occassionally get in complaints at our webmaster account about how something doesn't render correctly in a certain browser. My reply usually includes some boilerplate about how our site is coded to support a standard, and not specific browsers. If the browser supports the standard correctly, you've got no problems. If the browser is like lynx and doesn't support CSS at all, again no problem and the pages are semantic XHTML so we make thorough use of heading tags and similar 'built-in' context indicators. If you use a browser that doesn't implement the standard correctly, on your head so be it!
Re:Welcome to my hell. (Score:4, Insightful)
Re:Too late. (Score:3, Insightful)
Except that it doesn't do things that tables do. For instance, I can't say that div#1 and div#2, which are next to each other, take up the entire width of the page even though div#1 has a fixed width. You know, like the most common basic page layout with a sidebar and a content area. With tables, I can just create a table with three trs, the header and footer are colspan=2, the width of the center-sidebar table is 200px or whatever, and the width of the content area is "*". Now, I realize that you can emulate it with negative margins, but that's not the same thing.
CSS is a great tool, it lets us do tons of things we could never have done before, but it's not a panacea and it is not without problems. In fact, it is chock full of problems, unless you and all your users are on Opera or something. Second choice, if you and all your users are on the same browser. Nonetheless you cannot simply write valid CSS and have it rendered properly in IE or a Gecko-based browser, once the CSS reaches a certain level of complexity that frankly I don't think is very high.
Re:Keep in mind... (Score:2, Insightful)
Hell can be bearable... (Score:4, Insightful)
Must be nice to not have to maintain public-facing pages for a large company
Yes, it is quite nice not have to maintain such a site, since most "public-facing pages for a large company" are notoriously and unnecessarily complicated and standards-broken. Furthermore, it is false to say that these sites are broken becasue they must cater to IE. It is in fact the other way around--IE is broken because of the incompetence or (false) laziness, impatience and hubris of the designers and maintainers of these big public sites. MS is to blame for applying sinister "embrace and extend" strategies to its product, however by far the primary responsibility for the current messy state of affairs lies squarely with the codemonkeys who vomit forth the tag soup that all too often continues to pass for web pages today.
Let me explain: when then-leading Netscape introduced nonstandard extensions to HTML, or incorrectly or poorly implemented the standard, rather than report it as a bug web authors actually EMBRACED these quirks rather than working around them or otherwise ignoring them. For example, early web developers heavily abused non-semantic and sometimes annoying proprietary tags like CENTER and BLINK, and went as far as to do atrocious things like nest their content in multiple BODY tags with different BGCOLOR attributes to do useless crap like fading and flashing the screen. The result of this was to not only let Netscape neglect bugs, put to put pressure on Netscape to RETAIN the bugs so as to remain "compatible" with such perverse tag soup!
The phenomenon proved to be viral--in the interests of matching leader Netscape's "feature" set, Microsoft went ahead and emulated all that malarky on purpose in IE! Furthermore, MS realised that nonstandard extensions were rather easily embraced by stupid lazy tag soup codemonkeys. This was a great opportunity to embrace and extend the WWW with such atrocities as ActiveX OBJECTs and heavy promotion of CSS-like styles long before the CSS standard was established. The latter action was particularly incideous because it allows MS to say that they "support standards" when in fact they sabotage them. Rather than warning web authors to use caution with stylesheets until the CSS style was standardised, they went ahead and made sure it was getting well established so that when changes were made to their proposal for CSS was modified by the W3C. By doing that they ensured that their own inconsistent application of CSS would be the de-facto standard and they could let slide any fixes to *actually* follow standards.
So please, make your best effort to break this evil cycle and do NOT design for IE. This doesn't mean that you should let your site break IE or make it look crappy--what it means is do NOT use IE during development without regard to standards then worry about degrading gracefully in other browsers. Instead use FF or another more compliant browser during development, and regularly validating your code using the W3C validation tools. THEN, when you test against IE (this is the real world, so you can't ignore it as the grandparent post implies) you make sure it degrades GRACEFULLY in IE, and do it WITHOUT relying on sneaky CSS bugs and breaking standards.
Yes, you CAN write totally valid XHTML and CSS that looks attractive and retains enough functionality in IE to satisfy your audience. Here are some approaches I have taken in the past:
* Avoid the use of CSS features that are standards but not widely implemented in IE or other mainline browsers, at least for important presentational aspects (anything more than eye candy).
* Do NOT strive to make the page appear or function fully and exactly the same in IE as other browsers--just make sure it doesn't look "broken" in IE. MS has deliberately "dumbed down" their pages for non-IS browsers in the past (even when other browsers were perfectly capable of handling the page as designed for IE). Given
Re:Keep in mind... (Score:4, Insightful)
It requires knowledge. Knowledge is not necessarily achieved by reading manuals cover-to-cover.
My knowledge is almost entirely obtained from experience, trial and error, and reading random web tutorials, articles and sources.