2016 is in full-swing and as we see with each New Year, web design trends are cycling and evolving from years past. The following five tips are tools for making the most of the new wave of design trends.
1. Don’t just hide all your content in a hamburger menu
This is a double-edged sword. 2015 was a year where a lot of user testing came to the fore regarding the effectiveness or, more specifically, the ineffectiveness of the ubiquitous ‘burger’ menu.
The problem boils down to the fact that, as designers, we have assumed the burger menu design and purpose are universally understood. It is a simple, elegant solution to menu overcrowding on mobile applications and websites. That assumption is undoubtedly aided by the fact that it simplifies our jobs as well. Unfortunately, what the research has shown is people often ignore the burger menu and become lost.
This has been combated in a number of ways. Some major sites have struggled with its application – NBC News rather infamously applied the burger menu to their desktop site as well with poor results, eventually switching back.
Much depends on the audience that will use the site or application. Ultimately, it reinforces the importance of user testing and factoring in multiple rounds to any new digital project.
2. Image carousels can be bad for your SEO, and are generally outdated
Google’s search engine has stopped crawling (read: ranking) meta keywords which was traditionally how frames of an image carousel were logged into the search ranking.
It has been the case for years now, but the click-through rate for any frame of a carousel beyond the first drops dramatically. Users are simply tuned out. There is seldom any indication of what frames 2, 3, etc. are and even when there is, it doesn’t improve the conversion.
For the effort of maintaining the banner, gathering the assets and the file size of those assets –which hurts your mobile load time– carousels simply aren’t worth it. Simple, clear messaging will continue its rise to prominence as a result.
3. Card design continues its rise in popularity
Card design is just what it sounds like, rectangular blocks or ‘cards’ that contain content and images arranged in a grid.
This has existed for some time, but has risen to prominence in step with the shift in focus to responsive design. Because these cards follow predictable grids they very naturally allow for flexible widths from desktop to mobile. All of this while handling large amounts of content and filtering very well.
4. Material design steps onto the main stage
The last big design shift, and one you’ve likely noticed, was the introduction of flat design – being flat graphics, shapes and elements in pursuit of clean, fast-loading sites.
Material design was touted as the evolution of flat design by Google back in 2014, though mostly focused on Android apps and interface.
More than a simple aesthetic push, material design was created to aid usability on mobile devices. In that unending pursuit of an improved user experience and mobile’s prominence this trend is fully expected to emerge in a noticeable way.
5. Subtle animations everywhere
Animations have always been a part of web designs (let’s not forget the old dancing baby gif). In contrast to dancing babies or the era of Flash websites that saw everything move, 2016 will see the continuation of subtle animations.
Subtle animations have emerged as a way to make a richer, more interactive web experience. In many instances, these types of animations function as user cues. Simple interactions that had either rudimentary or nonexistent responses, like hovering over a button, clicking on a drop down, or content reveals, now have quick, clean animations that draw the user’s eye and reward the interaction with a response.
Take something as simple as filling out a form or completing an e-commerce checkout. Progressing through the process involves a lot of formulaic interactions and, in the instance of e-commerce, combating cart abandonment is an ongoing effort. Simple user cues along the way, though not game-changing, are an easy way to engage the user and indicate they are completing everything correctly.