How to design better for WordPress

 Take a look at this blog that one of my colleagues wrote recently, it outlines whether designers should know how to code. She sums it up quite nicely.

‘’being multi-skilled is great but not at the cost of being mediocre at both design and development. Rather focus your skills but have working knowledge of both sides so you can be aware of the constraints and opportunities.’’

With that said, while you don’t have to know the ins and outs of coding, you do need to have at least the basic knowledge so as not to design something completely unachievable for a developer.

In this blog post, I outline what you can do to design better for an effective and efficient design application in WordPress.

1. Simplicity

WordPress was started in 2003 as a simple solution to making a website easier and simpler to build. It demonstrated how a focus on simplicity set the course for over a quarter of sites that make the World Wide Web what it is today. Hence, the keyword here is simple. Keep your designs simple, mainly for better user experience, but also for the developer who has to build this site.

You want users to be naturally visually drawn to the most important information in any section of your website. Effective use of white space is one of the most elegant and time-tested ways of doing this and it makes your website beautifully simple.

The same goes for forms. If you’re doing it right, you’ll have forms on the website. But keep these forms simple. They’re the main way users interact with your site: registrations, lost password recoveries, contact pages, submissions – the list goes on. Taking a little bit of extra time and effort to actually make your forms intuitively usable, friendly and stylishly presented instantly raises the overall design profile of your pages.

2. Keep up with current design trends

I’m sure you’re probably doing this already, it’s a given in our industry, but it’s important you keep up with current design trends. WordPress is an ever-evolving platform and what you can do is change every day.

The latest trends we’ve seen so far (and like) are:

• Parallax scrolling is were images in the front move at a different speed or direction than those in the background.
• Card-based design (think Pinterest) – displaying condensed information in an elegant, yet simple way.

3. Don’t forget to be responsive!

If you’re designing for WordPress (or, whatever the platform) you have to design with responsive functionality in mind. Responsive design simply involves the ability to adjust your designs to accommodate every user’s screen size, device orientation and platform. In today’s fast-moving mobile world, users expect websites to display perfectly irrespective of the device they are using. If you’re not doing this, your newly built website will lose about a third of the traffic.

4. Expand your coding and WordPress knowledge

And by this, we don’t mean learning code, we simply mean researching it. By knowing the latest buzz words, the latest trends, the latest tools, tricks or plugins, you already have a wealth of knowledge at your side to make you a better-informed web designer. You can do this in a few ways:

• Educate yourself on PHP Code. Most designers who have a familiarity with HTML and CSS are often put off at the sight of PHP as PHP code is more dynamic and constantly changes, as opposed to the static nature of HTML code. So, if you are going to be designing in WordPress, you should read up on PHP, unless of course, you have the opportunity to work alongside a developer who can assist you.
• Familiarise yourself with WordPress themes and the way WordPress functions. If you have a basic understanding of CSS, you’re in luck, as you will apply the same principles in WordPress.
• Get to know the structure of existing themes. Much like developers do when they inspect websites to look at the coding used for creative and next-level designs, looking at the structure of themes will give you a better understanding of how the design was achieved and implemented.
• Read up on WordPress. As with any application and program, WordPress is always evolving and adapting to new trends. Ensure that you stay up to date with new applications and implementations. Subscribe to WordPress Specific Blogs and Articles to ensure you always get the latest news and updates with regards to WordPress.

5. Brush up on your knowledge of website development terms

If you want to brush up on your web development terms, have a look at an article we wrote on web development terms for designers. It is a list of 10 terms we think designers should wrap their heads around to assist them in their process as they’ll be able to plan and brainstorm the functionality of the website with the developer before any design work begins, thus limiting potential issues.

So, as you can see, there are a few guidelines you can follow to design better for WordPress. Here at MO, we’re an experienced bunch of designers and developers, if you need some experts to take a look at your website design or build, please get in touch.