Learn / Guides / Web design guide
11 web design rules to follow to create an amazing site
Rules are made to be broken, right? Not when it comes to web design. Using established web design principles that are customized to your unique business needs will help you create a site that lets users accomplish their most important tasks.
Last updated
27 May 2022
This article walks you through the 11 key web design principles to follow: by putting them into practice, you’ll discover just how effective your website can be in reaching your company and user goals.
Design the website your users want to see with Hotjar
Hotjar's Ask products collect feedback from real website users so you can learn how to improve your site.
11 rules to follow when designing a website
Follow these trusted design strategies to prioritize important elements and create a website that gives your users exactly what they need.
1. Have a purpose
Clearly define your website’s purpose before you start the design process: the why behind your site should be the driving force when deciding what features it needs.
Know what your website is designed to accomplish for your users, and design and optimize your site around that idea. Prioritizing the why helps you create a website that attracts traffic and retains users by generating customer delight.
"One of the most common mistakes you see is a person or business creating a site that seeks to serve one purpose but that’s designed to be doing something entirely different.
"Think about the differences between the needs of a fashion retail website vs. the needs of a website that publishes data and articles.The ecommerce site will need high-resolution images, videos, and other rich content that loads quickly, while the latter will need well-structured information architecture so information is easy to access both for users and search engine bots."
2. Know your users
Your website is for your users. To create a fantastic user experience (UX), start by deeply understanding them. If you’re creating a website from scratch, use tools like UXPressia and Hubspot’s Make My Persona tool to envision the type of user you're designing for.
Your user should be at the center of all your web design decisions. If you don’t know your user, you won’t know which website elements to prioritize. User research techniques like envisioning your ideal customer persona and asking for real-time feedback will ensure you create something that serves your users’ needs.
If you already have an existing site or prototype, use Hotjar Feedback and Survey tools to ask your website visitors questions to better understand what they need, like, and dislike. Then, use these insights to make changes to your site layout and usability.
3. Create a smooth user journey
Your website should make visitors’ lives easier, not more complicated. Users will lose interest if they can’t navigate intuitively when they land on a page, which is why you need to make the user journey clear and easy to follow.
Design straightforward, streamlined navigation menus to enhance the user experience, which will help you decrease your bounce rate and boost your click-through rate.
You should also include clear and actionable calls to action (CTAs). According to Hubspot, hyperlinked anchor text CTAs can increase conversion rates by 121%. Make sure your CTAs stand out from the rest of your content, so they can help your users seamlessly accomplish their jobs to be done.
4. Keep it simple
Less is more when it comes to website design: make sure you don’t cram too many visual elements onto one page and stick to a uniform color scheme and one or two different fonts.
When your website has a streamlined design, it’s easier for users to stay on task and accomplish what they came there to do. To prioritize simple, functional design, ask yourself what purpose every element serves; if it doesn’t improve the user’s experience and journey, it’s likely unnecessary.
Web design principles are intertwined: it’s much easier to keep your website simple once you’ve clearly defined its purpose and understood your users.
5. Be consistent
While not every page of your website will look exactly the same, all pages should have a consistent look and feel. Consistency is one of the most important web design best practices.
To put it into practice, use the same color scheme and fonts, similar page layouts, and images that follow a uniform aesthetic.
For blogs, make sure you format all posts similarly for a consistent look and enjoyable user experience.
For ecommerce websites with several different visual features, keep your page structures similar across your site. You should also shoot your product images with the same background and lighting, even if that means updating old images as new ones are uploaded. You can see a great example of this on the sustainable clothing brand Kotn’s website.
6. Prioritize visual hierarchy
Visual hierarchy is a key element of great UX design. Organize design elements so that users are drawn to each element in order of importance.
To achieve a strong visual hierarchy on your website, use focal points like large CTAs, headings, and images to attract your users’ attention toward the most relevant elements. Ask yourself where you want your users to click, and make it easy for them to do so.
You can see a great example of visual hierarchy on the Zendesk home page. Large text makes the page’s value proposition and headings more noticeable, and CTAs stand out from other elements on the page.
7. Publish quality content
Your content is the pillar of your website. Without quality content, your website won’t provide value to users or rank high on search engine result pages (SERPs). It’s crucial to invest in good copy and content both for users and search engine optimization (SEO).
The key here is to create content that's beneficial to your users within a strategy that presents your company as an expert in the industry. You can then link them to other relevant pages on your website—internal linking is not only helpful for the user journey but is also critical for SERP rankings.
"Many websites have blog posts that are stand-alone, without linking to relevant service pages within. Not only does this limit their potential sales, it also has a negative impact on rankings, as internal linking is a key SEO practice. The solution is to develop a content strategy closely related to your company's main services, that positions your company as an expert in the sector and provides additional business guidance to users."
8. Design for multiple devices
As of 2021, over 90% of internet users go online with mobile devices—so optimize your website for all users and devices.
When designing the mobile version of your site, focus on promoting a positive UX:
Optimize images so they load quickly
Check that CTAs are just as prominent as they are on your desktop version
Ensure navigation is easy and intuitive on a mobile device
Make text large enough for users to comfortably see on a smaller screen
Pro tip: use Hotjar's Observe tools to get actionable product experience (PX) insights. Session Recordings and Heatmaps can show you where users of different devices are getting stuck or dropping off, so you can see which website elements you should update.
9. Be accessible and inclusive
Your website should be designed with every type of user in mind.
This means making your website accessible for users who could have difficulty navigating—someone with visual impairment, for example. Get started with accessible design by writing descriptive alt text for images, enabling keyboard navigation, making sure text is legible and high-contrast, and optimizing code for screen readers.
Prioritize making your website inclusive for users of all backgrounds and identities. Use inclusive language and diverse images to ensure that everyone who visits your page feels welcome and comfortable.
While we can’t claim to be experts on accessible design, we’re always working to make our own site more inclusive and accessible. We believe accessibility is an important web design principle that everyone creating a website should strive to follow.
10. Test frequently
It’s important to test your website in its early stages, but it’s also crucial to keep testing once you’ve already launched. Through regular testing, you can constantly improve the user experience by removing blockers and finding new opportunities to delight your customers.
Use tools like Hotjar Heatmaps, Recordings, and Surveys to carry out qualitative and quantitative research and gain insights into user behavior. This will help you discover which aspects of your site are drawing users in and where they’re dropping off.
By seeing how visitors interact with your site, you’ll learn which design elements work well (and which don’t) and spot bugs that are negatively impacting the user experience.
11. Be unique
While it’s helpful to reference web design inspiration and examples when creating your website, it’s equally as important to be unique and let your brand and its message shine through.
Don’t copy other websites that seem to be working without considering your specific business and user goals. Just because certain design elements work for someone else’s users doesn’t mean they’ll work for yours.
Maybe a particular design layout, like an infinite scroll homepage, is a popular trend that every website seems to be hopping on. However, before adopting web design trends, ask yourself—and your users—whether infinite scrolling will actually improve your UX.
Prioritize original design and your website will stand out to the people it matters most: your users.
When you should break web design rules
While it’s important to draw on established web design rules, there are certain situations in which you can (and should) break them.
At the end of the day, you know your website and the purpose it needs to serve better than anyone. If you know that your users prefer seeing many different elements at once—even if it means a ‘busy’ design—give them that. And if using different color schemes on different pages works for you (and more importantly your users), don’t worry about ‘breaking’ a web design rule.
The principles you can’t stray from are the ones that are truly central to the user experience, like knowing your purpose, understanding your target audience, and designing a website that’s easy and enjoyable for all users to navigate.
"All design is subjective. Just because you have a 'beautiful' design, it doesn't cover for other mistakes. Don't forget there are countless 'ugly' websites on the internet that are extremely successful and profitable—most likely because they focus on user intent, site structure, navigation, and clear content."
Nail your website design
Tried-and-tested web design principles give you the guidance you need to build a website that exceeds your users’ expectations. Remember, your website is for your visitors, so they should be at the center of every decision.
Be thoughtful, user-focused, and creative, and you’ll create a website that will garner repeat visitors and loyal customers.
Design the website your users want to see with Hotjar
Hotjar's Ask products collect feedback from real website users so you can learn how to improve your site.
