9 Mistakes Beginners Make on Duda

I analyzed 6,000 Duda websites and found the same nine mistakes on many of the websites. These Duda mistakes weaken the message of the website and are easy to squash. They don't take a lot of skill but require an eye to catch them and once you know what they are, let's see if you've already made one of these mistakes on a Duda site.

My analysis process was long and tedious, and I intended to create a page going over examples of Duda websites as there are none on the internet. Looking at finished Duda websites helps you succeed whether you are a prospective Duda user or an existing user seeking inspiration.

In doing this analysis, I was surprised to find the same mistakes come up time and time again, which is why we are here. I've compiled this list of things you need to avoid when building a Duda website and offer remedies.

Let's dive into the top nine mistakes beginners make on Duda. Watch the video or read ahead below!

1: Too Many Animations

Duda gives us effortless tools to add animations to a website. They are mainly used to bring website elements (images, sections, text, etc.) from invisible to visible. Scrolling into a section is the typical trigger for these animations. You arrive at a section on the page, the animation is triggered, and your section fades, bounces, or flips in.

The problem is this.

The mechanism for adding these animations is so easy that beginners go crazy with them.

Too many animations result in a page that is hard to follow and gimmicky.

If you want to see animations done right, check out Apple's website. They crush it (although it's not built Duda).

Duda published an excellent article on animations and using them wisely. I'll summarize them.

• Use animations wisely, ensuring they fit the flow of your website and style.
• Ensure that the animations trigger at an appropriate point in the users scroll so they don't happen too late and the section is almost off the screen
• EVERYTHING IN MODERATION - "Animations can help you deliver a message, but try not to be too aggressive with them. Make sure your animations feel natural & smooth, without causing discomfort or significant delays for users."
• Lastly, use animations consistently not flashing in one spot, fading in another, and bouncing somewhere else. That's way too gimmicky.

Animations should flow nicely with the design, be used in moderation, and all in all, not be "too much".

2: Submenus Are Not Designed

Not applying custom design to submenus was quite a shocker to me, yet it was the most frequent mistake I saw. This was a surprise because Duda gives us the tools to design submenus with ease. I'll show you how to design them.

But first, let's explore why this is so problematic. The website has a particular branding and feel to it. Everything seems polished and gives the visitor a good impression of the website and, therefore, business. The thought process of, "this website is nice, I bet their whole business shines" is real! While we say don't judge a book by its cover, people, especially younger generations (looking at me), interpret the business's ability through their user interface and user experience. If they understand me online, they must get me in their actual business dealings too.

But when a visitor arrives at the submenu and sees the default gray background and black text, they see it's an unfinished part of the website. Maybe the business's attention to detail isn't all there? While we know the company can be the best at what they do and have an unpolished part of the website, it's not a good look, and some people may question it.

To design the submenu, right-click the main menu, click "Edit Design", click "Subpages", and ta-dah here's where the magic happens. Be sure to set styles for the background color and font color and both of these properties for the hover and active state, so the visitor knows which page is selected or hovered. Setting the divider color is optional but may be needed based on your color scheme.

Designing the submenu will take two minutes max and make a big difference. Do it, or I might find you.

3: Too Much Text

Breaking up text is something I actively struggle with as it's a bit challenging. Often, we designers are given a large block of text that needs to be displayed on a page. Naturally, we copy and paste that into a text widget and throw an image to the side of it. The result is a webpage that looks daunting and time-consuming to read.

We must work towards connecting with our audience. The website homepage has two prominent use cases:

1. Act as a verification that the business is legit
2. Work as a 24/7 salesperson that attracts new business

In the first scenario, the prospect needs to see a nicely designed website that speaks to them. It's best to keep things high-level and link to the in-depth pages that break down your services or products. The internal pages are where you can have text-heavy pages, although at any chance you get, break them up with graphics, bullets, or anything but more paragraphs.

In the second scenario, the same principle of keeping a nice design and text light still applies. We need to capture the visitor's attention, not explain every detail. This concept is challenging for business owners because they have so much to tell their potential customers. The customers don't want to hear it or dedicate time to dive into several paragraphs before they like what they see. We need to get them interested, tease them information, and get them to click into other parts of the website.

There is one caveat with the second scenario, and that is content drives traffic. I've developed two solutions for this problem. First, ranking the homepage with content isn't a widely used practice anymore. Instead, content marketing, or the publishing of in-depth blogs and articles hyper-targeted towards a topic, is the new(ish) method. Writing an article that answers a consumer's question or solves their issue while plugging your services at the end is very effective. You've just proven you're useful to them and then offered to keep working together.

In some cases, content on the home page still has a use case. Maybe there is no one to write content, or it's not a competitive industry, so a few paragraphs on the home page will suffice. In either case, put the content on the homepage, but put it lower towards the middle of the page or even further down, keeping all the initial sections very light and engaging.

4: No Catchy Intro

The first words on the screen need to grab the attention of the visitor. You do not need to tell them everything you do. Making the visitor go "good one!", or "interesting, tell me more" is the objective. The principle of keeping it simple on the intro is similar to the previous section of breaking up text, and that is why we need to get the visitor interested and not break down every detail.

I'll give you an outline of how to write an attention-grabbing intro, but also know that keeping things unique is recommended too.

• Big text usually works best
• Keep the big text short (2-4 "long" words)
• Below the big header, you can optionally put an additional sentence or phrase. Sometimes more can be helpful, but keeping one short sentence is the goal.
• Use a custom font family. Unique fonts go a long way.
• You don't need a button, especially if the top right of the nav is a button with your primary CTA. Buttons can be a good thing to use, though. I'm just hesitant to ask for the visitor's business right after the smallest information we've given them yet.
• Alliteration works well

We incrementally get the visitor to commit to more. First, read the big header in your face. Read a slightly longer commitment but still a short sentence. Then get them to scroll down and read some other snippets. It keeps going until they contact you.

5: Hard To Read Intros

Many of the websites I analyzed were quickly disregarded for my Duda website examples list due to the design of their intros. The words need to grab their attention, but so does the design.

The usual issues I saw with the designs fell into one of three (or three of three) categories:

1. The color contrast between the text and background was nonexistent, causing the text to blend in with the background.
2. The size of the text was too small to read.
3. The placement of the text was off balance. I'm not saying it needs to be centered, but having it in the corner doesn't make sense.

I like BIG intros. They catch your attention, are easy to ready, and make a statement. Duda offers an easy-to-use background overlay setting so you can either darken or lighten the background and choose the opposite color for text. I like to make the backgrounds dark and the text light, but the reverse works too.

Choosing the right words is half the battle and displaying them in a consumable style is the other half.

6: Inconsistent Padding / Spacing

Designing a website requires you to be meticulous, noting down your padding sizing so you can consistently apply it across the website. While every section doesn't need the same padding, most do, and at a minimum, you need to pay attention to how it all comes together.

Padding is the spacing that goes between an element and the edge of the element. For example, the text on a webpage doesn't start right where your browser window starts - there is spacing to provide separation.

Beginners often apply padding at inconsistent sizing. Typically the left and right will have the same padding, and the top and bottom will have the same. But all too often, the spacings are different on beginner website builds.

Keep things clean and consistent. Check this image, for example, and see the top and bottom spacings are different.

The website in this image has a very nice design, but the lack of consistent padding takes away from it.

My eye for this kind of stuff is very keen and picks up the slightest inconsistencies. For a beginner, I recommend opening up the design on each element and checking the spacing until you develop an eye for it. I still inspect padding if I'm unsure what I'm seeing.

7: Not Using the Copyright Widget

Out of the 6,000 websites I analyzed, 1,165 of them had a copyright year that was picked up by my automated software. Out of these 1,165, 517 (44%) had a current year, and 648 (56%) were out of date.

From an aesthetic side, the out-of-date copyright looks like the business is not up to date. Maybe they don't have attention to detail? Perhaps they aren't in business? From a legal side, I honestly have no clue what the ramifications (if any) are for an outdated copyright year.

Whether you manage your website or you're an agency that manages a client website, you don't want to update the year on the footer every year.

Instead, use the copyright widget! Duda includes an out-of-the-box widget that automatically shows the current year. As soon as the new year hits, you're up to date! Now that's a business that looks active.

Plus, the widget comes with the copyright symbol, so you don't have to figure out how to add that. The widget is flexible, allowing the addition of custom text after the copyright.

8: Inline Captchas

Captchas are the "I'm not a robot" part of forms.

Here's your captcha 101. They try to prevent spam submission by looking at how you interact with a website, how your cursor moves, how fast you type, the patterns, etc. With this information, it'll either let you submit the form, block you, or give you a test such as selecting fire hydrants. Google is behind the captcha that Duda uses. Because Google is analyzing user behavior, we must display Google's Privacy Policy to our visitors. There are two versions primarily in use which are V2 and V3. The V3 doesn't test the user with images, while V2 mostly does.

Duda gives us a very easy-to-use system to select the captcha we want to display.

Here's the order from worst to best:

1. Inline checkbox
2. Inline icon
3. Inline text
4. Bottom left/right icon

The first one displays a small badge on either the bottom right or left of the entire window. Google's policy is that the privacy link must be visible within the user's workflow of submitting the form. Putting it in the bottom suffices, barely, but it does.

If, for whatever reason, the bottom right or left already has things there like a chat icon, then you can display the privacy "Inline text", which displays a nonintrusive span of text. The "Inline icon" shows a large, Google-branded badge but requires no interaction. Lastly, the "Inline checkbox" requires the user to check the box and pass the image test if needed.

I recommend using either the first or second option for both branding and not disrupting the user's flow. Too many people don't, and it stains the design and flow of the website. To do this, edit the form and select an option under "reCAPTCHA position".

Easy enough!

9: Content too Narrow

The last mistake beginners make on Duda is making the content too narrow. Welcome to 2021, where desktop websites are widescreen. Your content doesn't need to fill up the entire screen. In fact, some modern websites choose to constrain the whole page to a smaller dimension. But don't go too small. Narrow websites look very outdated and don't maximize the potential of the screen.

Duda has an option to set the container width under Design and Site Layout. I typically use 1200px but have sometimes used 960px. If you use 960px, full-bleed some rows, so the color stretches the screen.