12 Things Not To Do On Websites In 2023

The perception of the site by the user determines whether he can perform the target action on it: place an order, read an article, share information with other people, and so on. The site should be not just beautiful, but convenient and technically optimized. In the environment of developers and designers, trends and anti-trends regularly appear, where it is shown how to do it is no longer necessary, even if it was relevant before. Let’s focus on anti-trends to understand what not to do as a web designer and developer.

They are recommended to be avoided for various reasons. Some of the points discussed are not recommended from the technical side, others in 2022-2023 will look unattractive and old-fashioned, with others there may be unnecessary difficulties in implementation.

Anti-trend 1: Icons and logos are not in SVG

The SVG format is highly recommended for all vector components on the page. First of all, we are talking about icons and logos, but the recommendation can also be relevant for illustrations. The fact is that SVG components can scale infinitely without losing any quality. This way you will be 100% sure that the icons on the site you have developed will look equally beautiful on an HD monitor, as well as on a 4K or mobile screen.

It is highly desirable to foresee this moment at the design stage. Ask the customer for all the necessary graphics in SVG format, or draw it, or convert what was given to SVG. Many icons, if they don’t have some unique design, can generally be found in text format, such as on FontAwesome. If possible, it is better to use font icons. They are in no way inferior to SVG, but they are not suitable in all cases.

If you are a developer, and a web designer sent you a layout with icons in raster formats, then convert them or ask the designer about it. In Figma, for example, most icons can be exported to SVG format in just two clicks:

  • Select the desired object and open the “Export” section in the right panel.
  • In the export settings, specify the SVG format, as shown in the screenshot.

Thus, you can easily and without loss of quality export almost any graphics to SVG format.

Anti-trend 2: Misuse of stock photos

There is nothing wrong with stock photos in general, but only if their placement is appropriate. For example, you need to make a background for some section. If you pick up a normal stock photo there, then everything is ok. However, if the entire site is filled with stock photos, then the user may develop distrust of the company, especially if the photos are selected incorrectly. For example, if a site sells shovels for summer residents somewhere in Siberia, then posting photos of happy American farmers on it would not be entirely appropriate.

In such cases, either ask the customer for additional photos of their product, or try to look for a more suitable image, and moreover, on several stocks. Ideally, of course, to refuse to use stock images altogether, but this is not always possible.

Here’s what you definitely shouldn’t do:

  • Put stock photos absolutely everywhere on the page. This creates a stereotyped effect – the visitor subconsciously believes that he has already seen these photos somewhere, therefore, there is less trust in the site.
  • Put stock photos of low quality or with extraneous logos. This immediately makes the design cheap and kills all user trust.
  • Use stock photos if the site sells some unique products.

Anti-trend 3: Completely static sites

It refers more to one-page or small sites. You can have a great modern design, but the lack of any animation or its minimum makes the site wooden, boring and out of date. The finished product will look more like a picture with buttons than a full-fledged product. If you want to make interaction with the interface interesting, then add animations to the site.

It is not necessary to animate every interface element. It would be rather redundant. However, animation of individual elements, hover when hovering over buttons and important blocks, smooth scrolling, animation when switching – all this should be present. Even if the layout from the designer does not say anything about animation.

Implementing a button color change on hover, the appearance of block shadows, smooth switching for menu items, and so on is quite easy. To do this, you can use ready-made animation blanks – they can be very quickly integrated into the layout, plus, they have already set animation templates. You only need to choose the right one.

Anti-trend 4: An abundance of animation

This is another extreme. When literally every element on the site is animated, it becomes problematic for the user to interact with the interface. Plus, the site takes longer to load. In this case, reduce the amount of animation.

Still too much animation is inappropriate to use on complex sites, like online stores. Complex menus and directories give dynamics there, so it is recommended to do with cosmetic changes like adding a hover effect on buttons, smooth page scrolling. Animating a large online store, firstly, is long and difficult, and secondly, it will have a very bad effect on page loading speed.

It is also recommended to refuse excessive animation on blog pages where informational articles are posted. The user wants to read the article, and not wait for the animation of blocks with text and images to load. On such sites, it is better to do minimal animation in the menu, on the buttons.

Anti-trend 5: Leave designer logos

Now the direction of zero-coding is actively developing, when sites are created on special platforms-constructors. There is nothing wrong with that, some simple landing is really faster and easier to do on the constructor. The problem is that many developers forget or deliberately do not remove the designer logo from the site design. Depending on the rules of the platform, the logo can be placed both on certain design elements and be fixed in some section, for example, in the basement.

The presence of such a logo in the design immediately makes the design “cheap” and causes some distrust in the company. On most builders, the logo can be hidden by purchasing a minimum monthly subscription.

Anti-trend 6: Over-optimized images

The days when it was necessary to try to reduce the weight of the image by any means possible have already passed. Most potential visitors have either a 4G connection or good Wi-Fi, which are quite capable of quickly processing several megabytes of images. You no longer need to think about how to optimize pictures – you cannot be afraid to put the originals. This way you will save time during the development process, as well as get rid of the situation when there are “squeezed” images in the design.

Exceptions to optimization can only be made for very heavy photographs that are taken with professional photographic equipment and have a high resolution. For such, it is better to really try to reduce weight with the help of third-party optimization.

Antitrend 7: Windows with online consultants

They are too intrusive and are often placed on those pages where they are not particularly needed. First, it is annoying and distracting for the user. Secondly, it creates additional difficulties in the development and maintenance of the site. The main problem with such windows in most cases is that they are useless. The visitor writes his question there and receives a standard reply with a request to leave a contact so that they call him back. This is very annoying, especially if even after the user leaves his contact, they don’t call him back, but they start regularly bombarding him with spam.

Windows with online chats and quick consultations are better not to do at all. Most people have learned by experience that they are useless and only annoy the visitor. An exception can be made if the site does have online support that is ready to respond to the user in a real-time online chat.

Anti-trend 8: Use of 3D cartoon graphics

A year and a half ago, the use of cartoon graphics in design was a trend. Now most large companies and start-ups are moving away from this. Template 3D models have already gotten fed up with everyone, and such graphics often look childish. Plus, with the arrangement of 3D elements in the layout, some difficulties may arise if a novice layout designer works.

If you still need to use 3D elements in a design project, then it is better to order them separately, and not take them from free stocks. It is also not necessary to design them yourself if you do not have the appropriate skills to work with special programs. So you can create a truly unique and sought-after website.

Anti-trend 9: Use a multi-color palette

Sometimes, of course, it can be used, for example, when you need to create a site in a retro style. However, this is more the exception than the rule. In other cases, such a design will look strange, and sometimes even cheap. Plus, you will get a portion of misunderstanding from users. Even if you are faced with the task of making a design in some kind of retro style, then the color palette will have to be chosen wisely. It is better for a novice web developer to entrust the design of such projects to specialists.

In a normal situation, it is better to stick to a palette of 3-4 colors. Two main ones, for example, black and white. Two accents, which highlight buttons and important places in the text. You can find several matching colors with the help of special services. For this, it is not necessary to have some kind of art education. For example, Adobe has a great color matching service. There you can customize several colors and options for their hierarchy.

Antitrend 10: Hide core functionality for unregistered users

Most of the functionality of the site should be available to any user, even those who have not created an account within the site. An exception can be made for social networks, but it is unlikely that you will often have to deal with their development. In other cases, most of the functionality should be available either without registration, or the user must know exactly what features the site will provide after registration. For online stores, this is, for example, the ability to add products to favorites, place orders.

However, if there is such an opportunity, then it is better to remove the need for registration on the site altogether. The less actions the user needs to do to get what they want, the better, and the need to log in / register is additional gestures. In addition, the registration process needs to be implemented from a technical point of view – to make up forms, set up and connect databases. This is also additional time that will have to be spent on developing the site.

Anti-trend 11: Using old iPhone patterns in design

The iPhone does look nice and premium, but only if it’s not an outdated model. If you need to demonstrate something on your phone and place a mockup with an iPhone, then try to choose mockups with new models. There are many of them freely available. Showing an iPhone with a button on a new site that has been out of production for several years is a little strange. It will seem to the user that the site and the company he represents are out of step with the times.

Antitrend 12: Incorrect work with VPN

This anti-trend refers more to the developers who set up the security of the site. Try not to prevent users from other countries from accessing the site. Many people use VPN, and they often forget to turn it off even when they are in the domestic segment of the Internet. It is better for the developer to disable blocking access to the site through other countries altogether. If that can’t be done, then opt for a smarter blocking tool that can filter users who logged in through VPN.

Conclusion

Some of the above anti-trends can still be applied, but this should be done carefully. The main thing is to use those solutions in development and design that help the site to fulfill its direct task, and the user to solve his problem. Trends and anti-trends are still a controversial phenomenon, however, those that were given in the article are best avoided, if possible, when creating a site.

By Navid Anjum

Full-stack web developer and founder of Laravelaura. He makes his tutorials as simple as humanly possible and focuses on getting the students to the point where they can build projects independently. https://github.com/NavidAnjum

Leave a Reply

Your email address will not be published. Required fields are marked *