5 thoughts on “The Principles of Beautiful Web Design”

1. Review by Tommy Olsson for The Principles of Beautiful Web Design
   Rating:
   I’m not a graphic designer, I’m a techie. This book is a good introduction to graphic design for the web that even I can understand.

   Jason Beaird takes us through the design process in a number of steps: layout, colour, texture, typography and images. He shares his wealth of in-depth knowledge in a way that makes it accessible even to those of us who do not have a university degree in design. He doesn’t dumb it down, he just explains things very well using an easygoing literary style sprinkled with good-natured humour.

   By itself this book will not teach you good web design. It doesn’t go into any technical details and it (naturally) focuses on the visual part and aesthetics. Things like semantics and accessibility are subordinate and some of the practices he suggests are less than ideal from those points of view.

   There are even some fairly serious errors in the code samples, but those are most likely introduced by the editor rather than the author.

   If you know your way around (X)HTML and CSS, but struggle with making your sites more visually attractive, this book is a very good resource. It won’t automagically make you a top-notch designer, but it will teach you the foundations and – most importantly – explain WHY things are the way they are.

   If you are a web design beginner the book is a good resource for the graphic design part, but don’t pay too much attention to the technical parts.

2. Review by TheOriginalH for The Principles of Beautiful Web Design
   Rating:
   Having “stumbled” into web design almost ten years ago, with no real visual design background to speak of, I have over the course of time picked up principals. This was no easy task, and meant trawling countless websites and articles, being intimidated and awed by the breadth of knowledge and theory that is required to even suggest that you have an idea of what visual design is all about. Some of the articles I read required obscene amounts of concentration and application to the task at hand, as well as some difficult and surprising mental leaps.

   A couple of years ago, “The Zen of CSS design” went some way to solidifying some of the pricipals I had learned, and helped guide me in new directions, yet still at times was a little inaccessible and while it is a great reference for themed ideas and principles, this new book has frankly blown me away…and I really wish it had been written a long time ago!

   I possess several SitePoint books, but only two others have I read cover to cover in almost one sitting, and then revisited; Kevin Yanks’s PHP book and Stuart Langridges Java/ECMA script and DOM book. Not only was the content of these books superb, but the writing style was infectious and consequently the ideas were absorbed quickly. The same is most definitely true of this publication.

   Targetted largely at the coding/programming end of the market, it essentially provides the reader with a firm grounding in the ideas, theory and some history of visual design, breaking it down into sensible chunks and providing just the right level of information to leave you not only with a solid base, but thirsting for further knowledge.

   This publication could have saved me quite literally weeks and months of stumbling research had I discovered it years ago, and even now is a brilliant refresher for those of us unfortunate enough to have pursued a “proper” degree ;).

   For budding and established web designers, I cannot recommend this book highly enough.
   

3. Review by James Holmes for The Principles of Beautiful Web Design
   Rating:
   This is perhaps one of the best books I’ve read in a long time, mostly because it’s targeted specifically to folks like myself: those who are technically sound but graphically impaired. My solid skills behind a camera translate not at all to good site design and layout, so I was really excited to look through this book when I first heard about it.

   Beaird has written a very concise, gloriously illustrated work that does a tremendous job of covering everything from layout/composition to textures and color. Throughout the book Beaird uses real-world examples of sites that illustrate the particular point he’s working on. Sitepoint’s willingness to spring for full-color printing helps nail down Beaird’s content.

   The book clearly discusses layout fundamentals like balance, grid theory, and symetry/asymetry. The chapter on color hits color psychology (“Feeling a bit blue today?”), palatte selection, and the value of using color wheels to pick complementary and contrasting colors.

   The rest of the book is every bit as golden, hitting texture, typography, and imagery. There are a number of terrific resources for fonts, colors, and images with a mix between free and commercial resources.

   This isn’t a book to find out the details of how blocks flow and clear in CSS, nor is it a book to learn about the latest and greatest in AJAX/Javascript. What this book does cover, and covers well, are the higher-level, vital concepts you need to grok before you start wiring up AJAX controls and laying out elements.

   The Principles of Beautiful Web Design isn’t just for lame design folks like myself. I imagine even accomplished web designers could learn a thing or two from it. It’s that good.

4. Review by Marten K for The Principles of Beautiful Web Design
   Rating:
   A more appropriate title for this book is `things to think about when making a website and how me and my friends do it – for dummies’. The book does a fine job for such a title.

   This book does NOT articulate a set of principles and explain their application; there is little to generalize to other problem solving contexts (or my context at least).

   I am new to web development and for other self directed learning (Java, XHTML, AJAX and OO) I have started with a funky Head First book followed by more formal academic books (Booch, Bloch, Dietal, Larman, Jeremy Keith).

   This book is neither funky or formal. Where the Head First series successfully uses cultural references and idioms to engage the reader in learning complex concepts and principles, this book uses similar devices with no obvious intent other than being familiar. Where the formal books locate material by referencing a broader academic context, this author references the somewhat creative work of his own and that of his friends. There is no bibliography and this is not a primer to the broader discipline.

   The author admits difficulty in `verbalizing the procedures’ because much of his design is `subconscious’ (p24), he follows with four pages of stream of consciousness explanation on the realization of a design that includes over sixty `I’ references – and scant reference to design principles. There is NO discussion of the design principles underpinning well-known successful sites, nor how principles unfold in various contexts such as corporate sites, e-commerce sites, blog sites, sales sites, Gothic music and games sites, and so forth.

   For example, fixed versus liquid layouts is addressed with pros and cons listed. The author concludes that ‘the decision [is]…determined by the target audience and accessibility goals of each individual web site’ (p29). However, principles for determining audience needs and their accessibility goals for different contexts is NOT really covered.

   There seems disdain for academic rigor and technical knowledge: `the rule of thirds or…rule of turds’ (p10). `besides, my maths is a little rusty’ (p9) `Describing …emotional connections … with colors can be a hippy-esque topic’ (p39). There is no sense that the author is in command of the discipline, instead he appears embarrassed by its technical aspects.

   Color blindness and accessibility are NOT covered. `Principle/s’ is NOT listed in the index.

   I give two stars as it may be useful for some, as demonstrated by other reviews; and the book is well presented. However, I will fulfill my needs by looking for more substantial and perhaps non web directed books on color and graphic design.

   [addendum 24 Nov 07 – See my review on “The Complete Color Harmony” by Sutton and Whelan The Complete Color Harmony: Expert Color Information for Professional Color Results (Color Harmony)for a book I used for principles of color]

5. Review by Nate Klaiber for The Principles of Beautiful Web Design
   Rating:
   The Principles of Beautiful Web Design by Jason Beaird is a concise book about basic design principles. To some, design is something that is tough to grasp and is a mystery to understand. To others it simply comes naturally. If you find yourself struggling with design and need some direction, then this book is for you. Throughout each of the chapters Jason breaks down the specifics of layout and composition, color, texture, typography, and imagery.

   Jason states his intended audience as someone who might be:

   …squeamish about choosing colors, feel uninspired by a blank browser window, or get lost trying to choose the right font.

   It is important to note that this book is not a book about code, but is about principles, inspiration, and education. With that brief disclaimer out of the way, here is a breakdown of the content found in the book.

   The journey starts with chapter 1 and layout and composition. Before any keys are pressed on a keyboard, there is much work and research to be done. Jason talks about his design process and starting things off right with your clients. He gives a brief definition of what makes up good design. I am sure this could be many different things to different people, but he stresses the key points in relation to user interaction on the web. How easy is it for people to find what they are looking for? Does the design help them achieve their goals, or is the design visual eye-candy that inhibits them completing a specific task? Is the navigation and information easy to understand? Can the user navigate without feeling lost? The design process takes time.

   Next he looks to the anatomy of a web page. Many pages have a consistency to them. There is a navigation, sub navigation. A masthead with branding information. There might be a search field to help locate different pages. There are an array of columns used for placement. There is a footer that usually has more details or contact information. These are just a few, and they don’t all have to look the same.

   The next few pieces discuss grid theory, balance, unity, and emphasis. Each of these play an important role on how your information is presented. Aligning your items to a grid. Aligning your type to a vertical rhythm. Having balance between your sections. Having unity in your sub-pages as the navigation gets deeper. Placing emphasis on any given section. Each of these are discussed in detail and are accompanied by examples found on the web.

   This chapter rounds off by Jason showing some bread and butter layouts, finding inspiration on and off the web, giving introduction to some new and fresh trends (you know, the Web 2.0 stuff), and then begins the application that we will watch unfold throughout the rest of the book, a website for Florida Country Tile.

   With a firm foundation of layout and composition beneath us, it is time to address the aspect of color. We have all seen beautiful color combinations, and most likely our fair share of not-so-friendly-to-the-eyes color combinations. How do you go about selecting a color scheme for your website? Jason starts this chapter off by discussing the psychology of color. Color theory simply addresses how people react and relate to different colors. There are many variables involved, and some of them are even geographical in nature. What types of colors should you choose for your target audience? Looking to develop a site for a restaurant? Find out how different colors convey different emotions in your users. Color theory gives great insight into how people perceive colors found on your website.

   The next few sections discuss things such as the temperature of your colors, the value of your colors, and then into a little bit of color theory. Each of these pieces are given adequate attention with even more examples shown. Things start to get fun as he moves into color theory. Here is where we see some methods used to creating elegant color schemes. No longer do you have to randomly select colors, now you can give your entire website some of that balance that we discussed above. Selecting a color scheme can be very difficult, but as Jason shows there are many options to selecting a color scheme that will fit the needs of your site. As he shows the process for creating a color palette, he moves on to the process of selecting a color palette for the application section. The Florida Country Tile website is starting to get filled out with an elegant color scheme.

   The application is starting to come to life. We have a layout, we have a color scheme, and now it is time to see how we can make some subtle improvements through the use of texture. This chapter defines such things as points, line, shape, volume and depth, and pattern. Each of these come with illustrations to further elaborate on the topics. After looking through each of these things, Jason moves to the practical side and building your own textures for your website. This includes subtle background textures, textures for use as borders, and textures are backgrounds for different elements on a page. He gives the application a subtle enhancement by adding a textured background. Things are starting to evolve even more, and the site is starting to take form and life. Background images, drop-shadows, and section separators are just a few ways textures can be used to enhance a layout.

   One of the often overlooked aspect of a website is that of typography. This is mainly due in part to the small selection of fonts available to web designers. Jason covers some ways to get around this shortcoming by use of sIFR and other image replacement techniques. Image replacement has been discussed in depth in many different avenues, and Jason doesn’t spend much time discussing these. This is an out of classroom assighment for you as the reader.

   Now it’s time to dive in a little deeper. The next few sections are a brief history lesson. He discusses things like letterform, text spacing, letter spacing, text alignment, adjusting line height for an optimal reading experience, and some of distinctions of typefaces. Here you will see a breakdown of serif versus sans-serif, and some of the different variations of each.

   With the history behind us, we move forward to what it takes to choose the right font for your project. This is always dependent on the client and the branding that needs to take place. Choosing a typeface is sometimes a difficult process, especially with the large amounts of fonts and variants available to you as a designer. Jason moves on to apply some of these principles to the application that we have been working on. He chooses the fonts he will use throughout the website, both in images and in the body of the pages. He proceeds to add some text on top of the imagery, as well as give some breathing room and separation to the content on the homepage.

   Our journey to design bliss is coming to a close. The last chapter discusses adding imagery to give your site a bit of visual flair. Again, Jason begins with a few sections covering some history, what to look for, and where to look for it. This includes the legal implications of the different kinds of images that you may come across. Once we safely secure the images we want to use for the website, and are sure we have full permission to do so, we then move to cropping, adjustments with photoshop, and the different formats and resolutions available to use. Here we see a brief discussion of applying CSS to achieve some re-usable border treatments to our images. Finally, all of this knowledge is used to extend upon the application and give it its final touches.

   verall, this book is an excellent resource for those seeking design instruction and inspiration.
   
   Overall, this book is an excellent resource for those seeking design instruction and inspiration. The book is filled with screenshots of different sites and sources for inspiration as the author encourages us to look around for inspiration in our own designs. Seeking inspiration doesn’t always mean emulation. Find a way to make things your own for you and your client. As a reminder, this book might seem elementary for those who have a background and education in design. This book is for those looking to take small steps to improve their websites.

   I did have one qualm with this book. This book is primarily constructed of principles, history, and philosophy of design. This means discussion of code and application specific techniques are kept to a minimal. However, given the target audience, it seems as though Jason makes many assumptions about the understanding of Photoshop and the techniques described therein. I know that it would take extra time to explain this process, and he even gives a disclaimer that it is hard for him to explain his entire process. Maybe it would have been nice to have an appendix with some more details to the Photoshop techniques he discusses throughout the book.

Comments are closed.