Friday, May 6, 2022

Latest Posts

Top common UX design mistakes by beginner UX designer

Top 5 common UX mistakes the main goal of a selling site is to create an engaging user experience that helps visitors complete their tasks and increase conversions. Web designers often focus solely on aesthetics and rely on common patterns and popular trends to take the shortcut. The danger with this is that using any new tactics can lead to severe mistakes in UX.

There are many examples of web designers choosing to focus only on the visual appeal of a landing page and sacrificing usability. They hypothesized that the design wow effect itself would be powerful enough to drive conversions. However, as a result, only bounce rates grow.

The key to using templates and web design trends effectively is finding a balance between aesthetics and usability.

Mistake 1 UX Huge Fixed Header

1 of top 5 UX design mistakes. On the Internet, more and more often, you can find sites with sliders for the entire first screen, tall “sticky” headers, and navigation menus that take up significant space: Fixed elements can be beneficial, but there are a few essential things to keep in mind when using them:

“Sticky” menu can be inconvenient

A typical UX mistake is having too large a sticky navigation header filled with content. As a result, there is extremely little space for the main content, and site visitors have a suffocating, claustrophobic experience. Whether you have a fixed header or not, browsing should be comfortable for visitors.

It does not take into account the experience on mobile devices.

Sticky menus can speed up interactions on large, high-resolution computer screens, but what about mobile screens? Today, a significant number of visitors access sites from mobile phones, so a fixed header may not be the best idea. Fortunately, responsive web design techniques allow you to make different decisions for different platforms and leave the “sticky” navigation header only for desktop browsers.

On The Coffee with a Cop, the header is also fixed. But it is much smaller – less than 80 pixels in height: This header is probably the right solution for high-resolution screens as it provides more efficient navigation. The title is also fixed on screens with lower resolutions but takes up a significant amount of space.

  It does free up significant space.

Mistake 2 UX Thin, Desaturated Fonts

2 of top 5 UX design mistakes. Today, the use of thin, desaturated fonts is widespread in many mobile applications and websites. With the advancement of screen technology and improved rendering, many designers have begun to use them to have an elegant, clean and fashionable look. However, thin fonts can cause usability issues and therefore harm the user experience.

Thin type can seriously affect the readability of text. Not all displays are good at rendering thin fonts. For example, some thin fonts are difficult to read on iPhones and iPads with Retina display.

Quote from Apple’s Interface Guidelines:

“First of all, the text must be legible. If users can’t make out the words in your application, then it doesn’t matter how beautiful your typography is. “”

While mobile apps are mentioned here, the same principle applies to websites. For good usability, legibility is required, not optional.  Here are some common typography-related UX mistakes:

Use thin and desaturated fonts because it’s trendy

The type should look not only pleasing but also be legible. To achieve the desired contrast and clarity, you need to find the optimal size, saturation, and color combination. It is best to test the site on different devices and screens. This leads us to the following common UX mistake:

Lack of legibility check on all major devices

Thin, desaturated fonts may look good on expensive calibrated monitors by many designers, but the average user sees them on cheaper, lower-quality displays, and this is important to consider. Your best bet is to check how the fonts look on all major devices: desktops, laptops, tablets, and smartphones.

For example, when testing a mobile design, ask participants to visit the site during the daytime — real users will not always have ideal lighting conditions for browsing. For better readability, set a bolder font on the mobile version.

Mistake 3 UX Low-contrast text

2 of top 5 UX design mistakes. In addition to the already discussed thin fonts, there is an even more significant pitfall: the combination of thin font with low contrast. This is due to the popularity of minimalism: it is believed that by reducing the difference in some areas, the design will look more “minimalist.”

This seriously hurts readability and, as a result, the user experience. Experienced designers should do their best to avoid this: 

The low contrast Mistake in the main text

Cool Springs Financial uses a thin version of Helvetica for body copy on its website. Despite its elegant and aesthetic appearance, it isn’t easy to read on some platforms. While low contrast is not always a bad thing, it can negatively impact the usability of a website by making the text difficult to read.

Lack of text contrast testing Mistake in UX

There is an excellent Colorable contrast checker tool. It can use it to set the correct contrast for text according to the Web Content Accessibility Guidelines. After that, you can adjust the rest of the colors on the site and run quick user tests on different devices to make sure the text is readable.

Read More about technology.

Mistake 4 UX: Grabbing scrolling

1 of 5 top mistakes of UX Scroll hijack is another trend that is gaining popularity on the web. When site visitors start scrolling, the scrolling is intercepted, and people move to the next section. Users cannot control scrolling and predict page scrolling behavior on sites, which quickly leads to confusion and frustration.

What is suitable for some can hurt others. For example, many web designers follow Apple’s lead, where you can see capture scrolling, parallax effects, and high-resolution product photos. Apple has its target market, unique concept, and exclusive content. But since every landing page has its challenges, it also needs to have solutions tailored to those challenges.

Lack of testing with real users

To avoid UX design mistakes, issues when borrowing UI trends or patterns. It’s best to test the prototype with real users. Simple usability testing will show, for example, whether it is possible in your case to implement grabbing scrolling or not.

Tumblr, a popular personal blogging platform, uses grab scrolling on its homepage. While this can be risky, it can assume that they know their target audience well and the advanced user experience they want to deliver.

The long page is split into multiple sections, distinguished by its vibrant, rich colors and prominent dotted scrolling indicators on the left side of the screen. As a result, the Tumblr homepage is perceived by visitors as a large vertical carousel over which they have control rather than as a failed experimental website. 

Mistake 5 UX Carousels

5 of top 5 UX design mistakes. Carousels — slideshows for viewing various content — are pretty standard on the Internet, especially on landing pages and home pages. According to the Nielsen Norman Group:

This can negatively affect conversion rates as visitors may overlook your offer. 

The carousel can be useless for users.

The carousel draws attention with its large, bright images. The problem is that carousels did don’t have any added value and are just for decoration. An easy way to figure out if your landing page needs a carousel or not is to articulate three benefits of a carousel for your visitors. If you cannot do this, then the carousel is of no value in your case.

Poorly visible arrows “”back”” and “”forward””

If the back and forward arrows are difficult to detect, important information in the carousel may remain hidden from the visitor. The controls should also be mobile-friendly.

Frequently, scrolling indicators in the form of dots are used instead of arrows to switch slides to carousels. However, they often have low contrast, poor visibility, and a small click/click area. All this can lead to poor UX and a quick visitor leaving.

The Floresta Longo Foundation website home page has an auto-slide carousel. The back / forward arrows are small and transparent, making them difficult to detect and click on. There are no indicators or descriptions. The images are not links and serve purely decorative purposes. While this type of carousel may be valuable in attracting visitors, overall, it leaves a lot to be desired. 

Conclusion

In the last why, we mentioned top 5 common UX mistakes. Blindly following trends can lead to severe UX errors. Web designers should listen to their experiences, audiences and innovate only after testing with real users to avoid hurting conversions.

Look for the balance of aesthetics, efficiency, and usability to identify the practices that have received the most acceptance among users.

You can develop a very cool color scheme, fancy scrolling animations, or the most fantastic parallax effects, but if the user experience suffers. As a result, visitors will quickly go to a competitor. As all we know UX matter in website or Apps development.

Latest Posts

Don't Miss

Stay in touch

To be updated with all the latest news, offers and special announcements.