6 UI/UX Tips for Your WordPress Site

What does a WordPress developer, a copywriter, a designer, a CRO specialist, and an SEO expert have in common?

Well, every one of them works hard to deliver a good experience to the website. What a user sees on the website and how it interacts with it is the quintessence of UI/UX.

But first, let’s start with some definitions.

What is UI/UX?

What is UI?

UI stands for User Interface. 

An interface is the point of interaction between a user and a device. An interface is where man and machine meet. The telephone, the keyboard, and the ATM down the street are a few interface examples.

What we call ‘interface’ in the digital world is actually just one more interface category, called the Graphics User Interface (GUI). The GUI includes what every electronic device shows on the screen. Accordingly, the Windows on your computer screen have their own GUI, like your calculator and your washing machine do.

Nowadays, when the GUI is the default interface in our day to day communication so we just call it UI.

What is UX?

UX stands for User Experience.

According to ISO’s definition from Ergonomics of human-system interaction, UX is “a person’s perceptions and responses that result from the use and/or anticipated use of a system, product or service”.

Compared to UI, UX is a wider concept. Also, the UI is part of the UX. In short, UX includes every aspect of a user’s interaction with your website.

Why is UI/UX Important?

So what’s the importance of a good UI/UX today?

The ultimate objective of UI/UX is to help a user navigate through your website and achieve their intent, given that you can serve that intent in the first place. UI/UX is about getting your user from point A to point Z with as little friction as possible.

With ever-decreasing attention spans, users want to get what they want the fastest and easiest way possible.

UI/UX is about getting your user from point A to point Z with as little friction as possible. Click To Tweet

If you have an eCommerce store and during the checkout process you ask for more information than the IRS, then most of the users will never make a purchase and become customers.

This is bad UX.

Likewise, if you offer B2B services and the typography used is small and has low contrast with the background, the user won’t have the patience to decipher your texts. And they will visit a different website.

This is bad UI.

1. Keep it Simple

If I had to pick only one tip from this list, or any other list for that matter, that would be it. Simplicity is the most important factor in UI/UX design. Why would anyone make anything complicated rather than simple? Simplicity always wins.

From the website architecture to the amount of information presented, and from the typography selection to the Menu buttons, simplicity is the keystone on which good UI and UX are being built upon.

It took our digital world a few years to discover it but since we realized that simpler usually means better, we haven’t looked back since then.

2. Maximize Speed

Here are a few bothering statistics based on a recent study from Deloitte:

As page load times go from 1 second to 3 seconds, the probability of bounce increases by 32%. And when the page load times go from 1 second to 5, 6 & 10 seconds, the probability of bounce increases by 90%, 106% & 123% respectively.

Google, also, has a magic number, which is 3 seconds. If a page takes longer than 3 seconds to load, half of the visitors leave instantly.

Reducing loading time and increasing the speed of your website can benefit you in multiple ways. In particular, the website will experience an increase in:

• Conversion rates
• Average order value
• Pageviews per session
• Funnel progression

But how can you know how fast your website is?

Once again, Google has the answer, called Google’s PageSpeed Insights. Just copy and paste any URL and hit the analyze button!

So how does one increase the speed of their website?

As reported by Moz, to increase your website speed, here’s what you should do:

1. Compress files. Reduce the size of those CSS, HTML, and JavaScript files that are larger than 150 bytes.
2. Reduce redirects. URL redirection is done for many reasons. Regardless, you should make sure that you don’t use more redirections than necessary as a redirection tampers with the page loading time.
3. Optimize your images. Make sure that every image on your website is not larger than it appears. Although reducing the quality of your images might be a good solution sometimes, eCommerce stores need the maximum image quality for their products regardless.

There are also a few things that lower your page speed you should avoid:

1. Free WordPress themes. ‘Free’ doesn’t always come for free. Free themes developed by obscure developers often contain unnecessary code. And anything that is unnecessary on your website takes a toll on the speed of your website.
2. Too many plugins. WordPress has about 50,000 plugins to choose from. It’s easy to get carried away and add a few too many plugins to your pages. Stick to those you actually use and remove all the rest.
3. Problematic hosting. Very often, you get what you pay for. If you pay for cheap WordPress hosting, that could have an impact on the loading speed, and sometimes on the website security, too.

3. Offer Great Customer Support

Good customer support can work miracles for any type of business. And nowadays, your website is usually the place where your customers will receive support from.

In a PwC survey regarding customer experience and what they value most, 82% of US respondents said that human interaction matters a lot for their experience. 

Although “offering the best support possible” and “honor thy consumer” look great on paper, customer support doesn’t come cheap. Especially when it comes to self-service services and cheap products that rely on volume.

Think about it. Let’s say there are two companies, Company A and Company B. And both of these companies have the same revenue, say $10k, but through a different pricing model. Company A has 1k users a day who pay $10 on average, while company B has 10 users a day who pay $1000 on average. Customer support for company A is less cost-effective than customer support for company B.

Like any SaaS consultant knows, this is especially true in the SaaS (software as a service) industry.

What are your options then? You basically have two of them, namely, support through a chatbot and support through a live chat.

Technically, both chatbot and live chat are different sides of the same tool.

You probably know live chat software names like Intercom, Drift, and Zendesk chat. Although many of them have a few differences when compared, they all share the same benefits.

According to helpcrunch, the biggest benefits of live chat support include:

• A higher customer satisfaction rate
• Boosted conversions
• Better customer experience
• Cheaper and easier scalability
• Increased customer retention

Whereas a chatbot is about automation, live chat support is more demanding in resources as it requires an actual human to operate.

Regardless, you can also consider starting the customer support journey with a chatbot interaction. And if the chatbot cannot assist the user, it can suggest a live chat connection. This is how you get the best of both worlds.

Adding a chat plugin to WordPress is pretty easy. First, go in the WordPress admin area, and choose “Plugins” > “Add New”. Then, search for the chat plugin of your choice. Finally, you click Activate, and you are done!

4. Mind Your Copy

Since your website doesn’t have a mouth, it has copies.

Here a few things to keep in mind when copywriting:

1. Before anything, do a keyword research. The outcome of the research will affect anything from the structure of your homepage to the headlines.
2. No one cares about you, your company, or your service. They care about how you/ your company/ your service can help them. Show that through your copywriting.
3. Add customer reviews and testimonials.
4. Use clear calls-to-action. Furthermore, every page has to have no more than one or two CTA’s, which you can repeat multiple times through the page.
5. Finally, don’t use “landing-page language”. If you don’t know what that means, take a look at these words: “the go-to”, “industry-standard”, “cutting-edge”, “revolutionary”, “leverage”. Now you know what landing-page language is. So, please, stay away from that as much as you can.

Finally, don’t forget about the only place you can include the most information: your blog. This is where through quality content you will offer visitors the information they might be looking for and also showcase your authority.

5. Consider Embedding Video

Although very powerful, copywriting and text have their limits.

Certain products and services can be highly technical in nature to explain. And you may need to cover a lot of information. This is especially true for B2B products and services.

Whereas your standard eCommerce shop doesn’t need a video to explain what a ‘book’ is, a SaaS company must explain how their new ‘referral program template’ works.

This is where explainer videos can help you. Instead of losing much precious space trying to explain the ins and outs of your product or service, you can simply insert one 3-minute video on your homepage.

You’ve probably seen whiteboard animation videos. These kinds of videos are ideal when you have to cover a lot of information and/ or you want a more lighthearted, yet professional approach.  Also, if you have more time than money, and you want to make the video yourself, there are a lot of video editing programs, many of which are free to use.

6. Don’t Lose Them at the Checkout

Losing your customer during the checkout process is known as shopping cart abandonment.

Cart abandonment is a real shame because it is the epitome of ‘so close yet so far’. It means that you’ve done many things right to get your customer to buy from you, alas they didn’t make the last few clicks.

If you need to measure the rate for your website, here’s the simple math you need to do:

Cart Abandonment Rate = (Transactions Initiated – Transactions Completed) / Transactions Initiated

Cart abandonment happens even on the best websites – especially eCommerce stores. 

Rest assured that in every case it’s over 50% and can reach up to 80% for eCommerce stores.

So what can you do about it from a UX perspective?

Looking at the graph above, apart from factors such as a slow delivery, every other reason stems from a bad UX.

If you don’t offer enough payment methods or your website doesn’t appear to be secure enough, your customers can’t give you their hard-earned money. Therefore, you need to give them as many payment options as possible. 

And regarding the security of your website, you need to know how to protect both your customers and your website. And if you lack an SSL certificate, you don’t even have to buy one, regardless of what anyone may try to sell to you. Just download the WordPress SSL certificate plugin for free from the official site.

Take-Aways

While a UI/UX checklist is always useful, let us not forget the tools you can use. UI/UX tools will not only help you with your optimization but also give you further optimization ideas through the functions they provide.

From wireframing and A/B testing to user behavior insights, there are a number of UX tools you can use to create, modify, quantify, and test the experience your WordPress website offers to the visiting users.

And especially in the case of UI, you should consider not starting every time from scratch. This is where UI kits come in, which make the life of any designer a lot easier.

And so, with the right practices and tools, you will hopefully bring your users the best possible experience!