What do you think?
Rate this book
Transcending CSS: The Fine Art of Web Design
As the Web evolves to incorporate new standards and the latest browsers offer new possibilities for creative design, the art of creating Web sites is also changing. Few Web designers are experiences programmers, and as a result, working with semantic markup and CSS can create roadblocks to achieving truly beautiful designs using all the resources available. Add to this the pressures of presenting exceptional design to clients and employers, without compromising efficient workflow, and the challenge deepens for those working in a fast-paced environment. As someone who understands these complexities firsthand, author and designer Andy Clarke offers visual designers a progressive approach to creating artistic, usable, and accessible sites using transcendent CSS. In this groundbreaking book, you’ll discover how to implement highly original designs through visual demonstrations of the creative possibilities using markup and CSS. You’ll learn to use a new design workflow, build prototypes that work well for designers and all team members, use grids effectively, visualize markup, and discover every phase of the transcendent design process, from working with the latest browsers to incorporating CSS3 to collaborating with team members effectively. Transcending The Fine Art of Web Design : Uses a visual approach to help you learn coding techniques Includes numerous examples of world-class Web sites, photography, and other inspirations that give designers ideas for visualizing their code Offers early previews of technical advances in new Web browsers and of the emerging CSS3 specification
371 pages, Paperback
First published November 15, 2006
10 people are currently reading
277 people want to read
About the author
Andy Clarke
8 books5 followersLibrarian Note: There is more than one author by this name in the Goodreads database. For more information please see Andy Clarke.
Andrew Clarke is an art director and web designer at the UK website design studio ‘Stuff and Nonsense.’ There he designs websites and applications for clients from around the world. Based in North Wales, Andrew‘s also the author of two web design books, ‘Transcending CSS’ and ‘Hardboiled Web Design’ and is well known for his many conference presentations and over ten years of contributions to the web design industry. Jeffrey Zeldman once called him a “triple talented bastard.’ If you know of Jeffrey, you’ll know how happy that made him.
Andrew Clarke is an art director and web designer at the UK website design studio ‘Stuff and Nonsense.’ There he designs websites and applications for clients from around the world. Based in North Wales, Andrew‘s also the author of two web design books, ‘Transcending CSS’ and ‘Hardboiled Web Design’ and is well known for his many conference presentations and over ten years of contributions to the web design industry. Jeffrey Zeldman once called him a “triple talented bastard.’ If you know of Jeffrey, you’ll know how happy that made him.
Ratings & Reviews
Friends & Following
Create a free account to discover what your friends think of this book!
Community Reviews
Displaying 1 - 24 of 24 reviews
August 24, 2008
I enjoy reading Andy Clarke's blog, and really identify with people like Andy who are trying to bridge the gap between visual, graphically oriented designers and people who are technical, code-based, linear thinkers in the Web development field. I even hate using that distinction, because I never fit it in any either/or fashion.
I picked up this book in part because it really is a beautiful book: rich, elegant, luxurious. Reading through it, though, I'm finding that, as someone who has done page layout in the past, I would have really liked to have been there during the design meeting and shot down a really bad idea.
How to explain? The book reads like a typical book, nothing new here. But there are places in the book where Clarke takes a detour, a related detour, but nonetheless he's breaking out of the flow for what we'd call a "sidebar". Problem is, once you realize that's what's happened, you've turned the page to read the rest of the paragraph, only to find you're in a sidebar that wasn't as clearly signaled as it could be.
Normally, a sidebar is placed near the main text to which it is connected. Often, it's on a right-facing page, and it's often set off by a different color background or perhaps a "did you know?" box with borders. Often, there's a preface or introduction to a book that will help you understand how to actually read the book, with a little map or key to what the symbols and boxes means.
In Transcending CSS, the detour is on the right page alright, but the left facing page is not text, but images. I found this more than a little confusing. Sometimes there's a page and half between a signal to go read a sidebar and the actual sidebar.
OK. It's a pet peeve and may just be peculiar to me.
Also, in case my husband's boss, Zach, is reading: Yes, I did run out to the garage where R was puttering and said, "See. Zach is god. Zach is having you do microformats." I was compelled to do this because of a conversation at our monthly WSUUG meeting where my husband, forever the contrarian, felt he had to argue against microformats. Why? Because. In Transcending CSS, Clarke lists the principles of Transcendent CSS and one is using semantic naming conventions and microformats. He doesn't just point to semantic naming conventions, but specifically calls out microformats.
At any rate, as folks who read me know, I love to run off and write about what I'm reading, as I'm reading, rather than wait to do a big bang review. I'm heading back out to my porch for more reading.
---
So, on to a more useful review. Aside from the design glitch I noted above, the book is very useful to anyone who comes at CSS and standards-based design from a designers perspective. If you have a lot of standards-based design work under your belt, have been doing this for a few years, etc. -- the book is a little bit too simple. But if you're fairly new -- i.e., you aren't really sure you understand what semantic naming conventions are or think that the whole discussion about how to mark up the page is a lot of folderol -- then you should read this book.
Clarke's main focus seems to be on semantics, which is fine, because he's right that too much web development ignores semantics -- and I certainly have been guilty of this. No, I don't use the paragaph tag to obtain the white space I want these days, but I'm still getting the hang of it and sometimes feel I'm using more divs than I need to use.
So, what am I talking about -- especially if you're a n00b and it feels like I'm talking in some s00per sekrit language? Consider the imaginary Cookr site Clarke uses to walk readers through semantic-based development principles and processes. The page is a recipe page, with the recipe on the left. On the right is a box containing suggestions for related recipes. For each suggestions, there's a photo of the dish, the name of the dish (linked to the recipe), and a teaser paragraph to entice the user to click and learn more.
I would never have looked at the block of related items -- photo, title, description -- and seen it as a list item in an unordered list -- until I read this book. I would have looked at it in terms of a design problem and thought about it in terms of how to mark up the page to get the visual effects I wanted.
Hence, I would have seen two columns, one containing photo of the dish, and the other containing text-based information -- which would have comprised a table row in the old table-based design days. But, as Clarke points out, it's actually a list item in an unordered list .
By the way, he also points out that these are not "strictly definition terms and descriptions, so using a definition list would be stretching the semantic use of the element." [p 146 -- I had to quote that to throw a certain contrarian's way. :)]
And because I saw that content visually and thought of it terms of how I'd style it to get the visual effect I wanted, I was overlooking what would be more meaningful -- particularly to search engines or applications that might make use of semantic markup to parse the contents of a page like this.
The unordered list of related recipes, then, constitutes what are called XHTML coumpounds:
"combinations of two or more elements in XHTML that each have their own meaning. When combined, the elements create a more precise meaning together than they do separately. The concept of XHTML cmpounds emerged from the microformats community rather than the W3C." [p 147]
OK. So now that I've read this book, I will pay closer attention to the ways I can use meaningful markup -- much more than I have been. Work to be done. But now I want to go re-write all the Web sites I've developed. Ah well.
More anon....
I picked up this book in part because it really is a beautiful book: rich, elegant, luxurious. Reading through it, though, I'm finding that, as someone who has done page layout in the past, I would have really liked to have been there during the design meeting and shot down a really bad idea.
How to explain? The book reads like a typical book, nothing new here. But there are places in the book where Clarke takes a detour, a related detour, but nonetheless he's breaking out of the flow for what we'd call a "sidebar". Problem is, once you realize that's what's happened, you've turned the page to read the rest of the paragraph, only to find you're in a sidebar that wasn't as clearly signaled as it could be.
Normally, a sidebar is placed near the main text to which it is connected. Often, it's on a right-facing page, and it's often set off by a different color background or perhaps a "did you know?" box with borders. Often, there's a preface or introduction to a book that will help you understand how to actually read the book, with a little map or key to what the symbols and boxes means.
In Transcending CSS, the detour is on the right page alright, but the left facing page is not text, but images. I found this more than a little confusing. Sometimes there's a page and half between a signal to go read a sidebar and the actual sidebar.
OK. It's a pet peeve and may just be peculiar to me.
Also, in case my husband's boss, Zach, is reading: Yes, I did run out to the garage where R was puttering and said, "See. Zach is god. Zach is having you do microformats." I was compelled to do this because of a conversation at our monthly WSUUG meeting where my husband, forever the contrarian, felt he had to argue against microformats. Why? Because. In Transcending CSS, Clarke lists the principles of Transcendent CSS and one is using semantic naming conventions and microformats. He doesn't just point to semantic naming conventions, but specifically calls out microformats.
At any rate, as folks who read me know, I love to run off and write about what I'm reading, as I'm reading, rather than wait to do a big bang review. I'm heading back out to my porch for more reading.
---
So, on to a more useful review. Aside from the design glitch I noted above, the book is very useful to anyone who comes at CSS and standards-based design from a designers perspective. If you have a lot of standards-based design work under your belt, have been doing this for a few years, etc. -- the book is a little bit too simple. But if you're fairly new -- i.e., you aren't really sure you understand what semantic naming conventions are or think that the whole discussion about how to mark up the page is a lot of folderol -- then you should read this book.
Clarke's main focus seems to be on semantics, which is fine, because he's right that too much web development ignores semantics -- and I certainly have been guilty of this. No, I don't use the paragaph tag to obtain the white space I want these days, but I'm still getting the hang of it and sometimes feel I'm using more divs than I need to use.
So, what am I talking about -- especially if you're a n00b and it feels like I'm talking in some s00per sekrit language? Consider the imaginary Cookr site Clarke uses to walk readers through semantic-based development principles and processes. The page is a recipe page, with the recipe on the left. On the right is a box containing suggestions for related recipes. For each suggestions, there's a photo of the dish, the name of the dish (linked to the recipe), and a teaser paragraph to entice the user to click and learn more.
I would never have looked at the block of related items -- photo, title, description -- and seen it as a list item in an unordered list -- until I read this book. I would have looked at it in terms of a design problem and thought about it in terms of how to mark up the page to get the visual effects I wanted.
Hence, I would have seen two columns, one containing photo of the dish, and the other containing text-based information -- which would have comprised a table row in the old table-based design days. But, as Clarke points out, it's actually a list item in an unordered list .
By the way, he also points out that these are not "strictly definition terms and descriptions, so using a definition list would be stretching the semantic use of the element." [p 146 -- I had to quote that to throw a certain contrarian's way. :)]
And because I saw that content visually and thought of it terms of how I'd style it to get the visual effect I wanted, I was overlooking what would be more meaningful -- particularly to search engines or applications that might make use of semantic markup to parse the contents of a page like this.
The unordered list of related recipes, then, constitutes what are called XHTML coumpounds:
"combinations of two or more elements in XHTML that each have their own meaning. When combined, the elements create a more precise meaning together than they do separately. The concept of XHTML cmpounds emerged from the microformats community rather than the W3C." [p 147]
OK. So now that I've read this book, I will pay closer attention to the ways I can use meaningful markup -- much more than I have been. Work to be done. But now I want to go re-write all the Web sites I've developed. Ah well.
More anon....
Read
July 3, 2023
January 7, 2021
Much more than a book on CSS
April 24, 2024
Intriguing book; I discovered a lot of fascinating points in it. It was easy to follow. I consulted it when I created the website https://casino-game-online.ru
September 17, 2014
If you've ever considered web design as art, /Transcending CSS/ may be the book for you. I found the fine art aspects a little heavy-handed, and the section on finding inspiration may, for the average engineer, invoke a bit of eye-rolling at times. (Not that it's not a valid point, but spending 85 pages on it is a bit much.) But, once you get around some of the drawbacks, there is some very useful information in this book.
The main focus of the book is to encourage the separation of presentation and content. While this mantra is often repeated as the justification for CSS, Clarke points out that it is rarely, if ever, adequately followed. In that vein, Clarke takes the reader through the design of a few static web pages; boiling the content down to their cores of lists, paragraphs, and headings; and then working out in style sheets how to make the content look like the designer wants. There are some interesting uses of CSS used to pull these off that make this section of the book a bit of a page turner. (At least for the web usability geeks out there.)
The first part of the book reveals /why/ it is so important to separate the presentation layer from the content. Clarke contends that the Internet isn't just for computers anymore, and it will be far easier to write a new style sheet for Internet-enabled phones and PDAs than to force those users to view the "standard" version of the page (and potentially lose those users when the site is completely unusable), or to write a completely new page just for those users (increasing the costs in both implementing and maintaining the site).
All in all, I found /Transcening CSS/ to be a bit of a chore to get all the way through, but there is enough here to make it a worthwhile read, if you don't mind just skimming some of the more less technical parts.
The main focus of the book is to encourage the separation of presentation and content. While this mantra is often repeated as the justification for CSS, Clarke points out that it is rarely, if ever, adequately followed. In that vein, Clarke takes the reader through the design of a few static web pages; boiling the content down to their cores of lists, paragraphs, and headings; and then working out in style sheets how to make the content look like the designer wants. There are some interesting uses of CSS used to pull these off that make this section of the book a bit of a page turner. (At least for the web usability geeks out there.)
The first part of the book reveals /why/ it is so important to separate the presentation layer from the content. Clarke contends that the Internet isn't just for computers anymore, and it will be far easier to write a new style sheet for Internet-enabled phones and PDAs than to force those users to view the "standard" version of the page (and potentially lose those users when the site is completely unusable), or to write a completely new page just for those users (increasing the costs in both implementing and maintaining the site).
All in all, I found /Transcening CSS/ to be a bit of a chore to get all the way through, but there is enough here to make it a worthwhile read, if you don't mind just skimming some of the more less technical parts.
August 30, 2007
There's code here and there on my personal website that goes back to 1994 or so, when I built my first webpage by hand and hosted it on my personal account on schenectady.ecn.purdue.edu (try typing that five times fast). And HTML 1.1 served me just fine for the next 10 years. Right around the time that I would have probably needed to really dive in and modernize things around here, I moved much of the site over to MovableType, which took care of enough that I could put it off for a little bit longer. But there are things I want to do with my site that are going to require that I get up to, say, 2003 web design standards. So I'm slowly getting up to speed on the current state of web design.
This book is not a beginner's how-to level book to CSS, and so I didn't understand half of how I would actually implement the examples given. But I really glad I read it first, because it gave me a lot of great ideas about how to approach the workflow of redesigning my site(s), rather than just diving in and replicating my old tables structure with a bunch of divs and calling it a day.
This book is not a beginner's how-to level book to CSS, and so I didn't understand half of how I would actually implement the examples given. But I really glad I read it first, because it gave me a lot of great ideas about how to approach the workflow of redesigning my site(s), rather than just diving in and replicating my old tables structure with a bunch of divs and calling it a day.
June 13, 2011
Quando si legge un libro tecnico, diverse domande saltano in mente: è per principianti o per esperti? Dovrei leggerlo prima o dopo altri libri? Sarà tecnico o solo nozionistico? Lo leggo velocemente o mi metto al PC a testare gli esempi? Nel caso di questo libro, ne spunta almeno un'altra: è per grafici o per HTMListi? Beh, in questo caso, la risposta è sempre "entrambi". Andrebbe letto prima di affrontare lo studio della grafica web e dei css, rapidamente, ma anche riletto dopo, e gli esempi testati e modificati su computer. Pur non essendo molto corposo riesce a coprire molti "punti caldi" dell'uso dei CSS per la grafica web, e contemporaneamente a dare spunti creativi. Lo si può leggere per la parte tecnica, ma anche sfogliare per "guardare le figure" e magari trovare l'ispirazione. E, come ritengo giusto, riunisce le figure del grafico web e dell'HTMLista.
February 27, 2008
An excellent read for anyone wanting to take their standards-based web design to the next level. I love focusing on a content-out approach to design. Not only a CSS discussion, this book provides excellent information on grid based design and looking outside the web for inspiration.
My only complaint has to do with the argument that we really need to design for cutting edge browsers and not worry about how the design translates to older browsers that are still widely used. I still believe we need to provide designs that work on popular browsers. I'm not against providing a few extras for browsers that support CSS properly, but don't punish people who have not yet upgraded to Firefox.
My only complaint has to do with the argument that we really need to design for cutting edge browsers and not worry about how the design translates to older browsers that are still widely used. I still believe we need to provide designs that work on popular browsers. I'm not against providing a few extras for browsers that support CSS properly, but don't punish people who have not yet upgraded to Firefox.
September 3, 2007
I started getting a few CSS projects at work this spring, and I was like, "uhhh." Cascading style sheets for the web had always sounded really boring.. or at least, more of an organizational tool than a design one. So I went to Barnes & Noble one day at lunch to find a good reference book and came across Transcending CSS. I've read other reviews of this book that describe it as career-changing, and that really was true in my case. I've spent the past four months reading anything and everything I can about CSS because the doors that Andy Clarke opens in Transcending CSS are just too cool to close.
August 31, 2016
I was disappointed with this book.
There was far too much name dropping. Mr Clarke only seemed to draw real-world examples from within a narrow spectrum of the web design community, which felt to me like navel gazing.
Although the book is prettier than your average web design book, too many pages were devoted to photo montages that seem like filler.
I gleaned a few tips from the book, particularly regarding semantic CSS class and id names, but not enough to justify the cover price.
I know many web designers view this book as some sort of bible, but for me it fell far short of expectations.
There was far too much name dropping. Mr Clarke only seemed to draw real-world examples from within a narrow spectrum of the web design community, which felt to me like navel gazing.
Although the book is prettier than your average web design book, too many pages were devoted to photo montages that seem like filler.
I gleaned a few tips from the book, particularly regarding semantic CSS class and id names, but not enough to justify the cover price.
I know many web designers view this book as some sort of bible, but for me it fell far short of expectations.
November 15, 2013
Excellent guide on some simple but effective methods of designing sites that takes into account other, oft neglected details. This doesn't exactly teach you a ton concerning actual css itself rather its more of a compendium of best practices, approaches, resources, and ways to smartly craft a proper site design.
One thing I wasn't terribly keen on is that some of the content makes web design and css far too out there than it actually is, as if CSS and web design is some sort of aspect regulated in zen. It's not, its far from it. I know, because I happen to be an actual martial artiste and there's nothing 'spiritual' about web development (sorry to anybody who disagrees).
One thing I wasn't terribly keen on is that some of the content makes web design and css far too out there than it actually is, as if CSS and web design is some sort of aspect regulated in zen. It's not, its far from it. I know, because I happen to be an actual martial artiste and there's nothing 'spiritual' about web development (sorry to anybody who disagrees).
December 9, 2008
An enthusiastic online discussion with fellow web designers was prompted by the question 'What is mastery of CSS'. This book was recommended and I finally found it in the computer programming section of Barnes & Noble. It's going to take me a while to get through - not because it's tough sledding, but because in nearly every paragraph there's a gem and I have to go back, re-read, try out the code, or simply sit and muse a while. It's beautifully designed and choc full of tons of stuff I didn't know I didn't know ... and I'm only on page 23. It's going to be a labour of love.
November 10, 2009
Probably the most famous web design book written to date is Bulletproof Web Design. I would say that for techniques and web design theory this book will be quoted and hoarded by web designers. The book itself has already gained world wide recognition by being translated into five different languages (possibly making it one of the top, if not the most read web design book to date). The author is a member of the W3C and currently developing CSS3.
If you are a web designer, not reading this book is not an option.
If you are a web designer, not reading this book is not an option.
July 7, 2007
This took me further down the street where The Zen of CSS Design left me. It's career-altering and interesting to me; probably not for you.
Read
February 15, 2008If you are a web designer, this book will increase your understanding of semantic designing. By using mainly div block statements in your html code, you are limiting yourself to other html that are often better choices.
November 21, 2011
Un libro que sin duda alguna, me ayudó a activar un interruptor interno con respecto a cómo visualizar el CSS. Lo recomiendo ampliamente para todo aquel que quiera adentrarse a las aguas del desarrollo estándar de HTML/CSS.
March 28, 2009
This was a waste of 50 Dollars. If you are looking for something the actually Transcends CSS or even begins to explore scripting languages beyond oh lets say... a monkey's bald ass then don't bother.
April 14, 2010
Great CSS theory, but only for CSS experts.
Currently reading
June 15, 2010Has great CSS stuff
Read
April 17, 2011Useful
This entire review has been hidden because of spoilers.
July 12, 2011
Great book!
June 21, 2011
Great book for web designers. I was the artist whose work is featured on the cover of the book. See more at http://ronhuxleyartist.blogspot.com
December 15, 2011
Non solo CSS, come il titolo potrebbe far pensare, ma un vero e proprio manuale di progettazione per il web, ricco di fonti e spunti di ispirazione.
February 2, 2017
My paperback
Displaying 1 - 24 of 24 reviews