Essential Website Design Tips for Beginners: From Layout to Color Schemes

If you are launching a small business, you have probably thought about how you are going to communicate information about your business online. Having a website is an essential business tool, and if you are like many business owners, you likely selected a content management system such as WordPress or Squarespace for your website. WordPress is the most popular content management system, with tons of customization options—and this can sometimes become a bit overwhelming. With so many design options, how can you know where to start?

In this article, we’ll take a look at some of the basics of successful website design and recommend some key principles you can apply to create a stunning site for your business.


Tip 1: Have a Clear Purpose in Mind

One of the key principles of good design is that form follows function. What that means is that the shape of what you design should be based on what you intend to use it for, not just to look pretty. In order to develop the right design for your website, you should be sure you have a clear idea of what it will be used for. An e-commerce site needs a different design than an artist’s portfolio, a writer’s blog, or a medical website

Your purpose will determine the design choices you (or your professional web designer) make, but whatever purpose you have in mind, remember that the user’s needs should come first. Your purpose should always revolve around what the user needs and expects.


Tip 2. Follow the KISS Method

When it comes to design, less is more. The KISS method—“Keep it simple, stupid”—can help you create a clean, functional website that will help your visitors find what they need fast. Avoid clutter as much as possible and use a simple layout. Remember, white space is your friend, so avoid the temptation to fill every inch of space with words and pictures.

To keep your layout simple and effective, use a grid to align elements. This will achieve a consistent and appealing look. Consider the hierarchy of content, making the most important information larger or boldface. The idea is to guide the reader’s eye to content you want them to see first.


Tip 3. Take Multiple Platforms into Account

In today’s digital environment, you can’t predict what device or platform your visitors will use to access your site, so you will need to use responsive design techniques to make sure your page will display as attractively on mobile devices as it does on desktop and laptop devices. Check your site on a variety of platforms and browsers to ensure consistent behavior and correct formatting. If you are using a managed WordPress hosting platform or another service that provides additional services, your hosting provider may provide responsive design tools, but you will still need to check the results by hand.


Tip 4. Choose the Right Color Scheme

Color makes an impression, and you want your site’s color scheme to align with your brand. While it may be tempting to use a lot of colors, the more tightly you control your palette, the more unified and attractive your site will be. As a good rule of thumb, using 3 or 4 colors gives you the right balance of flexibility and consistency.

If you already have branding, using the colors from your branding is a good bet. If you don’t yet have a color scheme, consider the emotion you want to evoke: cool colors like blue can feel calming and trustworthy, while warm colors like red tend to call to mind urgency and excitement. 

It’s also vital that you consider universal design principles and use colors with significant contrast so that all users, including those with visual difficulties, can easily read your text.


Tip 5: Choose the Right Font

Just like color, typeface can make or break a first impression. You want to use a simple, clean typeface that is easy to read. Avoid using any decorative fonts in the body text, though such display fonts can be used for headings or headline, if deployed judiciously. In general, stick to one or two fonts and use an organized hierarchy of sizes and colors to maintain consistency from page to page. You want your site to be cohesive. 


Tip 6: Choose High-Quality Visuals

The visuals you use on your webpage should be purposeful and relevant. Don’t add pictures just to take up space or to decorate. You should focus on using targeted visuals that directly relate to your purpose. So, for example, if you are a business owner, images of your headquarters, your store, or your employees and/or products may be relevant. Avoid the use of stock photos as much as possible since they can make your site seem generic, or even fake.

Most visitors dislike autoplay videos, so use video sparingly and optimize them for web use to avoid slowing down your load time. 


Tip 7: Design for Speed

You may not think of speed as a design feature, but design choices you make can heavily impact how fast your site loads. Large images can slow your site down, so compress images to speed up your load time (but not so much that they read as pixelated or blurry), and consider deploying images sparingly rather than overloading your site with too many pictures. Similarly, reduce unnecessary code by eliminating unnecessary design functions and features to keep your site speedy. 


Tip 8: Design for Usability

We’ve all visited bars or restaurants where the bathrooms have confusing labels, think they’re cute. One memorable set featured a cat and a rooster. But when designing a website, you don’t want to confuse your users or force them to hunt for the content they need. Your pages should be clearly labeled for easy navigation with standard names like “home,” “about,” and “contact.” 

Remember, your users won’t all be on laptops, so make sure clickable elements like buttons are designed to be big enough for a thumb on a mobile device. Similarly, remember than some users will have different levels of ability, so make your design friendly for those with disabilities by using alt text for images, descriptive links, and keyboard-friendly navigation.


Tip 9: Make Use of Whitespace

As mentioned above, whitespace is your friend. Give your content room to breathe. Not only will this make it easier for your readers to understand and engage with your content, but it will make your site look classier and more polished. Only spam sites and clickbait fill every inch with pictures, links, text, and videos. You want to look like a high-end publication, not a phishing site.


Tip 10: Listen to Feedback

Every website is different, and you won’t always know on day one what will work best for your site. Solicit feedback from your users and listen to what they say is working well or not working with your design. You can deploy A/B testing and analytics for a more formal analysis of specific design elements and make adjustments to optimize your design for your specific purpose and your specific audience.


Summing Up

It can be tempting to chase the latest web design trends, but it’s more important to have strong fundamentals. The common theme that runs through these tips is that you should always keep your visitors in mind and think about your site from their perspective. If you were visiting your site for the first time as a customer, client, or reader, what would you find visually appealing? What functions would you expect to see? Over time, your site will grow with you and your audience, but always keep in mind what will best serve the people you’re trying to reach.

Andrej Fedek is the creator and the one-person owner of two blogs: InterCool Studio and CareersMomentum. As an experienced marketer, he is driven by turning leads into customers with White Hat SEO techniques. Besides being a boss, he is a real team player with a great sense of equality.