3 Web Design Tips that Improve User Experience | Captain Coder

3 Web Design Tips that Improve User Experience

Marisa VanSkiver / Website Design / February 15, 2021

design tips to improve UX

Ah, design. The most subjective and hard to articulate part of the website creation process for every single one of my customers. Many people know less what they do like and more what they don’t.

No matter what your personal style is, though, there are some simple things you can do to not only improve the look of your design overall, but also help to improve your User Experience, or UX. The best part is, these design tips can fit in with any type of website.

1. Point Your Images Towards the Copy

Take a look through my own website. Do you notice that the eyeline of every single person used throughout my website is largely pointed towards the copy? Even the body language I ensure is pointed inwards instead of off-screen.

It’s a small, subliminal thing but absolutely helps the user keep scrolling through my verbose copy and also tells their eyes where to go. Pointing your images in towards the copy helps to point your customer’s eyes in as well, gearing them to read instead of getting lost offscreen. We have a natural ability to follow where someone’s eyes are (think of the creepy paintings that seem to follow you as you move), so use this to your advantage!

Masters at this also work to have the body language point in and just a little down, which helps encourage scrolling as well.

If you’re a solopreneur, schedule a photoshoot and have your photographer take pictures of you facing multiple ways so that you have more options for facing to the left, right, or just a little down, depending on your website’s design.

(Side note: my hair looks nothing like what’s in the headshots throughout my website…it needs to warm up in Wichita so I can update them!)

2. Be Careful with Color Choices

I had students once ask me how many colors they should use on their website. With most professionally-done brands, you’d typically have 2-3 main and maybe up to 3 accent colors. While all those colors are great, be careful to use too many on your website.

For most, I’d recommend using 3-4 maximum on a website to avoid looking like a circus or inside of a rainbow. Done well it can work great to include more (especially if there’s a purpose to those colors), but typically I’d say 3 brighter colors and a neutral for those non-graphic designers like myself.

You also want to ensure that whatever background color you use, whether white itself or a dark black like my own, that you’re using a font color that has a high enough contrast to be legible by a variety of seeing abilities. Especially those with low vision or color blindness, you want to ensure that it’s legible no matter who’s viewing your website. Black text on a white background is safe, for instance, or vice versa, but you can also use a Contrast Check tool to make sure you’re within an acceptable range.

Also be wary of using text on background images. A quick fix would be to add a little bit of a drop shadow to the text to make it stand out and improve the contrast (like you’ll see on my blog headlines), but any images with heavy patterns can be hard visually to read on.

3. Leave Plenty of White Space

Let your text and images breathe! In the past as a developer, I and colleagues were often accused of “choking” the text or design pieces.

White space or open space (for darker websites, different colors, patterns, etc) not only helps to let elements breathe and balance, it can also help to lead the user from one topic to another. White space also prevents your website from looking overly busy, which in turn can cause a lot of confusion for your users on where they should go next. That open space is really important to keep people moving and clear on their path through your website.

White space is also important for a good mobile experience. Remember that people are navigating your website not with a tiny mouse pointer, but instead using their thumbs of varying shapes and sizes to click and get around. Leaving plenty of white space, especially around clickable elements, makes that easier and helps prevents accidental clicks that annoy and frustrate people (not just me, right???).

Leave a Reply

Your email address will not be published.

Ready to grow your business online?

Stop guessing and start following the strategies that work.

Book a Clarity Call