The Smashing Book – Learning from Experts: Interviews and Insights

• By The Smashing Editorial
• October 5th, 2011
• Business, Education, FAQ
• 1 Comment

← How to Turn a Site into a Remarkable BrandTOCLearning from Experts (2/4) →

Many of the most successful and well-recognized designers are willing and eager to provide guidance to others who want to improve their skills. We posed a series of questions to leading designers and developers in an effort to get some answers to common questions. The participants bring a great deal of diversity in skills and expertise, and all have valuable insight that can help those looking to grow¹.

Meet our panel of experts:

• Dan Rubin (www.webgraph.com) Founder and Principal, Webgraph and Co-Founder, Sidebar Creative.
• Jason Santa Maria (www.jasonsantamaria.com) Freelance Designer and Speaker.
• Paul Boag (www.boagworld.com) Co-Founder and Creative Director, Headscape; Founder, Boagworld.
• Jeff Croft (www.blueflavor.com) Designer, Blue Flavor
• Andy Budd (www.clearleft.com) Co-Founder and User Experience Director
• Collis Ta’eed (www.envato.com) CEO, Envato
• Wolfgang Barthelme (www.bartelme.at) Founder, Bartelme Design
• Keith Robinson (www.blueflavor.com) Principal and Creative Director, Blue Flavor
• Chris Spooner (www.spoongraphics.co.uk, www.line25.com) Freelance Designer and Blogger
• Jonathan Snook (www.snook.ca, www.sidebarcreative.com) Designer, Author and Speaker
• Tony Chester (www.onwired.com) Founder and Director of Operations, OnWired
• Elliot Jay Stocks (www.elliotjaystocks.com) Freelance Designer, Author and Speaker
• Khoi Vinh (www.subtraction.com) Design Director, New York Times
• Veerle Pieters (www.duoh.com) Graphic Designer, Blogger, and Founder of Duoh!
• Chris Coyier (www.css-tricks.com) Web Designer and Blogger, Chatman Design and CSS Tricks
• Jay Hilgert (www.bittbox.com) Designer and Blogger, Bittbox
• Dave Shea (www.mezzoblue.com) Freelance Designer and Founder of Bright Creative, CSS Zen Garden and Mezzoblue
• Darren Hoyt (www.darrenhoyt.com) Freelance Designer
• Henry Jones (www.webdesignledger.com) Freelance Designer and Blogger, Web Design Ledger
• Liam McKay (www.wefunction.com) Designer and Project Manager, Function
• Nathan Smith (www.fellowshiptech.com) User Experience Developer, Fellowship Technologies and Founder, SonSpring
• Nick La (www.ndesign-studio.com, www.webdesignerwall.com) Founder of N. Design Studio and Blogger
• Larissa Meek (www.agencynet.com) Associate Creative Director, AgencyNet
• Jon Hicks (www.hicksdesign.co.uk) Designer, Hicksdesign

Part I: Design and Development

What is one common myth or misunderstanding about Web design and development?

Dan Rubin: That it’s something fundamentally different as a medium, and that solving problems for the Web requires radically different thinking than anything that’s come before. This simply isn’t true, especially where designers are concerned. The basic principles of visual design hold true when designing for the screen; the layers of interactive design, information architecture and other media-specific areas are just specialties related to the medium, just as architectural knowledge might relate to environmental graphic design, or as materials, printing and binding knowledge relates to packaging design, for example. The sooner a designer understands that, the faster they will become proficient in using the specific combinations of these layers that Web interface design requires.

Jay Hilgert: The most common misunderstanding I encounter has to do with the perception of clients. I’d say 90% of the clients I’ve dealt with underestimate the amount of work that making a website will be on their end. Paying a designer to make them a website isn’t enough; the entire design depends on what content and message they wish to convey, and most of them don’t realize how much thought they need to put into that. It’s amazing to think that you can wait three weeks for a single paragraph of text from a client for their home page, but it happens regularly.

Wolfgang Bartelme: I guess the most common myth is that a certain design, and I’m speaking about Web design, can reach a point that it’s finished. It’s an ongoing process.

Keith Robinson: That mastering the tools (CSS, HTML, etc.) is all you have to do to be successful. I think one of the biggest problems young Web designers (and developers) have is a narrow focus on tools, as opposed to fully understanding the medium. I think knowing how to write HTML and CSS, as well as having a solid understanding of other technologies (Flash, JavaScript, etc.), is important, but it’s equally important to develop non-technical or non-tool-related skills. It’s good to know how CSS works, but that doesn’t substitute for understanding solid design and usability fundamentals, for example. As well, it’s important to master interpersonal skills and time management, etc. As an employer, I’d gladly take a lesser talent if they’re much easier to work with.

What are common usability mistakes you frequently see from other designers? What important aspects of usability are often forgotten but need to be considered when designing websites?

Jonathan Snook: Probably the most common usability mistake I see designers make is making some things too subtle for the sake of aesthetics: links or buttons that are not obvious or are hidden; things grouped too closely together. The user should know what they’re clicking on and why they’re clicking on it. Otherwise, they’ll just ignore it.

Tony Chester: All too often, I see designers crank out websites with terrible navigation. Yes, websites can be beautiful, but not at the expense of the content. Yes, you can use a content management system, but not if it forces you to have a stupid page flow. Navigation is critical, especially when the main purpose of most websites is to sell something or share knowledge or collect users’ information. If users can’t fulfill their goals on the website easily, they’ll leave, regardless of how the website looks.

Aside from that, I see too many designers trying to do cool things with Flash and jQuery that simply make the website frustrating to use. I loathe dynamic menus that disappear too quickly if my mouse movement isn’t precise enough. Give people big targets, and give them a little room for error.

How do you feel about CSS frameworks? Do you think designers and developers should use an existing framework, create their own or not use one at all?

Elliot Jay Stocks: I don’t use any pre-existing CSS framework because I prefer to work my own way rather than someone else’s. So, I have my own framework, which includes CSS, HTML and bits of PHP. I also make use of my free WordPress theme “Starkers” as a starting point, so I guess you could say that’s a framework in some sense. In general, I think frameworks, especially your own, are a good idea because they speed up the build process dramatically. If you do any task on a regular basis (which is inevitable, really), it pays to use a framework so that you don’t have to keep repeating yourself.

Khoi Vinh: To be honest, I don’t really care. If you are a passionate, ambitious designer or developer, it doesn’t matter to me one bit whether you use a framework or not, so long as the end product is true to the spirit of the design and to the goals and needs of the people who will be using it. So long as you’re not using Dreamweaver, it’s okay by me.

A creative menu made with flash

Chris Coyier: If you are thinking of using a CSS framework because you don’t understand how to accomplish the layout you are after, you shouldn’t be using a CSS framework. CSS is a simple language. Writing it from scratch isn’t so laborious that it necessitates some abstraction to make it more usable (e.g. the “on Rails” part of “Ruby on Rails”).

That being said, CSS frameworks certainly have their use. Think of a grid-heavy, newspaper-style website. Every day, new layouts are needed to make things fit. The designers who maintain these websites need options and possibilities, not limitations. You can be sure that these types of websites are using frameworks to make it happen. They are using #home, .subColumn-3, div.first and .columnGroupB, semantics be damned.

If you are in this position, creating your own is certainly a possibility, but you would do well to check out some popular and time-proven frameworks before diving in. Blueprint, 960 and YUI grids, for starters.

Dave Shea: I see two main advantages to using frameworks: 1) less up-front work when coding a website, and 2) less cross-browser issues. In the case of the former, I’ve developed my own “framework” of sorts over the years that reduces the work when starting a new project. And in the case of the latter, I’ve gotten so familiar with Internet Explorer’s quirks that I spend a lot less time debugging these days.

I’ve never cared enough to try one of the third-party frameworks like Blueprint, 960 or YUI. I figure that because I’ve been coding websites myself for ages, the time it would take me to hack one of them to my layout needs would be equal to or greater than the time it takes to just code it myself.

Not to say they’re not great for others. I’m sure they speed up development time for some people and help beginners ease into coding CSS layouts. But for me, frameworks are a non-issue.

The YAML online grid generator works in a browser.

How would you describe the designer and developer’s responsibility with search engine optimization?

Darren Hoyt: If you charge a competitive rate, you should already be building your websites with logical, semantic HTML that will complement the client’s keyword-rich content, and ideally the CMS you’re using should generate descriptive URLs. These things alone should be attractive to search engines. This shouldn’t be an “extra” step; in my opinion, it should be standard.

As far as the developer’s “responsibility” with optimization goes, it all depends on what is defined in the contract. Before a website goes live, I explain to the client that beyond writing good code, I cannot ensure for them stellar search engine rankings. I encourage them to think carefully about the content they upload and the people they exchange links with because it’s the only thing that will bring them honest relevancy in the eyes of Google.

Personally, I would never define myself as an SEO expert to clients. I’d prefer to refer them to someone who has experience improving rankings. But I wouldn’t refer anyone who relies on “baiting” Google in ways that are unethical or on methods that are plain ineffective or outdated.

Tony Chester: The developer’s role in SEO is of utmost importance. Clean, standards-compliant code will do wonders for your rankings. When the Google bot arrives at your website, it doesn’t want to weave its way through useless tables, old-school font tags and irrelevant code. It wants one thing: content. That’s where developers come in. They are the key to feeding the bot with the content it so desperately desires. They are the ones who write clean markup and create content hierarchy. They are the ones who make those pretty SEO-friendly URLs for you and create those XML sitemaps that Google loves so much. Without a well-built website, SEO is going to be a challenge.

Henry Jones: SEO can be broken down into two types: off-site and on-site. Off-site SEO is basically the number of incoming links to a website. Developers have little control over this. But on-site SEO involves using proper HTML markup, creating a solid website structure and making good use of internal links. Along with having a general understanding of how search engines work, developers should be responsible for all of these kinds of things.

—

1. Screenshots created with the browser Flock 2.5 under Windows Vista

← How to Turn a Site into a Remarkable BrandTOCLearning from Experts (2/4) →