The 10 Commandments of Effective Web Design

commandments effective web design

In the beginning, Tim Berners-Lee made the first website and called it the World Wide Web – and it was good. Fourteen years later, there are over 644 million websites about everything and anything under the sun. Some of these websites so stunning they could even be considered works of art. Other websites…not so much. We’ve learned a thing or two about web design since its humble beginnings, but there are certain fundamentals all successful websites follow. We now pass these web design commandments down to you.

The 10 Commandments of Effective Web Design

Thou Shalt Put Content First

Before you even begin to develop a layout or even think about color choices, know what content is going on your website. Get all your required copy, images and media in order. What’s the goal of your website? What is its purpose and what is it trying to say? Define this before you define anything else.

Thou Shalt Delegate Information Hierarchy

Now that you know your website’s purpose, it’s important to figure out the best way to communicate your information. Think like a journalist. The most important piece of information is placed at the top of each page with backing information pushed down towards the bottom.

Thou Shalt Incorporate Design Elements

In graphic design, there are number of basic design elements which include:

  • Lines
  • Color
  • Shapes
  • Space
  • Scale
  • Typography

When use together, these design elements communicate a message beyond what the site is simply saying. A website that incorporates elements of design consistent with its company’s brand identity and content will serve to deliver a stronger message than simply applying content to a white page.

Thou Shalt Use The Grid

At its barest, the grid is simply a series of intersecting vertical and horizontal lines. But the grid is the glue that holds your website together and keeps it from spiraling into chaos. Defining the grid of your web page aligns the page’s design elements in a rational manner so it can be absorbed by your audience. Learn the grid. Use the grid. Know the grid.

Thou Shalt Embrace Whitespace

Whitespace is far from empty. Whitespace reduces cognitive overload making it easier to digest the information presented on screen.
The proper use of whitespace aids in structuring information and draws the eye to content you want to emphasize.

Thou Shalt Keep It Consistent

You wouldn’t wear a cocktail dress to a funeral, nor would you design a website for Coca-Cola in blue (Pepsi’s signature color). You company’s brand identity will be the driving force behind choosing which design elements to incorporate into the website. Additionally, consistency between pages is required to promote a consistent user experience. If your logo is in the top left-hand corner of the menu bar, don’t suddenly change it the right.

Thou Shalt Promote Balance & Serenity

Balance is a state of equilibrium of visual elements within a composition. Balance helps the eye flow throughout the website, assessing its content collectively rather than darting across its elements of chaos. Pay attention to each of your design elements and use them together to create a zen sense of harmony for your user.

Thou Shalt Submit a Call To Action

Guide your users to the action they’re supposed to take next. Useful actions are proven to increase sales and generate leads. Make all calls to action obvious and inviting.

Thou Shalt Link Internally

Link to other areas inside your website for optimal performance. It can be to a blog article, a contact form, a product or service, or some other relevant page. Internal links lowers bounce rate and keeps the viewer interacting with your website.

Thou Shalt Break the Rules

Rules were made to be broken. If humanity had followed the rules 100% of the time nothing groundbreaking or innovative would have ever happened. However, it’s best to save risk taking for after you’ve gained some web design experience. Then, and only then, take smaller calculated risks by using different design elements such as contrast, tension and variety.

Posted on July 15, 2015 in Digital Advertising Strategy

Share the Story

About the Author

Leave a reply

Your email address will not be published. Required fields are marked *

Back to Top