WordPress trends come and go like the wind. One year, it’s 20px drop-shadows and everyone’s putting ribbons on every stretch of textured background they can find. The next, Google unveils Material Design and the online world goes flat. As theme providers, it’s our job to make sure our customers’ websites look and feel as fresh as possible for as long as possible. That means identifying design trends across all platforms, understanding which ones are here to stay and which ones are slated for oblivion. With that, here’s what we think of 15 trends currently dominating WordPress design. Some we love, some we’d rather leave behind; in the end it’s about personal preference and the demands of your design brief, but this will hopefully get you started in the right direction.
The hamburger menu
Let’s get it out of the way: we love the hamburger. We know it’s not for everyone, but as designers, we’re all about having options. The hamburger gives us another universal visual tool to control the user’s focus and put more emphasis on content. It bridges mobile and desktop and lets us hide navigation if we think it will benefit the theme. We put a hamburger in our theme Motive and got a ton of great feedback from customers.
The key–like any design tool–is understanding when and how to use it. We see too many designers hiding navigation when they shouldn’t be, or using a hamburger menu solely for effect. Instead of clearly linking to a contact page, they might hide that link along with two or three other, totally unnecessary links, just for the sake of the icon. That’s bad design.
Verdict: Love it. Just be sure it serves a purpose.
SVG images
We’re all in! SVGs (Scalable Vector Graphics) have made our lives so much easier. With our themes being viewed on so many different screens and pixel densities, these scalable, often smaller images eliminate the need for packaging multiple versions of logos and graphics for different-sized screens. Because all they are is mathematical data about curves and shapes–no actual pixels are involved–SVGs look sharp regardless of screen size. You can take an SVG from a mobile app and blow it up to billboard size and it will look just as sharp. You can also animate SVGs and style them. Want to change the colour of an icon when you hover over it? In the old days you had to swap it out for a whole new image on a bloated sprite file and make sure it was positioned pixel-for-pixel so that users wouldn’t notice. Now you can create a single-file icon that flashes, bounces, and finishes with a pirouette. The only downside to vectors is that you can’t use them to replace actual photographs. But for icons and logos, there’s nothing better than SVGs. If you’re not using them, you should start now. Verdict: Love it. Every image we put in our themes is an SVG.
Parallax
In most cases, we find parallax gimmicky and distracting. It’s too often done with an overemphasis on transition–boxes flying up and down, images exploding on the page–so that instead of engaging with the site’s content, all the user sees is effect (not to mention the toll it can take on mobile devices and older browsers). That same dynamism can often be better conveyed with video, especially now that we have so many stock video sites popping up. When parallax does work is when it’s used subtly–a slight change in the positioning of a background image on down-scroll, for example. The same can be said for most of these “tricks‖when they’re overdone, or when a theme is overloaded with them, the whole thing ends up feeling goofy and heavy. But done minimally, with a refined sensibility, they can add just enough polish to make the design look “deliberate.” Our advice, as in all things, is to use it well, in moderation. Verdict: Leave it. Or use it very sparingly.
Flat design
It feels like we’ve been waiting years for this skeuomorphic thing to run its course. Finally, it appears the era of “3D†paper clips and digitally rendered leatherette is over.
The recent flattening out of design has made the web better in general. Not only do flat elements look great in design, but they get to the point faster and without all the wonky associations of skeuomorphic design. By now we should understand that a button is a button, a page is a page, without having to design either so that it resembles a physical object.
Verdict: Love it. Agency is one of our favourite flat themes.
Mobile-first Design
If you’re buying a WordPress theme, you better make sure it’s responsive. Mobile users on non-responsive sites have a higher bounce rate than Space Jam-era Michael Jordan. Why, then, if responsiveness is so gosh-darn important, do we not see mobile-first design as the future? Because the desktop experience is still a huge part of people’s lives. There are so many things you can do on a full-sized screen that you can’t do on a phone. And yet, many designers have practically abandoned the desktop experience in favour of mobile. The decision to go mobile-first should come down to your user research. If 99% of your audience is on mobile, then sure, go mobile-first. But if only 15% are on mobile, maybe those considerations aren’t as critical. A good designer should be able to think ahead to mobile from a desktop layout easily enough. Verdict: Love it or Leave it. Depends on your strengths as a designer and your audience.
Microinteractions
The first thing a lot of people think of when they hear “microinteractions†is newsletter signup prompts. Fair enough: we get sick of those, too. But this is an area of design that’s only going to get more prevalent, and as long as it’s done well, in an elegant, non-obtrusive way, we think that microinteractions can be a valuable tool for engaging users. Boiled down, a microinteraction is essentially a contained experience within a website that prompts a user to complete a single task. Getting them to rate content, answer a poll question, choose which article to read next–these kinds of microinteractions are a great way to make users feel like they’re actively engaging instead of passively scrolling through your content. If used properly, they can dramatically increase the amount of time users spend on your site. Verdict: Love it. Just don’t be a jerk.
Modular Design
Here’s another design wave we can get behind. Modular design, or design that subdivides websites into smaller, self-contained parts, is great, especially when dealing with large amounts of content. It gives users visual patterns that are easy to recognize, allowing them to jump to the areas that most interest them quickly and efficiently. It also complements flat design and minimalism in general, giving some shape and context to otherwise spare elements. Our developers like modular design, too. It allows them to work from a framework or style guide created by designers and use it to build self-contained modules. That means a hero banner’s Javascript/CSS is tied into one component instead of all over the site. It’s efficient, predictable, and easy to maintain. Verdict: Love it. We would organize our lives in modules if we could.
Infographics
There was a time not so long ago when infographics were the coolest thing around. They made visualizing data super fun and easy, and they let creators of all stripes try their hand at graphic design. The problem with infographics is that they became too fun and too easy. Every marketer in the world started creating them to “tell their story†or drive traffic to their site or blog. The main point of them in the first place–information–got lost in a jumble of overdone cartoon graphics. Infographics can still be awesome showcases for graphic designers. The key is to approach them from a data perspective, using information to craft a convincing story. We kind of hope they’ll phase out for a while and then come back with more refined standards. Verdict: Leave it–unless the data and design are a perfect match.
Long Scrolling Pages
It’s been said before: scrolling is the new clicking. Not only do long scrolling pages get users to the content they want faster, but they’re infinitely better for reading flow than clicking around a bunch of sections. With that much narrative power comes more pressure on content. Designers or site owners should be ready to pour more time and attention into good copy and images to get the story across properly. When done well, a long scrolling page can lead a user through everything he or she needs to know, learning the story of your company or products without even realizing it. Verdict: Love it. If you can tell your story in a single page, do it.
Grid Layouts
The rise of Pinterest has fostered a boom in grid layouts, sometimes called tiles or card-based design. One of our most popular WordPress themes, Curator, uses a grid layout.
Grid layouts are a great way to organize a ton of content, especially if you’re updating that content frequently. They’re not for everyone–you wouldn’t want to use one if your content is limited or static–but they’re great for showing a bunch of content at a glance.
One really important thing, when using a grid layout, is to develop it on a solid framework so that load times and filtering aren’t too slow or choppy. There are few things worse than a masonry grid that gets stuck in a loop or takes five seconds to position itself properly.
Verdict: Love it. Just make sure it’s the right fit for your content.
Lazy Loading
Basically, lazy loading is when images and other objects aren’t loaded until they appear on a page. It’s becoming especially common on long web pages and image-heavy sites, where loading everything at once can take way too long, leading to ballooning bounce rates. As designers, we’ll take anything we can get that results in better page speeds and a better mobile experience, especially when it comes with some subtle, customizable effects. Our developers love it, too. Verdict: Love it. And its functionality is only going to improve.
Cookie-based UX
Personalized or cookie-based UX is hard to get right. It can be extremely labour-intensive, and unless you’re doing tons of testing, it’s tough to know if your work is paying off. That said, as designers, more data means more possibilities. Cookies can be especially useful for marketing and top-of-funnel work. When you can customize your site for your customers, they’re going to engage with it more and will be more likely to dig deeper or buy something. One big key is to not be heavy-handed about it. Users will start to feel creeped out if the page they’re on is too personal, or if they feel they’re being watched. Like a lot of things, this all depends on what you’re trying to say, whether you’re selling anything, and what kind of relationship you hope to have with your visitor. If you’re able to find that balance, cookies can be super valuable. Verdict: Love it. But do the research and make sure to get it right.
Ghost Buttons
These minimalist buttons are all over the place right now, and for good reason: they’re clean, classy, and they allow us to add really obvious hover states without switching colours or going cheesy with shading. You can see how we use them in our Storey theme for a good example. We love how simple and elegant they are. They just look slick.
The only catch is they can get lost if the background is overly busy or doesn’t provide enough context (more of a problem when the background is an image or video), so you want to make sure they’re set up for success.
Verdict: Love it. Simple and sweet.
Autoplay
It seems like this shouldn’t still be a trend, or that enough people should have agreed by now that autoplay is almost always obtrusive and awful. Why are we still fighting this battle? There’s nothing more annoying than arriving at a site only to have your headphones start blasting music while a video jumps up on screen. Actually, there is one thing worse–when you arrive at a site, start scrolling through content, and hear the sound of that same video autoplaying somewhere off-screen. It should never, ever happen. Let users navigate themselves through your content. Don’t force it on them. If your site is literally just a full-screen video, then maybe–maybe–you should use autoplay. Otherwise, if there’s something in particular you want them to see or do, use design to get them there. Verdict: Leave it. Don’t be that website.
Ecommerce
Ecommerce has been on the rise for a couple decades now, since the dawn of eBay, but the past few years in particular have seen a tidal wave. The great thing is, you don’t necessarily have to switch to a dedicated ecommerce platform to sell things on your site: thanks to plugins like Woocommerce and Easy Digital Downloads, pretty much any theme can become an online store. We love the fact that Mom and Pop shops are now finding ways to stay afloat by getting their products out to tons of people. Artists can sell their prints. Potters can sell their cups. It’s creating a whole new small-business economy that counteracts all that stuff massive retailers are doing to Main Street. Verdict: Love it. Ecommerce is great.
Overall, we love where WordPress is headed. There may be trends we’d rather do without, but as designers we couldn’t think of a better platform. The best thing about being theme providers is that our work is constantly evolving. The challenges and inspiration are different with every project. Who knows what next year, or next month, or tomorrow will bring? Check out all our themes at Themezilla.com
Products Mentioned In This Post:
Download these worksheets and start practicing with simple instructions and tracing exercises.
Download now!
We've been building some of the web's best WordPress themes & plugins since 2010.
View More Posts
