June 25, 2020
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.
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.
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:
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:
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.
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).
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.
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.
White space is the empty space around elements on a page. Here’s an example below.
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.
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.
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:
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.
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.
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.
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:
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.
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.
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.
Just be sure to not overdo your placement.
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.
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 is the third component of strong web design. The following tips will help you format, create, and place content on your pages.
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.
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!
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.
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.
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.
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:
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!
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.
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.
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.
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.
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.
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.
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.
This is a heading that is extremely basic and ineffective at grabbing the user’s attention.
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.
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.
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.
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:
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.
Here’s an example of a strong email CTA.
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.
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.
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).
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:
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.
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:
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.
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!
Don't forget to share this post!