10 Do's and Don'ts of Web Design

In today’s day and age, websites are all about speed. Not just literal speed, like how fast the page loads, but how fast can users find the information they’re looking for. A website honed in on good user experience (UX) will get users to relevant information in the least amount of clicks, while still providing an engaging “journey” for users to go through. In this post, we’ll talk about the do’s and don’ts of web design.

DO: Provide a good mobile experience

Responsiveness is king. With Google officially rolling out their mobile first indexing algorithm, a good mobile site is key. The basis of good UX design is to provide a similar experience across devices by serving users the same content (when possible). It’s also crucial to make sure that on different screen sizes, things don’t look out of place or bug out. The best way to test for these issues is to get your hands dirty and test out the site yourself, either on an actual phone or using your browser’s inspect tab.

DON’T: Make users wait for a page to load

With more people visiting websites via their phones, fast loading times are a necessity, plain and simple. Not everyone is connected to a lightning-fast WiFi network when they go to a website – sometimes they may be on 3G in the middle of nowhere. There are several factors that influence page speed, like your hosting provider, cache mechanisms, file sizes, and more. A quick way to audit your site is to use Googles PageSpeed Insights tool, which will give you feedback on which optimizations to run.

DO: Use headings and design features to break up content

The last thing users want to see is a giant block of text. Use headers, images, call-to-action buttons, and other design options to visually break up content. Separating content will keep users on the page longer and encourage them to read more of it. Users like to experience content in different ways, so experiment with different design concepts. Create a visual hierarchy so that users know what information is most important, and so they can easily scan the page if they want.

DON’T: Use a video that auto-plays with sound

While a video is a great way to break up content, don’t auto-play a video with sound. It’s pretty annoying to be scrolling through a page and then be hit with an auditory jumpscare. It’s ok to auto-play video, just give users total control over the sound.

DO: Write short, but engaging content

No one has the attention span to read every bit of copy on a website anymore. People tend to scan pages or let imagery and video drive their experience. So when it comes to content, less is more. Copy should be striking and concise, with enough punch to make an impact while getting your message across. Shorter content also works better on mobile for obvious reasons, and that’s where a lot of users are nowadays. A website that nails its messaging with minimal copy is bound to get good results.

The recently launched Clark University website is a prime example:

DON’T: Flood pages with ads or promos

This doesn’t apply to every website, but it’s still a good thing to keep in mind. When users come to your site, they want to see your content, not pop-ups about products they don’t want. Likewise, if your site is an e-commerce site, don’t bombard people with promos as they’re more likely to be distracting than helpful.

DO: Make your website accessible

We have a whole separate post on website accessibility, but the premise is that you want to ensure people with impairments or disabilities can use and navigate your site. The Web Content Accessibility Guidelines (WCAG) 2.0 lays out all the standards you need to follow so that your website provides the same experience to all users. More recently, web accessibility has become the subject of many lawsuits, so it’s best to stay ahead and avoid trouble.

DON’T: Make assumptions on what users enjoy

As web designers, we often get caught up in what we think is novel, and well, cool. Of course, everyone wants a unique animation, interaction, or effect that really wows users. At the end of the day, these cool effects may not always be practical. Do they help the user experience, or make them feel lost? You need to make sure you’re making design decisions based on analytics and metrics, not just novelty. Tools like Hotjar, Hubspot, and other all-in-one automation tools can illustrate user journeys on your website, meaning that your next design change can be an informed one. If there’s one thing we’ve learned as web designers, it’s that what we like is not always what the average person likes.

DO: Show and tell your unique story

Websites need to be a healthy mixture of copy and photography. Photos should correspond to the accompanying text and vice versa. Strong imagery and messaging paints a cohesive story of your brand, creating trust and authenticity – perhaps the two most important factors for driving conversion.
The IMS homepage does this wonderfully with an original photo and authentic message.

DON’T: Overuse stock photos

Stock photos have their place in business websites, but you don’t want to go overboard. When possible, you want to tweak stock photos to match your brand, so that they don’t seem overly artificial. The problem with stock photos isn’t necessarily quality – it’s that they can be uninspiring and impersonal, and therefore, ineffective. As mentioned in the last point, real photos portray authenticity and make your company seem more legitimate, so use them whenever you have the chance.
While the industry has many nuances, these are some basics do’s and don’ts of web design that you should follow.