What You Should and Shouldn’t Do When Designing A Website

You know that web designers must make their designs enjoyable and useful. It can be overwhelming to design websites even with the most advanced web designing software. To simplify this task, here are some things you should know.

The do’s

1. Your interface should be consistent

Good UX design principles include a consistent interface throughout the product. Your website’s overall design should be consistent across all pages. A consistent look and feel can make a difference in usability and UX.

A tip for designers: Make your e-commerce design singapore usable before anything else. Consistency can be a double-edged sword. Your website will look inconsistent if it isn’t properly designed from the beginning. Make design accessible first and then make it consistent.

Navigation is the foundation of usability. It is the most important interaction method on the Internet. It is essential to ensure that your visitors find the information they need on your website navigation.

Practical Tips

  • Use top-level navigation to access the most important navigation options. Limit top-level navigation to seven choices – The maximum number of objects an individual can store in their working memory is 7 + 2 . Create sub-navigation that allows for clear categorization.
  • Clear labels are needed for navigation options. To make it easier for visitors to understand menu options, use familiar words.
  • Shorten the time it takes for users to reach the destination. Your navigation should be designed so that visitors can get to the destination they desire with as few clicks as possible. Remember the three-click rule when designing a website. This means that visitors should not be more than three clicks from the information they seek.
  • Add navigation options to your site’s footer The footer is where visitors will find contact information and navigation options.

3. Change the color of your visited links

The navigation process is aided by links. Users could accidentally revisit the same pages multiple times if visited links don’t change their color. It is easier to choose where you want to go next by knowing your past and current locations.

Do. Visually differentiate visited links.

4. It should be easy to scan your pages

Users are more likely than not to read every page on your website when they visit it. Visitors may scan pages on a website to find the content they need or complete tasks. You, as a designer can help them by creating a visual hierarchy. Visual hierarchy is the arrangement of elements that indicates their importance. Where the eyes should be focused first, second, and so on.

Practical Tips

  • Do not create walls of text. Break down your information into smaller chunks to make it more visual. Breaking down walls of text with bullet points or headers.
  • Give more visual weight to important elements. So that visitors can see important elements like login forms or call-to-action buttons, make them focal points. Different sizes and colors can be used to emphasize elements.
  • Do. Mailchimp makes the most important information on a page ━ call-to-action buttons ━ stand out.
  • Use natural scanning patterns. The majority of people in Western countries read from the top to the bottom and left to right. Your visitors will learn a lot if your design is not in line with this standard. Websites that are well-designed usually present their content in an “F” or “Z” reading format.
  • Use a grid layout. A grid layout makes it easy for users to understand and read the information on the page.
  • Do. Use grid layout when designing web experiences.

5. Take content very seriously

Your website’s design is as important as its copy. 95 % of the information found on the web comes in the form written language. Your website can be beautiful, but it is nothing more than an empty frame with no good content. A great website must have both great design as well as great content. Designers are responsible for ensuring that the design complements and enhances the content.

Practical Tips

Make sure that the text on your website is relevant. Inadequate text can confuse visitors. Try to write copy that will make each line of text valuable for your visitors.
Don’t use jargon. Your website information should be clear and concise for easy understanding. It is a good idea to write for everyone by choosing words that are easily understood by all readers.

6. Check your website for errors

An error can easily ruin a great piece of work. These are some common issues to be aware:

  • Be aware of dead links . A frustrated user may click on a link and get a 404 error page.
  • Search for typos on your website.
  • Check that all media content loads correctly. No broken images or videos.

7. Limit the choices

People’s decisions are affected by how many choices they have. The more options they have, they will take fewer actions. If you give your user too many choices, it can make them think too hard. It’s better not to give too many options. This will reduce interaction chances.

Do. Facebook uses a step-by-step process when asking personal information.

8. Encourage users to scroll

Scrolling takes users deeper into the page, makes them spend more time on it, and increases the likelihood that they will convert. Scrolling allows users to go deeper into the page and makes them more likely to buy, subscribe to a newsletter or get in touch with you. Even though people scroll the page as soon as it loads, the content at the top is still important. Visitors expect high quality content at the top of the page. Scrolling is a common practice, but only when the information above the fold is interesting enough.

A tip for beginners: The page’s top content sets the expectations. Users will browse more pages if they find high-quality content on a page.

9. Label buttons according what they do

Any actionable interface element label should always be tied back to the intended purpose. It will make users feel more at ease if they know what the button does. Insufficient information is provided by vague labels, such as “Submit”, or abstract labels like the one below.

Don’t. Make people wonder what an interface element does. Credited to UXMatters
Do. Make it clear what will happen when users click a UI element. “Claim Your Free Trial” is a clear label for a sign up form. Credited to Treehouse

10. Make it look like everything is working

Think about the way buttons and other interactive elements communicate affordance. The old saying “form follows function” applies to interactive elements. Users are told how an object looks by the way it looks. Visual elements that appear like buttons or links but aren’t clickable, such as underlined words but not links or elements with a rectangular background that aren’t buttons, can confuse users.

Don’t. Is the orange box in the top-left corner of the screen a button? No, but the shape and label make the element look like one.

11. Your website should be responsive

There are over 5 billion web browsers today. Visitors can access your site via a variety of devices, including a tablet, smartphone, tablet, phone and music player or even a watch. UX design involves ensuring that all information is displayed correctly on every screen size, regardless of how it is seen by the visitor.

Do. Designers have to adapt their designs to various screen sizes. No matter how big a screen is — from a phone to a watch, or a tablet to a desktop — the site should present information in a clear way.

Practical Tips

Make important information easily searchable. Mobile users browse mobile differently to desktop users. They are searching for specific information, such as contact information and the price of a product. This information should not be missed.
Adjust the size of interactive elements based on the screen. Mobile users tend to scroll and tap with their fingers.

12. Test your design

Although you may think your design is great, without real user feedback, it will not be able to tell you how effective it is. It is important to observe how people react to your design. It doesn’t matter if only one or two users interact with your site and share their opinions, this will give you valuable insights that you might not have otherwise.

A tip for Analytics Web analytics can be a powerful tool that will help you identify areas of your website that need extra attention.

The don’ts

1. Do not make users wait for the content to load

User experience is a key factor. Loading times are critical. Technology advances rapidly, making us more impatient. Today, 47 per cent of users expect web pages to load in 2 seconds or less. Visitors might leave a site if it takes longer to load. When building a web app, speed should be your top priority.

The faster your site, the better experience is. Image by Google.

Practical Tips

  • Avoid empty pages when loading . If loading takes a while, you might consider showing a portion of the content along with visual feedback such as a loading indicator.
  • Optimize images Large background images can take a long time to load. Optimizing your images can dramatically reduce loading times.
  • You can measure the performance of your website right now. Google’s PageSpeed Insights tools and Think With Google tools will help you to identify problems with your website’s performance. They can also suggest solutions.

2. Do not open an internal link in new tabs

Users expect different behavior for external and internal links. All internal links should be opened in the same tab. This will allow users to use “back” buttons. You should warn users before opening external links in new windows or tabs. This could be in the form of text that is added to the link text. “Opens in a new browser”

3. Use only one typeface

It’s tempting to choose a variety of fonts when building a website. You could use five to six different fonts, or even your own. It’s better not to succumb to that temptation. Too many font styles can be confusing, distracting, and borderline irritating.

Don’t. Too many fonts can conflict with each other and overwhelm your visitors.
The limit of 3 fonts per page in is a common recommendation. Think about how you can make typography more powerful when designing websites.

4. Use only a few colors on your website

It’s important to not use too many colors in design, just like typefaces. The balance of a design’s color scheme is important. The more colors you use, it will be harder to achieve balance. Too many colors can be confusing and it will lead to confusion for the person who is viewing your design.

Don’t. Use too many colors in design. Image by Pine-Sol.
It is better to limit the use of color to just a few and to be consistent throughout your website, unless you are trying to highlight an important section with color.

A tip for the novice: Consider what emotions you wish to instill in your visitors. The best way to choose the right color scheme is to know what emotions you are trying to communicate. If you are promoting meditation products on your website you will not want a loud and bright color scheme.

5. Do not show auto-pop-ups to early

Many websites display pop-up boxes asking you to sign up as soon as they appear on your page. Pop-up windows are one of the worst things a designer can do for someone who visits your site. Pop-ups can be disruptive by their nature and users will often close them before they have read the content.

Don’t. The first thing people see when they visit The New York Times website is a popup with promo ad.
Handy tip: Timing your pop-ups. You must demonstrate value before asking visitors to complete a task. Keep the box from appearing until the visitors reach the end by ensuring that the box does not appear. Read all content or remain on the site for a while.

6. Use unique photos of people.

Images that feature human faces are an effective way to engage your users. Our brains are wired to pay more attention to faces. It makes us feel connected to other people when we see their faces.

Many corporate websites are known for using insincere photography to build trust. Usability testing shows that photos used only to enhance the design often make it less valuable and can even harm the user experience.

Don’t. Inauthentic images leave the user with a sense of shallow fakery.

7. Promotion shouldn’t be a hindrance to your show.

Too many ads or promotions on a page can make it difficult for users to complete tasks and overshadow the main content. Too many ads will make it difficult for users to see the main content. You will experience a sensory overload which will eventually increase your bounce rates. You should also be aware that users are often blinded by advertisements that look like them. This phenomenon is called banner blindness.

Don’t. Ads can distract visitors from the main content and undermine a design.

8. Do not play background music.

Background music is not a good idea for all websites. Unexpected music and sounds can be annoying and possibly cause problems. People might be visiting your website at work, in public places, or close to someone who is asleep. In these cases, unanticipated music and sound could make them leave.

Autoplay videos that are embedded into a block or content can also cause irritation, similar to background music. You should use them sparingly, and only when necessary and expected.

Use Give users control. You can set music to muet by default. However, users can turn it on if you click.

Do. Facebook videos are set to autoplay, but no sound will play unless users show that they’re watching the video ━ i.e. by interacting with the video.

9. Don’t hijack scrolling

Scroll hijacking refers to when web designers alter the scrollbar to make their site behave differently. Hijacked scrolling can be very frustrating for users as it takes control from them and makes scrolling behavior unpredictable. It’s best to avoid scroll hijacking when designing websites. Instead, let the user navigate the site and make their own decisions.

Don’t. Tumblr’s signup page uses scroll hijacking.

10. Don’t use horizontal scroll

Some designers use horizontal scrolling to make their websites stand out. Horizontal scrolling is one interaction that gets negative reactions from users. Many users don’t realize they can scroll horizontally to find content. Most people are used to scrolling down and don’t look left or right on websites. They simply overlook content that can be found by horizontal scrolling.

Don’t. Visitors will have no idea that they should scroll horizontally, especially when there are no visual cues. Image by axel part.

11. Do not sacrifice usability in the name of beauty

It doesn’t matter how beautiful a design may be, it shouldn’t interfere with the user’s ability access content and interact with websites. A common example of bad UX design is the use of light grey text and light backgrounds. This combination can make it difficult for readers to read the content. Avoid having a background with too many colors or a low contrast.

Don’t. Low contrast text is always a bad idea.

Tip: Make sure to check the contrast ratio. Contrast ratios are a measure of how different one color is from another. Color Contrast Tester can help you determine if your color contrast is sufficient in just a few clicks.

12. Use blinking text for ads

Flickering flashing effects are not recommended for animations and ads. Flashing or flickering content can cause seizures in people who are sensitive and it is likely to distract regular users.

Conclusion

People expect a great user experience when they interact with websites. They will move on to the competition if you don’t meet their needs. You should always think about the visitor when designing and make sure the experience is as enjoyable as possible.