3 Mistakes You Are Making On Your Website

Web Development

With modern drag-and-drop solutions, getting a basic website up-and-running has been made an entry-level task for most businesses. Paste a few images here, add some text there, and you’re good to go. Easy, right? Maybe not.

Not all websites are built the same. Creating an intuitive experience that communicates your offering is still an expert skill that takes into account various factors. To highlight just a few, here are three mistakes your website might be making.

POOR CONTRAST

Breathtaking visuals, expressive images, and eye-catching colors are what make websites such a captivating medium to connect with your audience. But let’s not forget why people are on your website to begin with; they're in search of something. They have come here with a purpose, and your role in the newly found relationship is to make the fulfillment of that purpose as effortless as possible.

In the digital world, text is still king. According to a study by Floss Taylor, “across all industries, copy has twice the relative influence to convert over design.” It’s no secret why companies pay exorbitant sums to professional copywriters in order to communicate their message effectively. But even the most inspiring copy is worthless if it cannot be read.

Companies and website developers will often make the cardinal mistake of allowing for poor contrast. This is where two separate elements overlap, but the colors of each make it difficult or impossible to decipher between them. That is why some creative students were adding nonsensical paragraphs of text and coloring them white to give the illusion of word spacing while allowing them to reach their word count (disclaimer: this is not academic advice).

Assuming you aren’t trying to hide messages, it is important to make sure the contrast on your website doesn't cause strain to your audience. The World Wide Web Consortium (W3C) recommends a contrast ratio of at least 4.5:1 (the variance between the brightest luminance and the darkest luminance of the two elements).

A common area website developers often make this mistake is with image/video overlays and hero (header) images, where the image colors are likely to vary across the screen. An industry trick to improving contrast while maintaining the design is to use scrims (darkened overlays) that will make the color variance in your image less broad.

Incorrectly Sized Images

“A picture is worth a thousand words” - What they forget to mention is that only the right picture can truly make those words make sense. The impact your visuals create depends not only on what they capture but also on how people view them. I’m not quite sure the Mona Lisa would have received the same critical acclaim if her eyebrows were just rendering or if Van Gogh had painted a blurry night scene instead.

We have all been on websites where we are greeted with a blurry, distorted picture taken from a flip phone camera that has been stretched to fit the width of a current-day laptop display. This is because that original photo was taken with a certain number of pixels (information about what was in that small dot in the photo). Therefore, you can't simply add pixels or create information that was never captured (with the exception of AI, but that is a different discussion), meaning expanding an image just stretches the existing pixels.

What results is a pixelated mess that, at best, makes your audience squint to see, and at worst, ruins trust in your brand. By now, most of us have come to admit (reluctantly) that Santa isn't real, but I think it might take a few more years before we are ready to accept that enhancing images in CSI was just a bit of movie magic.

Now, you may be thinking that your iPhone 15 Pro allows you to zoom in enough to see the pollen particles on a flower, well when it comes to website images, we can confidently say, bigger isn't always better. While a high-quality image looks fantastic, the trade-off is an increase in file size. Large image files are notorious for impacting site loading speeds, one of the core metrics used by Google when assessing your SEO.

While there are techniques that allow for greater optimization such as using modern image formats (.webp), SVG files for graphic-based images, and removing unnecessary file data, knowing how and when to use them can be confusing.

Ignoring Color Theory

You’re in your car stopped at the traffic lights. The light flashes from red to green and almost in unison, you hear the driver behind slam his hand into the horn. From where he is positioned, he cannot see if it is safe to proceed, so why is he frustrated?

It is because in most parts of the world, green means go, and you were not following the cues. People have been conditioned over many years to associate color with certain messages or actions. Red means stop or danger, yellow means warning, and green means continue this way. This phenomenon is as much a part of road rules as it is in the digital world. When we see a text box highlighted in red, we instantly acknowledge there may be an error, having something greyed out likely means it is not active, and a green button means a successful action.

Color theory is therefore just as important to your website experience as the text. Don’t believe me? The Stroop test requires you to say the color of the word, not what the word says. Try it out and see how many you can get. This highlights just how confusing it can be to be working against mixed messaging.

When building your website, it is important to consider color theory and how it relates to your brand. That’s why companies with predominantly red branding often use neutral colors such as white, black, or grey for their call-to-action buttons. This prevents any conflict with their branding without confusing the audience about what to expect.

Conclusion

Overall, designing a website with a focus on contrast, image optimization, and color theory can contribute to a positive user experience and elevate your online presence. In the digital age, where user expectations are high, attention to UX design is crucial for achieving innovation, differentiation, and business success.

Take the guessing work out of your website. Contact Mundane Media today and let’s build your brand online.

Lets chat/

The one thing that all great stories have in common is the beginning. This is the opportunity for us to start our own great story, to work together, crafting and refining the narrative that communicates your brand.