Get fresh WordPress Content delivered in your inbox with warpspeed!

learn wordpress wplift wordpress rocket

When working with WordPress, it’s easy to stick with the linear familiarity of old layouts. However, designers are discovering more and more that fresher designs that treat a blog like a full-on website are more engaging, effective, and user-friendly. Refer to these eight essential tips to find out if your user interface is performing as well as it could.

Keep Navigation Elements In Place

It’s tempting to play around with the classic layout that has navigational elements along the top of a site, the search bar on the upper right, and other specific criteria that we’ve grown accustomed to. However, the placement of these elements should almost always be left alone; it’s worth the creative sacrifice to make sure that your visitors know how to navigate your site.

But Be Creative Within a Conventional Framework

However, just because you should stick near to the classic placements of navigational elements, that doesn’t mean that you can’t add personality and interest to them. Narwhal’s website retains the familiarity of a horizontal navigation bar across the top of the site, but makes it more interesting by adding icons.

01

Simplify Whenever Possible

Especially if you run a site, like an ecommerce store, that is complex and potentially confusing, all your design choices should reflect the importance of paring down to the essentials. Sites with a lot of information should put a premium on hierarchical structures and clarity in all things.

This Zara product page makes a lot of information look as crisp and minimal as possible, by using a monochromatic color scheme that only highlights the most important information (the sale price), lots of white space, and multiple drop-downs.

02

Variegate Your Text

One of the ways you can make your blog more visually engaging is by putting thought into how you break up your text and differentiate between headlines, body copy, quotations, and more. The Old Guard site is a beautiful example of how all these elements can be combined successfully. There’s quite the mix of serif and sans-serif, uppercase, lowercase, and italics, but the result is cohesive and elegant because the typefaces are all fairly classic, and only used in the site’s simple color scheme of black, grey, and electric blue. There’s plenty of white space around each clearly identifiable element, making each post easy to scan and understand.

03

Balance Text with Visuals

The addition of graphics and images is the other crucial element that helps to break up space and make your site more appealing and readable. The means of approaching these changes are through the use of these four elements:

  • Iconography
  • Illustration
  • Photography
  • Creative layouts

Most well-designed sites employ a combination of a couple or all of these techniques.

How to Use Illustration and Iconography

This cloud computing guide uses a combination of infographic-style illustrations, classic illustration, and icons. Infographics are a great way to express information in an easily-scannable and interesting way, and many blogs contain content that can be worked into this form of visualization. One example of this might be displaying the results of a poll, or explaining a concept that could benefit from a simple visual display.

04

How to Employ Creative Layouts and Photography

A simple rearrangement of the traditional blog layout can make a big difference in the visual impact that your site makes. You might feel it’s difficult to find the right template to work off of, but in fact there are many WordPress themes that can give you a beautifully customized solution.

Just take a look at this blog, The Glamourai, which has a hierarchy of importance that is arranged by size as well as position; it’s a clean and logical departure from the normal linear layout.

05

This website has an even more modular and complex layout. The design breaks up the space in an unusual way, but also keeps categories organized in an approachable and understandable way.

06

Conclusion

Although it’s important to keep all the previous tips in mind when it comes to your WordPress designs, remember that the most important contributor to a good user experience is a swift, functional site that takes the user where they want and expect to go. So, more than anything, make sure that you’re using the right resources and platform for your needs.

Luke Clum is a Seattle based designer and web developer. He loves UI design, videography and alpine climbing in the mountains. Follow him on Twitter @lukeclum

Published:

Last updated on:

This post is by a guest author, if you would like to submit a guest post to WPLift, we'd love to hear from you. Please get in touch.

2 thoughts on “8 Tips For Improving the User Interface of Your WordPress Blog

  1. Hi, your new theme looks great! I love it.

    I agree with you regarding the navigation, and I think you did a good job on secondary navigation on the left of this website (when resize window).

Comments are closed.

Join 40,000 WordPress Astronauts
AND GET OUR LATEST CONTENT IN YOUR INBOX WITH WARPSPEED

We will never spam you.
close-link
siteground coupon
Get 60% Off the No. 1 WordPress Hosting!