Name: Handcrafted CSS
ISBN: 9780321643384

Handcrafted CSS

Seemingly non-obvious details can often separate good web design from great web design. You might not appreciate the quality of a well-designed website until you start using it, looking under the hood, putting it through tests, etc. Handcrafted CSS: More Bulletproof Web Design is an attempt to share some of these details that matter most. By encouraging “progressive enrichment” to utilize advanced CSS and CSS3 properties that work in browsers today, to reevaluating past methods and best practices. This book will show how craftsmanship can be applied to flexible, bulletproof, highly efficient and adaptable interfaces that make up a solid user experience.

What Hacker News says

LarryMade2Nov 2021

Problem is there are many ways to do something in CSS and a lot of CSS is kinda ugly.

My approach was reading some good CSS books (Handcrafted CSS is a good one, Stylin' with CSS is another) and articles, also find sites with the look you like.

With an understanding how good CSS works, you can better use a browser's CSS inspector to identify the key elements that make the layouts work in your favorite sites, create test pages and build your own stylesheet.

Alternatively shop for with a pre-made CSS library (there's tons of em out there), I'd look for lightweight ones where figuring out how it works is more of a possibility.

thread

LarryMade2Apr 2019

Don't do all that crap.

For me I try out sites, discover things I like and then search for it along with the term -jquery or "vanilla javascript" and work out just the code I need.

For reading:

For HTML find a good book on the basics (I had used Visual Quickstart Guide to HTML, but I bet there might be better ones now), for CSS I recommend "Stylin' with CSS" which will keep things simple. Maybe "Handcrafted CSS" to learn how to refine styles even more.

Another great common sense design book is "Don't Make Me Think" will go a long way into determining what would be best in design and UX.

You will find when you drill down to that - you don't need all that much much JavaScript at all. A lot of those templates and frameworks are only great when you don't know what you want but will quickly/easily get the pretty pictures and slick animations, later there's a price to pay to maintain or refactor.

thread

LarryAJul 2011

The ones I've found that are good starting points:

Stylin' with CSS by Charles Wyke-Smith - its mainly a (good) CSS book but gives enough hints at good design so you don't go overboard.

Handcrafted CSS by Dan Cederholm with Ethan Marcotte - again CSS tutorial with emphasis on good design with CSS.

Once you get the handle on those (or before hand) check out the great examples in CSS Zen Garden. ( http://www.csszengarden.com/ ) Something you can pick apart and analyze. The cool thing about ZenGarden is the HTML is always the exact same file it's the CSS and graphics that make the designs different.

Beware web design books that concentrate purely on web design - some of them are trying to be too artsy and cutting edge, look inside the book before buying... also some may be specific for templates in WordPress, Joomla or some other CMS.

thread

malandrewOct 2010

Eric Meyer is the go to guy for CSS.

Also check out "Handcrafted CSS" by Dan Cederholm. The only part of that book that is no longer a best practice is his .after float hack, which today has been replaced by the overflow:auto hack.

thread

rimantasOct 2010

You cannot go wrong with these which will teach you how to do things "the right way“, not some outdated stuff:

CSS Mastery: http://www.cssmastery.com/

Bulletproof Web Design http://astore.amazon.com/simplebits-20/detail/0321509021

Web Standards Solutions: The Markup and Style Handbook http://astore.amazon.com/simplebits-20/detail/1430219203

Handcrafted CSS http://handcraftedcss.com/

It would be worth to check out some about HTML5:

Brief but good introduction: http://books.alistapart.com/products/html5-for-web-designers

Also: http://introducinghtml5.com/ and http://diveintohtml5.org/

thread

csmederJul 2010

I'm not sure I know exactly what you mean by web design. So lets start there.

a. The look: the graphic design of the page.

b. The interaction: Usability and UX

c. Designing and coding with good software design principles.

d. Some thing else?

I can point you to some good books for b. or c., however a. is the holy grail. I have never found a good book on web design from a graphic design perspective. That said Ill share with you what I would consider the closest I have found.

----------------------------------------------------------

a. (Web site Graphic Design)

* The non Designer's design book - http://www.amazon.com/Non-Designers-Design-Book-Robin-Willia...

* Visual Language for Designers - http://www.amazon.com/Visual-Language-Designers-Principles-U...

* Tuft's Envisioning Information - http://www.amazon.com/Envisioning-Information-Edward-R-Tufte...

* I have found some good online articles http://delicious.com/csmeder/ux

----------------------------------------------------------

b. (Usability and UX)

* Web Form Design: Filling in the Blanks - http://www.lukew.com/resources/web_form_design.asp

* The Design of Sites: Patterns for Creating Winning Web Sites - http://www.amazon.com/Design-Sites-Patterns-Creating-Winning...

* And again Tuft's Envisioning Information - http://www.amazon.com/Envisioning-Information-Edward-R-Tufte...

* Information Design Workbook http://www.amazon.com/Information-Design-Workbook-approaches...