The 3 Master Principles of Web Design
February 27, 2008
Floating around the universe, are certain universal principles that transcend disciplines. I would like to explore a few of them here, and talk about how they can be applied to web design.
The Three Master Principles
#1 Simplicity
This is such an important principle, that it can easily be made into the top three web design principles, just as location is to real estate:
– location
– location
– location
… we could say the same thing about simplicity in web design:
– simplicity
– simplicity
– simplicity
The important thing to take to heart, is that your web sites should be designed to be as simple as possible. You want to keep it simple for two main reasons:
- To make it easy for you to update.
- To make it easy for visitors to navigate the web site.
The simplicity principle applies to design, structure and the code.
What do I mean by ‘structure’ of the web site?
I am simply referring to the URL structure. So we are talking about directory structures, page names etc. I’ve detailed this in my article on intelligent paths in websites.
I think the other two (design and code) are self evident.
… Now let’s look at principle number two:
#2 Modularity
Web sites, from the ground up, should be designed in a modular manner: websites should be built up as a series of modules/components rather than as a run-on sentence.
So that means a few things:
- Creating logical divisions in your website’s structure.
- Extracting out of your web pages, common elements (like footers) and use ‘include’ mechanisms to reinsert those elements back into your pages.
- Using external CSS style sheets rather than embedding CSS code in your pages.
Modularity helps you comply with principle number one (simplicity) and helps you to save time and effort. Knowing how to intelligently segment your site into logical structures is a sign of maturity in your abilities as a web designer.
… When I see a web designer first conceive of a web site as a series of building blocks/components, I know this web designer knows what they’re doing!
… Now onto principle number three:
#3 Balance
When I think of balance, the first thing that pops up in my mind is a boxer moving around the ring, always in balance, so that they can easily move in and out to land that knockout punch.
Being in balance gives the boxer his best chances to hit and not be hit. If off balance, they will be limiting their choices … missing opportunities to get out of the way (of a punch) or to move in and deliver a nice flurry of punches.
So what is the balance in a web page?
You can look at this in a few ways, but for me, the most important is to balance out how much information you deliver on a page versus making the page easy on the eyes. If the page is too busy, then users will be frustrated trying to find what they want to find. The same thing for the search engines, to much content on a page removes specificity, making it hard for the engine to categories your pages properly.
Design Aesthetics
This can be also looked at from the point of view of design aesthetics – white space on a page. You need ‘breathing room’ in your pages so that it is easy for eyes to move around unfettered by obtrusive content.
So what is the balance in a web designer?
It is the balance of being a coder vs. designer and how knowing a bit of both, will make you a much better web designer.
Understanding the aesthetics of web design (nice layouts, usability concerns) is an important ingredient to any successful web site. If it doesn’t look and feel good to the visitor … they will leave and not come back.
On the other hand, if you know nothing of code and just rely on programs like Dreamweaver, eventually you may find yourself with a big mess of code that makes keeping the website up-to-date a hard thing to do.
That’s all I got to say about that.
Stefan Mischook
www.killersites.com
