By Eliza Medley
Every year, new trends emerge or re-emerge in web design. 2017 is no exception. Chances are, you’ve noticed some of these trends yourself. Hopefully, at least a few have inspired you to get creative and bring new life to your website.
But as we all know, it’s one thing to notice a web design trend and something else entirely to implement it on your own site. You may have thought, “That’s really cool! How do I do that in WordPress?”
If you have, there’s plenty of help out there. Developers in the WordPress community do an amazing job of ensuring that WP site owners have access to the tools they need to employ the latest and greatest web design trends. In this article, I’ve listed the 15 hottest web design trends of 2017, along with the WordPress tools that you can use to implement them.
Cinemagraphs
A cinemagraph is what appears at first glance to be a static image. However, upon closer look subtle, repeated motion can be detected. These are frequently published as animated GIFs.
Web designers are using cinemagraphs quite frequently these days. They add a dramatic effect without being too busy or distracting. WordPress users can add cinemagraphs to their pages by using a new plugin called Audio Story Images.
While cinemagraphs can already be displayed on WordPress pages, this tool allows web designers to incorporate audio into these images as well. This means that not only does the visitor get the visual impact, they also hear music, background noises, or even a voice over.
Virtual Reality
Virtual reality and 360-degree video have been growing in popularity for some time now. In 2017, many web designers are enthusiastically embracing them, and finding ways to add them into their websites.
It may seem impossible that a simple plugin could add this functionality to a WordPress site. However, that’s exactly what the creators of WP-VR-view have accomplished. This plugin allows designers to display 360-degree videos and photo sphere images. Mobile users can use Google cardboard to enjoy a fully realized virtual reality experience.
Typography Taken to a New Level
Typography is an often ignored but key element in the look and feel of a web page. A focus on beautiful, often custom made fonts began trending a couple of years ago. However, in 2017 the passion for typography has really hit its pace. There are several WordPress plugins that can help designers take typography to an entirely new level.
Typekit is an online repository of thousands of fonts. These are available via subscription or to purchase. These fonts are custom created from a variety of ‘font foundries’, and encompass variety styles ranging from script to block lettering. The Typekit plugin for WordPress simply allows the designers to easily use fonts from their personal Typekit collection without modifying their WP theme.
WP site owners who don’t have the skill set or desire to modify their CSS should consider the Use Any Font plugin. It simply allows users to select and implement any custom font.
SVG Files
Scalable Vector Graphics or SVG is emerging in popularity among web designers. The attraction is obvious: when a small image is embedded in a web page, SVG prevents the visual quality from being lost when the image is scaled to larger sizes.
Using SVG in WordPress has been fairly problematic, at least until recently. The SVG Support plugin changes that. It provides full SVG support to WP designers. After installing the plugin, developers can style SVG elements with CSS. It can also restrict the usage to admins only.
Designers have two options when using this tool. They can opt to use it as-is, out-of-the-box or they can enable the advanced mode to add more power and functionality.
Duo-Tone
More and more sites are using pictures and background images featuring dramatic, double hues. This is the duo tone trend, created by layering a single color over the top of a grayscale image. The result is intense, retro, and certainly, catches the eye.
While this effect can’t be exactly duplicated using WordPress, the Two Tone FX plugin comes pretty close. It’s an image filter that can be employed on any picture in your library to get a very impressive approximation of duotone.
Modular Design
The block and card style websites that are so popular these days are based on the web design principle of modular design. Essentially, each element to be displayed exists in its own block. The blocks are then combined together to make the web page. Modular design is especially helpful when creating responsive web pages. It also makes maintenance much easier.
There isn’t a single tool or plugin that can help designers to implement the modular design on their WP sites. However, there is a very useful, step-by-step tutorial on building modular content systems in WordPress. This is definitely worth a read.
Content Friendly Layouts
One trend in web design doesn’t involve colors, images, fonts, or video. It’s simply the use of minimalist layouts that are created specifically to allow the content on the page to shine. This is key for good SEO, and it also works well on e-commerce websites where a busy layout can be distracting.
There are several content-friendly themes in WordPress. These include:
The look and feel of these themes, when combined with great content from content writers or professional writing services, can turn commercial websites into responsive, SEO friendly powerhouses.
Video Backgrounds
Although Video backgrounds aren’t new, they’re just as hot in 2017 as they have been in the past. Using video backgrounds can add dramatic effect, work as a great aesthetics booster, and add another dimension of storytelling.
The Video Background plugin for Facebook makes adding video backgrounds a quick and simple task. Users only need to fill in four fields for their web page to gain a background video. One of the four fields is a ‘poster’ field which acts as the fallback image on any device that’s not video compatible.
Toggling Search Bars
Web designers are increasingly using toggling search bars, which only appear when users hover over them. This method saves valuable screen space, which is very helpful when it comes to mobile-first design.
Applying this technique to your WordPress site isn’t easy, and requires some coding to make it happen. However, once you get the job done, the final product is pretty slick. This video tutorial lasts less than ten minutes and describes how to use Jquery to add a toggling search bar to your WordPress site.
Vivid Color Schemes
Web designers are frequently opting for more creative bright, bold, and customized color schemes. Designers are combining colors in new ways and playing varying shades and schemes. The Central Color Palette plugin makes it easy for WordPress designers to create a customized central color scheme for their website.
More GIFS and Animation
When used correctly, GIFs and brief animations can add a lot to a web page. They can emphasize a point, add a bit of humor, or underscore an emotion. Giphy is probably the most well-known source for GIFs.
They also have a pretty cool plugin for WordPress. Giphypress makes it easy for WordPress users to grab relevant Gifts from the Giphy collection and then add those to their WP content.
Autoplay Videos
In spite of the fact that many people find them annoying, autoplay videos appear to be here to stay. Designers are embracing this, and so are users (albeit slowly).
If you would like to use autoplay videos on your WordPress pages, check out this tutorial.It lays out how to get the job done in an easy step-by-step format, and provides some best practice advice as well. Finally, consider sticking with the standard of defaulting the sound in autoplay videos to off.
Mobile First
Mobile first is quickly replacing mobile friendly as the preferred approach to mobile design. Mobile first prioritizes mobile devices rather than making them a secondary consideration, which makes sense when you consider the fact that mobile usage is high and continually increasing.
Fortunately, there are a variety of WordPress themes that lend themselves towards this kind of design, one of which is the aptly-named theme Mobile first.
Conclusion
Many people mistakenly assume that the relative ease of use that WordPress brings involves limitations in what web designers can do with this tool. Clearly, this isn’t the case; there are plenty of tools that WordPress users can employ to help them create eye catching, on trend websites that users will love.
About author:
Eliza Medley is a web design educator and tutor for getgoodgrade.com from Orlando. She is fond of teaching students, learning new information, communicating with people and improving her knowledge. Follow @Eliza_Medley on Twitter.
The post WordPress Tools for implementing the 15 Hottest Web Design Trends of 2017 appeared first on UpdraftPlus. UpdraftPlus – Backup, restore and migration plugin for WordPress.
Recent Comments