Trends and trends in website design 2017
It was originally planned to post a translation of an English-language article on web design trends in 2017, but after studying various sources, we decided to slightly change the concept of this article. The thing is that over the past month a lot of thematic materials about modern trends in web design have been published on the Internet, and opinions, as they say, diverged. On the one hand, this is logical, since different authors have their own assumptions about what will be relevant for sites in the current year. On the other hand, these forecasts are very subjective.
In general, we have collected all the options and put together something like a digest of web design trends 2017. Let s start with the most popular trends noted by many experts, and gradually move on to more “unique” ideas. By the way, if you have additions and thoughts on the topic, feel free to share them in the comments. Plus we recommend reading about the 2017 logo trends – it s also a helpful post.
1. Non-standard “abstract” design
A website grid is considered a kind of well-established basic concept that helps to correctly organize the space of a web page. At the same time, she drove especially creative designers into certain frames. However, there have always been daredevils who create original solutions that are not controlled by any rigid boundaries. Such works, as a rule, are found in image and creative topics, but in 2017 this trend in website design will spread to strict corporate projects.
The custom arrangement of elements gives more interesting possibilities: it allows you to use the entire page space, add layers of objects and a sense of depth to the layout. You can create designs that impress users even without colorful full-screen videos or animations. Considering hundreds of thousands of classic layouts on the web, abstract unique solutions will almost always stand out and attract the attention of site visitors (like the WOW factor). And you need to use it!
2. New navigation options
For a non-standard project – an advanced menu. Today, you don t need to put horizontal navigation in the header. Due to the growing popularity of responsive layouts, many users are already accustomed to the Hamburger menu icon (consisting of three horizontal bars), which is increasingly appearing on regular versions of sites. The line between mobile and desktop design is gradually blurring. This year we will see a lot of experimentation with menu placement and shape – this could be one of the top web design trends of 2017.
Such solutions allow you to use the page space in a different way. In addition to intuitive downward and sideward scrolling, and a docked vertical navigation box, various hidden sliders will be popular. With their help, you can place all the necessary submenu items on one screen. In a sense, this makes site navigation more detailed and useful for users. It is only important that they be able to deal with your non-standard solution. Be sure to test its effectiveness in practice.
3. Cards in design
Cards are far from a new trend in website design, but in 2017 it will continue to be relevant. This solution effectively presents information on different platforms: from mobile applications to viewing on large TV screens. This format of data organization will make it possible for users to focus all information on objects as conveniently as possible.
This approach is used by many popular projects on the network: Facebook, Pinterest, Netflix. The latter option is generally a great example of the successful implementation of cards in a design that combines minimalism, navigability and efficiency.
4. Split layouts with split screen into 2 parts
We will see more split screen layouts this year. This web design trend will be especially active in 2017 on home pages and Landing Pages. Visually, the implementation looks great in minimalistic designs with contrasting backgrounds or images.
The designer will be able to use various visual design techniques in adjacent blocks within the same web project. And the result will look natural. By the way, split layouts work well for Call to Action in landing pages. Read more about the method here.
5. Large and original typography
I remember that back in 2009 we published a similar article where the use of huge fonts was one of the promising trends in website design. In 2017, the same will probably happen (at least most designers mention it). The main reason is, of course, to attract attention: someone needs to highlight certain objects on the page, someone wants to explain how to use navigation correctly, etc. However, typography is getting thicker and bigger. In implementation, you might find blog posts about bold and bold fonts useful.
At the same time, many sites get rid of the standard system fonts, which can significantly diversify their appearance. With the growing number of free original web font services (Google Fonts, Typekit), their popularity will grow even more. It looks like 2017 will also see some experimentation in website typography. The main thing in this matter is not to overdo it – remember that the text must be well readable. By the way, if you work with WordPress, then the article How to connect a font in WordPress (including Google Fonts) may come in handy.
6. Gradients and vibrant colors
Another 2017 web design trend is the use of vibrant color palettes for gradients (and more). The beginning of the era of flat design brought some interesting features to the online world, but you need to work in this style very carefully, because it can contribute to anonymizing the site In order to solve the problem, some specialists began to experiment with bright colors and gradient solutions. This year, the trend will continue to develop, and not only on the Web (probably, everyone has already noticed the recent update of Instagram).
This trend can be used not only for the background. One of the popular techniques is to create a transition between two colors and overlay them on the picture. This makes the photo more interesting, and in general the effect looks unusual. Bright colors add depth, dynamism and pleasant energy to the design. They can highlight the page and the elements on it well.
7. Animation and micro-interactions
By itself, the animation on the site is not new, but every year designers are learning to implement it more beautifully and more efficiently. Minor visuals for images / objects / content can not only liven up your project, but add an additional tool for user feedback. In modern UI / UX interfaces, various micro-interactions turn routine processes into more fun ways to get information + allow the user to see and understand how a particular page element (menu, navigation, buttons) works.
Below are specially provided links to the relevant sites so that you can watch their animation yourself (click on the screenshots).
8. Parallax effect
Another familiar web site design trend in 2017 should open up from a new angle. Parallax itself is realized due to the different speed of movement of the background and foreground when scrolling, which gives the impression of depth and dynamism of the picture. This year, we are expecting much more complex work using several layers, different directions of movement and the use of effects. Work with this technique carefully so as not to distract users from the content of the web page. Below you will find pictures with links to source sites.
9. Almost virtual reality
VR is one of the most pressing topics today, despite the fact that the real situation in this area is less optimistic than many forecasts. Of course, this feature could not but affect the designers. In some layouts, you can find different techniques that would create a “presence effect” for the user: 360-degree videos and panoramas, video inserts “like in a movie”, games, etc.
10. Tactile, natural design
This trend combines two directions at once – natural colors and tactile design. An overuse of flat solutions has turned many web projects into monotonous, faceless Bootstrap layouts. Now some designers are trying to move towards more natural solutions, for example, they post photos and realistic 3D models so that the user has the feeling of being able to touch and touch objects on the site. They also use natural materials for textures, illustrations and backgrounds + natural shades (green, brown, gray, neutral metallic).
11. The rest of 2017 web design trends
In the process of studying the main trends in website design in 2017, we met different opinions. You have already familiarized yourself with the most significant options, and now we will briefly talk about a couple of assumptions that turned out to be less popular. Some of them, by the way, were actively used earlier, but this year the trend will continue.
Background videos and images
A feature with a large image for the backround is likely to remain relevant for a long time because it perfectly grabs the attention of users. The trick works great for all sorts of sites, from e-commerce to travel and portfolio.
You can make the background even more effective by adding animation or video. Thanks to YouTube and similar projects, video content is now very popular, you can use this feature on your website. If you add sound, do not enable it by default, the user himself should want to do it.
Geometric shapes
If you look closely at the screenshots of the web projects above, you will notice the use of different geometric shapes in many of them. They are often square / rectangular shapes, but curves, triangles and circles are also found. Such blocks can contain content or be used to highlight the background.
Unique illustrations
We did not find many original works in the selection of beautiful hand-drawn websites, but this web design trend in 2017 will still be relevant. First, illustrations add a personalized look to your project (which is a big plus in the era of Flat layouts). Second, the technique works well with custom typography to create even more unique layouts. This can also include the tendency to use real photos in design / content instead of pictures from photo stocks – originality is always in demand.
Total
We reviewed the top 10 trends in web design for 2017, which will now be actively used by designers in their work. In fact, there are not so many original techniques, a significant part of the trends have been repeated from past years: cards, bright backgrounds, parallax, large typography, etc. In terms of fonts and navigation, we will probably see original variants this year. Apart from the point with virtual reality, we can say that the general trend towards simplifying the appearance of online projects continues, designers only continue to look for the most effective and interesting ways to implement it.