How To Create A Website vs. Design A Website: Simplifying The Process.

(Photo: litherland)I want to make a clear distinction between two things here:  Creating a website is a very different process than using graphic design to beautify a website.  Designing a website is not necessarily creating a website.  When you're making a business website, you want to make a good website first, and then look at design elements.

There are multiple approaches to both creating and designing, but for most business owners I want you to meet somewhere in the middle.  I lie; I want you to err toward making simpler websites, with great structure, effective content (notice I didn't say great, even though great is good), and dressed with well done graphics.  You don't have to be a graphic designer to make a great website though.

The analogy I use most is that of building a house, and then decorating that house.  Let's consider this house our storefront.  Let's also allow that a finished house includes routine dressings like floor moldings, quality door knobs, well crafted siding, etc.  It's a sound, livable home, and we want to put a business there.  There are two errors that are made most frequently.  Follow me in the analogy to illustrate each one.

1. Trying to fix a crummy site with graphic design.  You can't walk up to a wobbly home where the windows have a weird slant to them, the roof pitch isn't even, and the door is hanging on one hinge, and proceed to hang garland around, paint the door neon green, have beautiful calligraphy artwork commissioned on the front to say, "open," and put a new cash register in there with a cute sticker on it, and consider yourself in a good "home."

2. Having all design, and no organic content.  Likewise, you can't have the most beautiful TV home, made with beautiful matching colors, perfectly laid shingles painted around the edges, a gigantic running fountain in the AstroTurf green front yard, and then walk in to find no toilet or sink, no fourth wall on rooms, and no space between decorations to hang stuff like Tax Authority certificates, or industry certifications, then call this a livable "home."  What's the fountain for?  [Edit: for all you designers out there, the fountain is Flash, in case you didn't guess ;)]

The Smarter Way: The Key to Great Websites

I suggest a more holistic approach to creating business websites.  Websites have functions.  People expect websites to answer certain questions, especially if it's a business.  They expect content that will set the website apart.  They expect actionable content that guides them toward a solution or addresses some need, or enriches their time spent with you.

In the Corporate World this concept is gaining popularity in the buzz words, "results driven problem solving."  Small business owners know that there really is no other way of solving problems.  That buzz phrase is stupid, but we want to approach our websites from the same mentality.

I encourage you to build your website with the notion that you are publishing interactive, valuable content about what problems you solve, who you are, why customers should trust you, and how they can get to, or invoke the solutions you offer.  Consider it a live presentation filled with rich material that you deliver to an audience who can interact.  Present that material in an organized way, and THEN dress it up with well crafted, well placed, elegant design elements.

You can stop reading now, and have the entire gist of making great websites.

If you want to continue reading though, I'll give you examples of this done well, and resources that will help shore up this belief.

Examples and Resources

This is more of an article to firm up the distinction between building and designing rather than an extensive how-to.  I go in depth about creating websites in other articles, and how you can start with a good platform like Squarespace to have an elegant and effective website running in very little time.

My overall point is that making a website starts with the content.  Not so much the over used SEO cliche that "Content is King," but more in the sense that no good design is going to fix a lack of content.  If you want to create a good website, think about what the content is, present that content coherently, and then dress it with some design.  This is a distinct difference from designing something to look fancy, and then trying to figure out what content to put in it to validate it.

There's a compelling design rant, from The Noodle Incident, that Owen Briggs wrote in 2001.  This article struck me when I read it 10 years ago, and it is still valid today.  His message is geared toward people who code websites, which I was doing back then, but the content-dictates-presentation precept transcends any platform or level of website making, whether you're publishing content only, for a business website or blog, or coding a new site from the ground up.

He starts by pointing out some things that the Web is not.  This is important for business owners to remember because although your website is part of an overall marketing strategy, it is not, and should not be a flyer, or one gigantic business card, so to speak.

"The Web is not Print. This isn't news to anyone. But the web isn't screen either. Or more accurately it is print, and screen, and voice, and many other things. Right now it's December 2001 and chances are you're reading this on a PC or a Mac, so you think you're building pages for PC or Mac. Well, just stop."

His point is that there is more to it. There are PDA's, smartphones, different browsers, and also accessibility variables to consider like TTY, Aural, Braille, and Embossed. You also want your website to be easily machine readable which is ultimately what all "search engine optimization" boils down to.  You want Google to be able to properly index your site so that people looking for solutions you offer will see you indexed and listed among options.

Continuing in his rant, Briggs made a profound observation about the Web, 10 years ago, when it was still stretching its legs out.  As a business owner, when you swallow this observation you will truly see the leveraging power available in the Web, and you'll take the message publishing idea, that I presented earlier, to great profitability.

"The code is made so your message is written once yet read in many different formats. This is a new concept. This is what's really new about the web. We've never had a single input = multiple output media before. As an author it's like getting book, radio, and movie contract all at once, yet you only produce one work for all of them."

This is key to really grasp.  The Web, and your website, is so much more than just some pictures and colors.  A picture, or banner, or your logo and tagline can't be read by search engines, or seen by those browsing text only, or using interpretation devices like TTY.  An entire website that was produced with pictures and graphics is reduced to an expensive flyer that is wasting space on the Web, and missing the entire point of this dynamic publishing and marketing opportunity!

Content and Masthead: A New Way of Thinking

This is how I want you to think about making your websites from here on out.  The following is drastically oversimplified, but if you do it well, and even if you only do this, you will produce remarkably effective websites! 

• Use a good publishing platform (also known as a content management system) to deliver effective, compelling, customer focused content that answers the basic five W's about your business, as it pertains to creating value for the customer.  When that is ready for press, hire a graphic designer to create a beautiful masthead for you, and adorn your website with it.

Start with that.  Create rich content worth reading, content that will benefit your customers, and then adorn it with a masthead.  I recommend Squarespace as your content management system.  They are an overall solution to website needs, I've been using them for a long time, and for several of my businesses.

Following this simple precept, you'll routinely get compliments that all carry the same message.  "Wow, your website looks great!  Simple, elegant, I really love it."

Good Examples

(Photo: Dooce.com from December 2011)There are many sites out there with great presentation, but one that really perfected the masthead adorning model is Dooce.com.  Heather Armstrong's site is unique because she changes her masthead every month.  But for over 10 years, since 2001, it's been the same simple and stunning model: great content adorned with beautiful masthead.  You can see an archive of all her mastheads here to get an idea of how varying you can be.

(Photo: AListApart.com from December 2011)Another great example comes from A List Apart, they are the most respected website about making websites, and they are also a great example of the content-first-dressing-later approach.  What I like about A List Apart's design also is that they present a masthead variation, one that I too want to suggest to you.

They have rich content, with a simple navigation bar at the top, and a beautiful tag in the top left of the site, in lieu of a banner.  Your masthead doesn't have to be a long horizontal banner.  It just has to tie your site together, like a decorative bow, and be that design touch that makes you look composed and professional.

Wrapping Up, Odds and Ends

Making a website doesn't have to be a big fuss.  Honestly, if you focus on the content, and start with a good base from a publisher or content management system like Squarespace, you don't really need the masthead.  Websites look better with a masthead, but it's not required.  See Esther Tyree's My Music Ventures, a website to consolidate her teaching studio with other business ventures and writings.

(Photo: My Music Ventures in December 2011)My Music Ventures belongs to my aunt.  She is a talented musician, teaches several instruments, and is the founder of two other businesses.  I set her new site up using Squarespace within an hour.  This site was live, content imported from her old Yahoo Business one, and ready to go when I turned the keys over to her.  To really set this website off, it could use a beautiful masthead graphic in the top Right, maybe a large Treble Clef that matches the color of the text in the header. 

You can get creative, and still be simple and beautiful.  Regardless though, this website is well made, covers all the basics of SEO, and is structurally sound regarding HTML and CSS.  Squarespace takes care of all that for you.  All you have to do is pick the starting design that fits your feel, and fill with great content that meets your customers' needs.

We'll go deeper into planning and setting up a website from scratch, covering everything from napkin drawings to assigning your custom domain to it, in different articles.  But for now, let this one sink in.  Start with great content focused on your customer, explaining your value proposition.  Publish that, and then garnish it with some graphic design.  Now you have an interactive, effective store front and sales tool working 24/7 for you, even when you're not around.

Want Personal IT Support?

• I'm running a special collaboration offer from This Blue Couch.  See Details Here.

Related Articles:

• How to Build the Best Real Estate Website in the World!

Comments

[Jacob]

It's all about quality content and good keyword research when creating a website. I like to make sure my sites are as simple as they can be with the most in depth content.