Blog

Keeps you alive

HOW TO IMPROVE USABILITY IN WORDPRESS


Usability can be a difficult challenge to overcome, not because it is particularly difficult to implement, but because it is subjective. What one person deems to be simple and easy to use may be someone else's nightmare; there are definite ‘better’ and ‘worse’ approaches but there is no best, specific way of overcoming a particular issue.

WordPress does a good job of making things simple out of the box, especially when compared to alternative Content Management Systems, but that doesn’t mean there’s no room for improvement.

In this article, we'll highlight some interesting ways your web development team can boost usability in WordPress.

 

Personalise the logo on the admin login screen

By default, you will see the WordPress logo at login, which does its job just fine, but we find that swapping the WordPress logo for our client's logo creates a valuable sense of familiarity.

This small change shows website owners and admins exactly where they are. That means there will be no more mistaking a login page with any other WordPress site, saving users the inevitable panic that ensues when their login doesn't work…only to find out they’ve been trying to log onto Wordpress.com instead of their own site.

Restructure the admin menus

WordPress has a large number of menu items, some of which are in confusing places or are just straight up unnecessary for many websites. I find it easier to remove all of the menu items and re-add them one at a time depending on what is needed, trying to group items in a logical order.

Lets run through an example:

wp_menu_1

As you can see, we've got a long, unwieldy list of menu items to select from. To streamline, we can group our custom post types (e.g. Testimonials, Jobs, etc.) and standard Posts together, inside a dedicated ‘Content’ menu item.

Logically, it makes more sense, and now our menu looks like this:

Wordpress_menu_2

It’s worth completely removing any menu items that aren't needed, as you can free up additional space and avoid confusion. In this particular case, the Tags and Category taxonomies have been removed because these features were not going to be used by our client.

We've also removed the Add New Post instruction for each custom post type, as the user can simply use the Add New button once they've clicked on the type of content they wish to interact with. This tweak keeps the flow consistent, as each post type can now be added in the exact same manner.

Wordpress_menu_3

Our menu is looking better but still not perfect, so let’s the remove the Dashboard, Appearance, Plugins, and Tools too, as we don't want our client to accidentally install any new plugins or alter their custom-built theme. With those out of the way, we now realise we need to use the Menus sub-option, which is inside the Appearance menu. We move it into our Pages item as a solution; considering the pages are linked together via the navigation menus, it makes sense for them to be in the same place.

Wordpress_menu_5

Looking good, but we've still got the generic Media item clogging up our menu.

Media contains the files uploaded by the client, hence it makes sense to move it into the Content section. We'll add a divider inside the Content menu to separate Media from the actual Post content, and for the final icing on the Media cake, we'll rename it ‘Uploads’.

Wordpress_menu_5

Now our CMS looks and feels much better. Having a simple, cleaner admin panel can make the WordPress experience much less intimidating and confusing for your staff, consequently improving workplace efficiency and reducing the level of support required; imagine never having to deal with a "How do I add a news article again?" email again!

A word of warning, however: it is easy to get carried away, removing and rearranging menu items until there is one item left containing a thousand sub-items, which is no better than the menu we started with. This is why the menu restructure should always be done strategically and carefully.

Automate complex processes

A perfect example of automating a complex process is inserting alt tags (the text that appears when an image fails to load). Some of our clients have never heard of alt tags, whilst others may forget or just not bother to insert them. Either way, the outcome is the same: their website will lose the SEO and UX benefits that alt tags bring.

One way we actively ensure our clients are on top of their game is to automatically generate their alt tags, based on specific formulas.

For example, the following could be a formula for a collection of clothing products:

 

[brand] [description] [product] in [colour]

 

When live, this formula would translate into the following:

 

Diesel low cut jeans in blue

 

We’d use this as the default alt tag, but should an admin explicitly set up a different alt tag for an image, then the custom version would appear rather that the one generated by the formula. This way, we have default, semantic alt text for every image, which can be overwritten when preferred.

Small changes that can drastically improve the user experience

These little steps do not take long to implement and can potentially have a nice, stress-free payoff for all users of your CMS. So, take the time to improve WordPress usability from kick-off, rather than treating it as an afterthought once the project comes towards a close and you’ve run out of budget.

If you’re unsure what elements of your website should be personalised, restructured, or automated, ask your web developers or project manager for advice. They will have worked on hundreds of website projects, thus can provide first-hand knowledge of what users need and want when it comes to a brand new WordPress site.

 

Sources: https://www.plugandplaydesign.co.uk