⌊ K™¦krizzna.web.id ⌉

By 

Nate Klaiber (nkbookreviews.com) –

  

The new release from Dan Cederholm is a great complement to his previous work in Bulletproof Web Design. For those who haven’t read Bulletproof Web Design, it’s premise was creating flexible websites and keeping a clear separation of your markup (HTML), styles (CSS), and behavior (JavaScript). It took examples of sites that weren’t bulletproof, and showed the process to make them bulletproof. All great things. The landscape of browsers, CSS, and HTML has changed slightly since Dan wrote Bulletproof Web Design, and this book is focused on bringing those aspects to the forefront. This book assumes you have knowledge of developing with web standards, and therefore bypasses the why of adhering to web standards.

The entire book focuses on building a fictional site, the Tugboat Coffee Company. Each chapter builds a new layer into this site, with clear instruction of how each aspect progressively enhances the user experience, while not explicitly leaving other browsers in the dust. Here is a quick breakdown:

Introduction
This chapter is a quick example of why we need to be flexible with our designs and development. Using a list of menu items, Dan walks through how to best organize your markup and CSS. To me, this chapter was about first putting on your thinking cap and planning for how your sections should be organized within a site. Think about how the end user will experience and interact with your site. Even with a simple menu list, he shows how things change when text is re-sized, or simply making your clickable link area larger in a given area. While this chapter had a specific example, and code to work through–I really saw it as something to begin challenging you to think about your architecture.

Round and round we go
Most of us are familiar with the previous way of creating rounded corners, and each of those ways had their drawbacks. Using 4 images, then you had superfluous markup. Use 2 images, then it didn’t scale well in both directions. This left us to educate ourselves and then choose the best decision based on our context. With CSS3 this process is made much easier. Using border-radius and it’s browser specific counterparts, we can begin to work with rounded corners now–and have it work in standards aware browsers. This chapter not only discussed the organization for this in your CSS, but also some of the finer points of using rounded corners in the first place. Background clipping with images inside of a container and applying this to form elements were two specific examples.

Now, don’t start throwing vegetables at me just yet. This is the beauty of this book. This is the premise of this book. The ability to use features in CSS3, while still providing an experience for all of your users. Those with advanced browsers will see everything in it’s shining beauty. Those without may be missing a few things here and there. It’s not all a loss–they can still access the content. In this example, your rounded corners simply may not be rounded. You have many options available to you if you wanted to do some extra work to make rounded corners in all browsers. It’s all about your context and your goals. Again, going back to the first chapter–put on your thinking cap and weigh the goals and costs.

RGB eh?
Specifying colors has always been easy. You have several ways with css, including color, hex codes, and RGB. Now, we also have the ability to specify a fourth parameter to control the alpha transparency. Yes, you could achieve some of these same effects with PNG’s, but that’s the point–now you don’t have to. This isn’t just in reference to a text color or background color. This can also be applied to your borders and pseudo elements for some nice effects all around.

This chapter again builds on the example site, and shows the process for implementing this into your site right now.

But it doesn’t look the same!
I have often heard this cry from many different web developers. Dan points to his wonderful site, Do Websites Need To Look The Same In Every Browser? While this may seem somewhat sarcastic (what an incredible domain name), he created this to prove his point. Even this site alone doesn’t look the same in every browser–and that’s OK. This chapter goes into a little more detail into the questions posed in the first chapter. We need to think about the end user experience, and let that be the driving factors into our design decisions. While these tools are great, and it’s great to start experimenting with them now–they might not be right for all scenarios and contexts. To me, this chapter was a challenge. It was a challenge to be more forward thinking with the front-end architecture decisions. Thinking about the different aspects that users, analytics, and browser market share bring to this decision making.

Some techniques discussed in this chapter were text-shadow, box-shadow,…

Read more

Help other customers find the most helpful reviews 

Was this review helpful to you? 

|

 Comment