33 Proven Web Design Tips: How to Build a Better Website

Mitchell Villeta

June 25, 2020

Please Share:

Topic: Web Design

Web design can be the deciding factor for whether your business succeeds online or not. Customers are always evaluating the quality of your website. It’s your job to make your business look good.

However, many business owners don’t know what it takes to craft a web design that flat out beats your competitors and increases your conversions.

In this guide, we’re going to go over 33 powerful web design tips to help you create a website that stuns your visitors.

Let’s jump in.

Web Structure Tips

The structure of your website is the foundation for everything else. With poor structure, your website never makes it off the ground.

It’s important to follow these tips closely, as it will make everything easier later on.

Tip #1: Nail the Homepage

Your homepage is your chance to make a great first impression and win over customers. In fact, 94% of first impressions on the internet are web design related. 38% of users will leave your site if your design is bad.

Having good web design is beyond important, but what determines a good design?

You need to evaluate your site from the perspective of your users, and most importantly, prospective customers.

What do they want to see? What would entice them to buy something?

Design your homepage with these questions in mind.

Slack’s homepage has a great introduction that let’s you know what they do as soon as you land on the page.

Here are a few pro tips for keeping your homepage simple and effective:

Follow our IIS model – Introduce, Inform, and Sell. (More on this later)

Most users will scroll the moment they land on your page. Try not to stack all your key information in one area.

Most users will scan before reading. Design your content in small consumable chunks.

Do not overwhelm visitors with too much information on one page. Use other pages on your site to fill with information. Users that are interested will click links to go to them. Keep the homepage simple.

Tip #2: Make Your Website’s Structure Flow (The IIS Model)

Your website needs to feel fluid.

You have seconds to grab your user’s attention and keep them engaged. This means you need to have a straightforward page structure that showcases what your business is, what you can do for them, and how they can get started.

Earlier, I mentioned the IIS model, which stands for Introduce, Inform, and Sell. The IIS model has been extremely effective for our clients and our agency.

The model works like this:

The Introduce Section

When users land on your website, they expect to know what your business does off the bat. The best way to do this is to use a heading in the HERO section of your homepage (or any other page) to say exactly what you do.

Check out the example below.

Because a lot of users will begin scrolling immediately, use the next section below the HERO to reiterate what your business does and what you’re all about.

This is a great way to make sure users know why they’ve found your site.

The Inform Section

This section should be used to inform users about your services and the value you present to them. Inform sections typically include a list of your services, why customers need your services, and what your services cost.

Keep the inform section in consumable chunks. Information overload is a one-way ticket to a bounce (when a user leaves without taking action).

The Sell Section

This is the part where you make the sale or drive an action. It’s the hardest section to create and will require testing to see what works best, but it’s the most lucrative.

Call-to-actions (CTAs), web forms, client testimonials, and case studies are the bread and butter of the sell section. New customers want to know what you’ve done for past customers. If they like what they see, then you need to direct them to a place where they can buy from you.

Here’s an example of a solid sell section:

Utilize the IIS model properly and you should be able to convert a lot more of your users.

Have more questions about the IIS model and your website? Click here for a FREE web design audit.

Tip #3: Include An Accessible Contact Form

It seems obvious, but you should always have some sort of method to let users contact you via your website. The best way to do this is by creating a simple, but well designed contact form.

Creating web forms that are attractive, easy to fill out, and mobile-friendly is the best way to keep customers at arm’s length.

Another option is to provide your name, phone number, and an email address next to the contact form so that you give customers a choice of contact method. It also makes them feel more comfortable than putting their information into an online form.

Pro tip: To increase your leads, try to limit the number of contact boxes you need filled out. If you don’t need their phone number, make it optional.

Tip #4: Don’t Be Afraid Of White Space

White space is the empty space around elements on a page. Here’s an example below.

Apple does a great job at using white space to evoke their brand identity of simplicity and luxury.

Utilizing white space to keep your website clean of clutter is important for not overwhelming users, as well as just being more attractive.

You don’t need to use every pixel.

Tip #5: Avoid Carousels and Sliders

Sometimes websites will deploy a slideshow in the HERO section of a homepage. Sure, they might look cool and seem professional.

But in terms of web design and user experience (UX), they don’t always deliver the message you want customers to see.

The problem with carousels and sliders is that most of your users won’t wait to watch all the slides. Thus, they will be missing out on CTAs that can advance your conversion goals.

Instead of using slides, stack them on the page so that your visitors can scroll through them at their own pace.

Tip #6: Avoid False Bottoms

When someone gets to the end of your website, they’ll either scroll back up, exit, or click on an internal link.

But what happens when a user believes that they’ve made it to the bottom of the page, when in reality, there was still more information to be read?

You miss out on delivering your final call-to-action and any extra important information (although we don’t advise having super important information this low on the page).

The best way to avoid false bottoms is by making a clear divide between your page content and the footer. You’ll want to designate your footer as a strong color that differentiates itself from the rest of the page.

Oftentimes, footers are darker colors that haven’t appeared in other sections of the page. If you have a section of your page that is the same as the footer’s color, consider changing it.

Make sure the footer looks like a footer as well. Below is a screenshot of an average design for one:

HubSpot has a fantastic footer design.

Navigational Tips

Navigation paves the way for your customers to explore your products and services. Having a clear navigation structure is essential for a good user experience. Use these tips to strengthen user experience.

Tip #7: Keep Your Navigation Simple

It’s more important to have simple navigation than a complex one that you spent hours thinking about.

When a customer navigates through your website, the goal is to make them purchase something from you. It’s important to make it easy for them to move around.

One of the most common ways to ensure easy navigation is to optimize your header.

Spotify keeps their header simple and to the point.

Headers hold all of the main navigational links within a website. Keep these links clear and direct. Before a user clicks on one, they should know what direction you’re about to take them.

Pro tip: A great way to build a solid navigational system is to map out your website in a map before development.

Tip #8: Optimize For Visual Hierarchy

Every website has a visual hierarchy whether by accident or design.

Obviously, you want to build one by design.

Guiding eyes and getting them to read what you want them to, in a specific order, can maximize your website’s efficiency, as well as drive more conversions.

Here are some key points to keep in mind:

Eyes naturally gravitate towards bold text and headings. Use them strategically.

Most users scan in a Z-Shaped pattern or an F-Shaped Pattern.

Ensure that the most important information is readily visible as user’s scroll.

Always make buttons and calls-to-action visually attractive and unique from other page elements.

Tip #9: Identify Broken Links And Fix Them

Some pages on your site could have broken links. These are links that lead to an nonexistent page and will register as a 404 error, which is bad for SEO and UX.

ueno uses a unique and friendly 404 page to keep visitors engaged with their site.

Periodically check your pages for broken links. There are a number of tools you can use for this, such as the Broken Link Checker plugin for WordPress, Google Webmaster Tools, or various SEO auditing tools like ScreamingFrog.

Tip #10: Make Sure to Add Social Media Buttons

Social media buttons placed on your site are great for signaling to search engines that you’re a real company, but it also improves UX and user engagement.

By including share buttons or social media icons buttons that bring users to your profiles, you significantly improve the marketability of your website.

The best places to add these buttons are typically in the footer or within the contact page. Avoid placing them in the header.

iHeartRadio keeps their social links just below their logo in the footer. Perfect spot.

Just be sure to not overdo your placement.

Tip #11: Try Not To Include Links To Your Blog on Service Pages

When prospects are on your service pages, your goal is to convert them into a paying customer. By including links that send them off into long and involved blog posts, you distract the user from your main goal of earning a conversion.

Blog links may sound great because you can exchange internal link equity, but blog pages tend to have lower conversion rates due to the number of exit opportunities and distractions.

Tip #12: Don’t Link to Other Websites on Your Main Pages

External links (links that point to websites that aren’t yours) are good for blogs and helping your users learn more about something.

However, using them on your main pages such as the homepage, services, or about page can be bad for SEO and driving conversions.

By all means, link to external websites on your blog (within reason), but avoid it on your main pages.

Content Tips

Content is the third component of strong web design. The following tips will help you format, create, and place content on your pages.

Tip #13: Mobile Friendliness Is Key

A majority of all searches online are through mobile devices.

With more than half of the search market on mobile devices, a successful website requires responsive design (a design that fits on to any screen).

If your website doesn’t have a responsive design, you’re not going to succeed online. Even Google has reportedly favored sites with mobile optimization over ones without.

When building a responsive design, ensure all content is sized and centered properly, as well as ensuring tap targets (buttons, links, etc.) are clickable.

Here’s an example of strong mobile design.

Tip #14: Keep Your Site Easy To Read

Large words, long paragraphs, and runoff sentences are not helpful for driving conversions. They might make you sound smart, but it doesn’t help the bottom line.

Overwhelming your users will only push them off your website and into the hands of a competitor.

Keeping content simple while providing value may seem difficult, but it’s mandatory for any successful website.

Another deterrent can be your font choice. Cool fonts might be interesting and eye catching, but they can also be overwhelming and hard to read at times.

There’s no shame in using a common font that everyone’s seen before. Some of our favorites are Montserrat, Poppins, and Merriweather.

Having trouble creating quality content that ranks on Google? Contact us today for a FREE quote on our content marketing services!

Tip #15: Build a “Story Brand” Through Personalization

People want to work with people, not businesses.

One of the modern trends in creative branding is to craft a story through their campaigns. In marketing we call a company that uses this method a “story brand”.

A good way to start building your story brand is to include your company’s personal story somewhere on the site. The “about” section works just fine. You can also evoke your story in social media, content, and even the services you provide.

The goal is to be personal. With a good story and an approachable brand, people will resonate with what you have to offer.

Tip #16: Keep An Eye On The Competition

Competition is fierce in every market. Good web design is a great way to make your business stand out.

However, customers will often go to your competitor’s website to compare pricing, their services, and more. Your goal is to effectively combat your competition so that users won’t ever feel like they could get more value elsewhere.

The best way to do this is to keep track of your competition and take advantage of their ideas.

Obviously, you shouldn’t replicate them. But you should make content that’s better than theirs, match or beat out their pricing patterns, deliver similar services and then go above and beyond, and, of course, have a better website.

A good way to keep track of your competitors is to create a SWOT analysis sheet. Pick your top 5-10 competitors and do a complete analysis of their strengths and weaknesses, business model, and the keywords they rank for.

The best competitors are the most successful businesses.

Tip #17: Get Familiar With Widgets

Widgets are snippets of code that you can deploy to areas of your site. They add unique functionality and improve user experience (most of the time).

Some of the more common widgets are event calendars, calculators, weather reports, and more.

Adding these to your site can be a big bonus. Examples of improved user experience is letting customers book appointments directly through your site or letting users input their project needs into a calculator that gives them a projected quote.

Don’t get too crazy with widgets, though. The extra code can reduce load times on your site. Widgets can also be too distracting and take away from the flow of your site.

Many widgets are free, but you can also buy premium widgets online through marketplaces like Envato Elements for easy implementation.

Tip #18: Always Keep SEO In Mind

This is a big one.

A website not designed with Search Engine Optimization (SEO) in mind is a website that falls face-first into the ground upon launch.

Without SEO, a website has no chance of being discovered on Google, which makes the website useless.

So, how do you optimize your website for search engines?

It starts with researching the market, or, hiring an SEO agency like ours to do everything for you.

Here’s a breakdown of a simple SEO process:

Research market and competitors.
Conduct keyword research to start understanding what customers are looking for.
Create content and a strategy that is focused on hitting specific keywords, but without overdoing it.
Design a website that has a great user experience and features good content.
Conduct technical audits.
Make continual updates.

That’s a very simplified version of a basic SEO process, but it hits the main points of almost any campaign.

Value is the most important factor in determining search ranking. Websites providing the most value and markets correctly will win the highest rankings.

Need help with SEO? Contact us for a FREE SEO audit today!

Tip #19: Update Pages That Are Out of Date

Building off of SEO tips, keeping your web pages up to date with fresh, relevant content is a great way to keep your search rankings high.

When designing your website, plan for future updates. New information is constantly being released in every industry. Staying on top of the latest trends, news, and advice is a great way to keep old content fresh and valuable to your audience.

Tip #20: Determine Whether Your Site Needs a Blog

Contrary to popular belief, not every website needs a blog. Determining whether your business needs a blog or not is based on your goals.

If you want to maximize traffic and increase sales through your online channels organically, then a blog is definitely in your best interest.

However, if your website is mostly meant for directly linking to customers and clients and for advertising purposes, then it’s not necessary.

Reedsy’s blog page.

Whether you need a blog or not is also based on your ability to regularly post and update content. If you don’t have the time or a team/agency that can develop and execute on a content strategy, then having a blog will hurt you more than help.

No blog is better than a bad or lackluster blog.

Tip #21: Add Alt Attributes to All Images

While alt attributes, or “alt tags” may not seem like a component of web design. It’s actually central to it.

An alt attribute is HTML code that describes an image to search engines. It increases your SEO strength by ranking images on your website within platforms like Google Images. However, it also serves as a visual aid to those who need it.

Therefore, alt attributes are central to UX design in terms of accessibility.

Tip #22: Don’t Use Stock Photos of People

Stock photos are great because they can bring more life to your website. However, you don’t want to use stock photos of people.

Stock photos of people are often seen as ingenuine to visitors and lead to a bounce. It’s hard to build trust with your audience when you show them pictures of people who don’t work within your company.

The stock image on the left is a very good picture, but it may come off as ingenuine compared to the one of the right.

My best advice is to be authentic with your team’s photos. You don’t need full-scale production shots of your team in order to generate sales and leads. You just need to show that they exist and care about your customers.

Tip #23: Use Simple Language in Content

Any content on your website should be written in simple language. In order to market to the largest audience possible as well as win points with Google, you’ll need to write simplistically.

A way you can measure your language is by putting your content through the flesch reading test. This is a formula that grades how easy it is to read your text based on school grade levels.

The goal is to target a score between 60 to 80, which translates to a middle school or high school reading level.

You can use this readability tool to get your score.

Tip #24: Make Headings Clear and Direct

Headings are important for describing to the user what the content is about. Both users and search engines will read your headings, so don’t mess these up.

You’ll want to be specific with them, but also try to include keywords. Instead of writing “Our Services”. Write “Our Construction Services” or “Our Web Design Services”.

It seems subtle, but it can make a huge difference in interactivity, creating a unique brand, and empowering your SEO.

Mayple’s heading is unique and catching. This increases engagement.

This is a heading that is extremely basic and ineffective at grabbing the user’s attention.

Tip #25: Answer Your Customer’s Questions

Customers that land on your website have questions.

If you write a piece of content that doesn’t answer a question that your users are concerned about, then what was the point of writing the content?

Customers want to know what you can do for them, but depending on where they are in the marketing funnel, they could also want to know why they need your service or product in the first place.

When designing your website, fully evaluate the reasons for implementing every piece of content and ask yourself whether they answer the most pertinent questions your customers have.

For reference, here is a short list of common questions in the mind’s of users.

Why do I need this product/service?
What can you do for me?
What makes you better than the competition?
How much does it cost?
What should I expect from your product/service?
How do I get your product/service?

Tip #26: Place Calls-to-Action Throughout the Page

Most of your users will spend a lot of their time near the top of the page. However, stacking all your CTAs above the fold and just below can be detrimental to driving conversions. Most users won’t take action until they start scrolling through the page.

An analysis by Chartbeat shows that engagement peaks just below the fold, the area not visible when the user lands on the page. This means that the best place to start using strong CTAs is the section below the HERO.

But even that won’t win over all your customers. You still need to convince them that your business is the best choice.

Stash shows off more of it’s features below the fold with a simple CTA to follow.

The best approach: spread your CTAs out. This improves your chances of driving action and increasing conversions.

Just remember to always close pages with a strong CTA. Here are some examples of great CTAs.

Tip #27: Use “Loss Aversion” Tactics

Humans make decisions based on losses and gains. However, most of us are very bad at making these decisions unless we’re directly told what we can gain or lose.

This is where you can make a huge difference in your website.

If you’ve kept a user on your page long enough to reach the bottom, then at this point, they know what they can gain from you. But do they know what they can lose?

People are more likely to make an action based on understanding losses compared to understanding gains. Therefore, your website shouldn’t be skewed into what your customers can gain, but rather, what they can lose by not taking action.

Use sections of your website to describe why your customers need your service and what it means if they don’t buy from you.

Here are a few tips to use in your copy:

Talk about the cost of not using your product/service.
Talk about what your customers immediately gain.
Create a sense of urgency with limited time offers such as sales and discounts.

Tip #28: Include an Email Signup Form

Email subscribers is the most important metric for audience building and creating content that resonates. In marketing, it’s all about your email list.

Web design is a major driver in how many signups you acquire. There are a few ways you can build your list.

Make your email CTA stand out from other elements.
Use social proof by mentioning how many subscribers you have.
Tell the reader what they’ll receive by subscribing to your newsletter.

Here’s an example of a strong email CTA.

Tip #29: Avoid Long Paragraphs and Long Sentences

Whether you’re writing for a blog or writing content on an internal page, long paragraphs and sentences are bad for user experience.

Break up big sentences with periods and get to the point.

Condense long paragraphs into small bits of information and space out lines.

Word counts are important, yes. Google tends to rank pages with larger word counts higher than others. However, the content on those pages are well-made and easy to read. All of which drive user engagement, social shares, and higher click-through-rates (CTR).

Pro Tip: Try to keep each section (defined by a heading) under 300 words long. This increases SEO power and makes it easier for users to stay engaged.

Extra Tips

These are extra tips that might help you work out kinks in your design or add missing pieces to really make it stand out. Not all of these are essential for every site, but they can go a long way.

Tip #30: Choose A Domain Name That Reflects Your Brand

Some believe that if you purchase a domain name that has the location of a business in its name, then it will automatically rank the highest for that area.

This is false. Brands with any name can rank when the website is designed with a good user experience and quality content.

Therefore, you should buy a domain name that’s either the name of your brand, or, something very close to it (if the brand name isn’t available).

Tip #31: Create a Plan For Web Design Maintenance

A website that becomes obsolete or outdated will experience a massive decline in rankings.

To avoid getting on the bad side of search engines and to stay on top of your conversion rates, periodically perform maintenance on your website. This may include:

Updating content.
Reorganizing navigation.
Performing routine SEO audits.
Checking for broken links.
A/B testing for better conversions.
Reformatting your design.
And more.

A great way to stay on top of the latest trends is to regularly check what your competitors are doing and monitor any changes they’re making.

Reading up on the latest web design trends through industry blogs is a great way to stay ahead of the curve. You can find a top 50 list on detailed.com.

Tip #32: Inject Personality Into Your Design

As I said earlier, it’s more important to position your business as more human-like than corporate. Using your website’s design as a way to portray the personality of your business is incredibly effective.

Here are a few ways to do this:

If possible, make the navigational links in your header unique instead of the standard “about”, “services”, etc.
Use illustrations, non-stock imagery of your team, or unique backgrounds.
Don’t be afraid of unique coloring (just make sure the colors are easy on the eyes).
Use animations.
Experiment.

Tip #33: Use Backgrounds

You don’t have to use backgrounds for every section of your site. But you should definitely use some.

Backgrounds don’t have to be real images either. In fact, a lot of times backgrounds are just vector shapes that add more personality to your web page.

Take a look at our homepage, notice the vector shapes popping out of the side?

All our designer did was launch Adobe Illustrator, throw a couple circles on the canvas, and played with the angles until it looked decent.

It can be as easy as that.

Conclusion

A well designed website can go a long way for your business, in fact, it can be the deciding factor between making a sale or not.

But unfortunately, many business owners are missing out on new customers and clients because of poor design.

Designing a modern website is tough. There’s a lot to keep in mind and your competitors are always looking to steal traffic from you. But, with these tips, you should be able to start making strides and cut through the noise.

If you’re not sure about the direction your web design should take, or, you need someone to design and build your website. Feel free to contact us today for a FREE web design consultation and quote!