How many times have you attended, or given, a presentation where the speaker threw out the phrase: “The UI looks horrible, I am not a front end person.” If you don’t want to be that guy, this book is a good start for you! The book Web Design for Developers by Brian P. Hogan helps someone who has had to utter that phrase understand some of the fundamentals of design. This book has an easy to read quality to it that allowed even a slow reader like me to complete the book on a flight from Detroit to Seattle.
Part 1 – The Basics of Design
Developers often perceive the design side of things as an artistic rather than tactical endeavor. This section shows that there are rules and principals to design that, if followed, lead to decent looking results. Exposure to this material alone would make most of the prototypes and presentations I have seen more effective. The initial chapter covered the purpose of the site that would be designed over the course of the book, presenting compelling arguments for pencil and paper sketching along the way. If you have ever been in one of those early design reviews where the client is focused on the color of the buttons instead of the flow of the application, you know exactly where the author is coming from.
That brings us to the topic of color. There was so much great information in here, starting with the fundamentals of using the color wheel as well as differences in choosing color for web vs. print media. One thing I learned from this chapter was the concept of taking a picture of something in nature and use that as a basis for a color scheme. I find myself looking at colors that occur naturally together and saving them for future use.
Typography was covered next. This was another area where the author called out some of the older practices and idioms that were based on print medium that change a bit for the web. The mind blowing topic for me in this chapter was establishing a layout grid based on the dimensions of the fonts chosen for the site. This is one of those things that seemed so obvious when the author explained; I wondered why it had never occurred to me. This is a great idea that I plan on incorporating on future designs.
Part 2 – Adding Graphics
This section contained a bunch of good advice on choosing graphics as well as some of the mechanics of using Photoshop. I have to admit that I don’t use Photoshop simply because my talent level is covered by Expression, which comes with my MSDN subscription, and Paint.net which has a lot of community support. The concepts covered here applied directly to the tools that I use regularly and taught me to use them better. The section on layers and building graphics took another topic I knew and gave me new skills to work with. Layering is another one of those fundamental concepts that exponentially expands what you can do with a graphics tool.
Part 3 – Building the Site
This section covers what has gotten to be very popular material over the last couple of years. The importance of separating the sematic HTML from the visual aspects in the CSS is explained well here. The concept of separation of concerns is not new to developers, but it does seem like compromises come quickly when a developer is building HTML and CSS. I think this has more to do with exposure to good practices than anything else. The approach covered here will lead to sites that are much easier to extend, and much easier to add features such as dynamic content without post back. If you are an ASP.NET classic developer used to drag and drop design, please read this chapter. Considerable flexibility has been added in ASP.NET 4, this will help you understand why it is important. Since reading this book, this is the section that I find I reference most often.
Part 4 – Preparing for Launch
No book that covers web design would be complete without covering the 800 pound gorilla. The very important topic of dealing with IE in its various releases gets its own chapter. If you have done any web development at all, this is no shock to you. If you do not know the tricks and traps of dealing with IE, it will consume a good portion of your time during the development process. This is an important chapter to be aware of not only for its contents, but also for the references mentioned.
Accessibility is another topic that is popular in design/web development circles, but rarely discussed in the world of the developer. I was first exposed to this topic by my good friend’s book on Testing ASP.NET Web Applications. If you have not been exposed to this topic, you will be amazed at the impact of your design choices on those with disabilities. I have yet to have to code for 508 compliance as a requirement, but these two books would be right by my side if I did.
Web Design for Developers by Brian P. Hogan is an exceptionally well thought out and timely book. With so many developers heading towards MVC based web authoring, the importance of well-constructed HTML and CSS is at a premium. The tactical side of this book covers a lot of important ground, but more importantly the material in Part 1 on theory is some of the best I have seen. Make no mistake; you will not change professions from back end developer to designer based on this book alone. But, you will have enough of a solid basis for creating things that look professional. No longer will your UI skills be the focal point of your applications, demos, and prototypes. Understanding the basics covered here will allow your core competencies take center stake. If you can’t tell by now, I highly recommend this book!