Web Design Principles

Websites that aren’t well designed don’t just look bad. The don’t work on a number of different levels. They don’t rank high in Google search results and do they score well in Google Analytics (for example, high bounce rates, short site visits, low conversions, etc.). So, what does a good web design do? Let me share 10 principles of web design that’ll make your site aesthetically pleasing, easy to use, attractive and effective:

“There are three responses to a piece of design – yes, no, and WOW! Wow is the one to aim for.” –Milton Glazer

1. Purpose

Let me ask you a question: are your users looking for information, entertainment or some kind of interaction?

The answer only comes from knowing the needs of your site visitors. Each web page needs a clear purpose in order to efficiently satisfy a user’s specific need. If you don’t know your users needs – ask them! Call them up, talk with them. send out an anonymous survey, ask folks for feedback on your social media channels.

2. Communication

Folks on the web want information quickly, so it’s important to communicate clearly and make the information easy to read. Examples of effective tactics are:

  • break text up with subtitles
  • keep paragraphs short (20-words – about three 3 lines)
  • bulleted lists
  • emphasize words in bold

3. Typography

There’s a ton to know about typography to become a real master, but Sans Serif fonts (clean fonts without decorative finishes) are best for websites because they’re easier to read on electronic screens. Google Fonts is a great source of sans serif fonts for your website – and best of all, they’re free!

As for the ideal font size, most experts will start at 16px and increase or decrease the point size slightly depending on the exact shapes and proportions of the individual letters. Note: the size will likely decrease by one or two pixels for tablets and mobile phones because we typically hold those devices closer to our eyes.

4. Colors

Color is one of the easiest ways to quickly improve a website’s user experience by establishing a mood. Whether you want to create a calm site with soft, complementary colors or shock visitors with vibrant colors, a well thought out color palette is critical to evoking an emotional response in your visitors.

Pro Tip: specify one contrasting color in your color palette to be used specifically for buttons or calls to action to make it stand out.

5. Images

People remember 80 percent of what they see and only 20 percent of what they read, so choosing the right images for your website is key to making a memorable website.

If you’re like most website owners, you don’t have a massive budget for custom photos. That’s why God invented stock photo websites like Shutterstock (about $2/photo) and Pexels (free). 😉

Also consider creating infographics, videos and charts, since these are way more effective ways to communicate than even a well-written 1000+ word essay.

Pro Tip: images must be optimized before uploading to the web to reduce loading time.

6. Navigation

Navigation refers to how site visitors move from page to page on your website. In order to understand navigation, you need to have a clear understanding of how your pages are organized. A nice tool to organize your pages is SlickPlan; it helps you create a site map of your website, much like an organizational chart. A site map let’s you order pages, give them logical titles and follow the “Rule of Three Clicks“, which means site visitors will be able to find the information they seek in three clicks or less.

7. White space

Good content (images and text) is important, but don’t forget that the lack of content (or visual clutter) is almost as important. Blank space – otherwise know as white space – gives websites “breathing room” and an appearance of order and emphasis.

8. Grids

Grid-based layouts organize content into sections, columns and tables that line up and feel balanced. Following a grid approach also makes it easier to create pages and ensure your content flows in a way that helps Google index your site properly.

9. Load time

Nobody likes a slow website. As a matter of fact, every second it takes your page to load reduces the chances a visitor will stay on your site by about 5%. The trick is to optimize your images (size and scale), combine code in a CSS or JavaScript file (this reduces HTTP requests) and minimize HTML, CSS, and JavaScript (compressed to speed up the loading time) help to reduce the load time of a web page. It can get a bit technical, but there are several WordPress plugins to help you optimize your site with just a few clicks (Smush for image compression and WP Fastest Cache for code compression and cacheing).

10. Responsive design

Nowadays sites are viewed by devices with several screen sizes, so it is important to make your website is responsive – meaning it automatically adjusts to different screen widths. If your website is not mobile friendly, the easiest solution is to update your theme.

Well, that’s it! I hope you enjoyed these principles for designing an effective website. And if you need help implementing them, contact us – we’re happy to help customize your site so it’s more attractive, useful and memorable for your visitors.

________________

ABOUT THE AUTHOR

Robbie Moore is the founder of Rushminute, a digital marketing agency in Lincoln, Nebraska. With 20+ years of experience in digital marketing, Robbie has worked with dozens of companies and organizations, large and small, around the globe. He also writes extensively about design, development, and business in general.