How to make a good website: The Three Pillars

When it comes to making a good website, there are three considerations. It needs to look good, be easy to use, and be easy to find. That's it. Those are the three pillars. If you're now wondering what goes into making the three pillars, don't worry. This article is about the three pillars and ensuring your website nails all three. Without further ado, let's dive in.

How do you make a website look good?

Making a website look good is simpler than you might think. You don't even need to be a professional designer. It only takes a few good decisions to produce a nice-looking website. Design isn't magic; it's a process of problem-solving. Following a few guiding principles takes you most of the way there. The principal considerations for designing a good website are layout, media, colours, fonts, and animations. Let's dive deeper into each of them.

Layout

How you layout your website content has significant knock-on effects. An overly complex layout becomes confusing and difficult to use. If it's too simple, your website becomes boring. 

Start your design with a grid. All design tools allow you to add grids to guide you while you work. I like to use a 6x6 grid, but you can use whatever you want. Visme has a great guide if you want to dig deeper into grids. Your grid helps keep your content structured and aligned. In the grid you created, adjust and add contrast to element positions and sizes to keep your layout dynamic and engaging.

Generally, we construct our layout before adding any content or styles. We call this a wireframe. It allows you to perfect your layout without adjusting any other parts of your design system. Once you're satisfied with the wireframe layout, add your website content.

Typography

Typography refers to how every word and symbol looks on the site. The primary function of your copy is for users to read it. Keep this in mind throughout the design process. I know it seems obvious. You'd be surprised how many websites have illegible text. Use the following principles to help your website be easy to read.

• Your font choice should look good and be readable. Cursive and serif fonts are hard to read at small font sizes, so save these for headings.
• Avoid body copy smaller than 16px as this becomes hard to read, especially on smaller screen sizes.
• Use strong contrast between body copy, subheadings and headings. Adjust the font family, size, and weight to create contrast.
• Try not to use more than two fonts. Three fonts can work, but more creates a cluttered and unprofessional-looking design.
• Base your font choices on the website brand. Sans-serif fonts have a cleaner, more modern and trustworthy feel. Serif fonts evoke tradition and sophistication, while cursive fonts are more artistic and elegant.

Media

Website media is every image, video and audio you use on your website. Use it sparingly. Avoid overusing stock media. It's easy to spot and looks generic and uninspiring. When possible, use authentic content. If you don't have any media for your site, it doesn't matter. Work with what you have. You only need to see a few type foundry websites to know you can make beautiful websites with just text. If you do have media for your website, here are a few rules of thumb to get the most out of it in your design.

• Matching the colours in your images to your website colours brings extra cohesion and precision to your design.
• Avoid your images looking blurry and low-quality on retina screens by always using retina-quality images.
• Use similar aspect ratios for related content. If you have a list of blog posts with thumbnail images, ensure the size and quality remain consistent. Consistency always makes things feel more deliberate and professional.

Colours

Your website colours and your brand colours do not need to match. Adding colour to a website is a deliberate process. Incorporating your brand colours is part of that process but not the only consideration. So, what are the key considerations for using colour on a website?

1. Accessibility is vital. Your content should be readable by everyone. Many websites choose pretty colour palettes without considering those with colour blindness or other sight-limiting conditions. Use an accessible colour tool to test the readability of your colour palette.
2. Contrast acts as a guide for a user's eye through your content. Foreground content like text and buttons should contrast enough with your background to help users distinguish what they need to look at. Contrast also helps users understand your hierarchy. Using bolder colours is optimal for headings and CTAs as they grab attention.
3. Brand colours have their place on a website. Use more neutral brand colours more widely than bolder ones. Keep bolder brand colours to highlight key areas.
4. Consistency is always key in web design, especially for colour palettes. Keeping your palette consistent across pages ties the design together. You can experiment with the colours on different pages, but the palette must remain consistent.

Animations

Animations bring interactivity and dynamism to websites. Improper use becomes gimmicky. Consider the rest of the design. A gentler, more refined design requires similar-styled animations. Similarly, a bold, edgier design can use bolder animations. Just like with media, keep your animations purposeful and brand-aligned. Don't overdo them. Good animation feels natural but is barely noticeable.

Stay focused

A common theme throughout web design is purpose and consistency. Every choice you make must fit the character and style of the design. With so many tools and effects at our disposal, web design is more about what you leave out than what you include. Understanding and aligning your website goals to every design will always lead to a good-looking website.

Now, let's look at the next pillar. A good-looking website means nothing if people don't know how to use it.

How do you make a website easy to use?

Whatever your website goals, your users are integral to them. Understanding and optimising your user experience and journeys is paramount to a functioning website. So, how do we do that?

Clear hierarchy

Often, users skim a website to find key pieces of information. A clear hierarchy helps them do this. Hierarchy rules remain consistent regardless of design. Use bold, recognisable headings to catch your user's eye and highlight what the content is about. Clear signposting and calls to action guide users through tasks. The more complexity you add to your hierarchy, the harder it becomes for a user to follow and the less likely you are to achieve your website goals.

Digestible content

Website content should serve a purpose first. Clarity trumps cleverness. Your copywriting goal is to guide the user to complete a task. Don't prioritise poetic language. Be clear and precise. A user must understand a task to complete it. When writing website copy, start with the most explicit version you can write. Then, adapt that version to fit your target tone of voice. Keep things simple and engaging. Tools like ChatGPT, Grammarly, and Hemmingway offer excellent guidance and advice to improve your copywriting.

Consistent design

I'm not repeating the details of web design. I do want to reiterate the importance of consistency. A consistent design reduces cognitive load. Essentially, it limits the thinking a user has to do to understand a task. Following common patterns and processes users already know ease the load, as does consistent design choices across a site. An easy-to-use website is one that users can learn quickly and do not have to relearn on every page.

Accessibility

Too often, websites forget about users with disabilities. An easy-to-use website is easy for everyone. Following accessibility standards means users can use your website regardless of any disability. Follow the WCAG (Web Content Accessibility Guidelines) to ensure your website is accessible and usable by everyone.

Now, for the final pillar. You have a beautiful website with a fully optimised user experience. Unfortunately, you don't have any users. So, how do we make a website easier to find?

How do you make a website easy to find?

All the pillars of a good website are equally important. Each contributes to the others. Even the best-designed site needs traffic to thrive. This final pillar ties the others together. It enables the other two pillars to shine. It is how we find users for our website.

Make it worth finding

Before we find users for our site, we want to be sure they'll stay on it. That means we have to have the first two pillars in place. We need a strong website design that shows our brand in its best light. We also need engaging and informative content coupled with a great user experience. If we skip the first two pillars, we risk our site gaining a bad reputation. With a poor reputation comes a reduction in traffic and fading into obscurity.

Higher search engine rankings

Invest in SEO. If you don't understand how SEO works, read my deep dive into how I climbed the Google rankings. Give that read and implement its advice. You don't need to invest money, but the time investment is worth it. A high search engine ranking builds trust from users before they've even seen your site. Google has become the arbiter of trustworthy information and brands online. A Google ranking reflects favourably on your business and website.

SEO is a complex topic. I won't go into too much detail here. I have other articles you can read for more in-depth information and advice on SEO. In this article, I'll briefly introduce the key SEO tasks.

1. Use Google Search Console to list your website and track its performance.
2. Optimise your content with keywords specific to your website niche and desired search results.
3. Find backlink opportunities to develop your site's reputation as a trustworthy source of information.
4. Optimise your website speed and performance to ensure users stay on your site and have a great experience.
5. Set up a Google Business profile to appear in local Google search results.

Promote your website everywhere

It takes time to implement and see results from SEO. In the meantime, promote your website through other channels. Social media is a fantastic promotional tool if you know how to use it. Social media growth takes time that business owners may not have. There are other methods of website promotion you can try, too.

• QR codes on print advertising and business cards
• Event sponsorship and speaking
• Vehicle signage
• Cold outreach and email signatures
• Public business listings, like The Yellow Pages

Take any opportunity you can to promote your website. As your SEO efforts bear fruit, these alternative methods will compound that growth. Promotion is about expanding your reach and building awareness of your brand and services. The more people see you, the more they start to trust you. When people trust you, they are more likely to buy from you.

Is it easy to make a good website?

In principle, it is easy to make a good website. In practice, it is harder to make than you expect. Your website may not be a home run immediately. That's okay. Follow the principles in this article. Iterate on them. Build on your successes and correct your mistakes. 

Like the best businesses, the best websites build over time. Start simple and stay true to your goals. Keep improving. Each step takes you closer to your perfect website.