The trends we cover in this post are not sudden, revolutionary changes, but a snapshot of where we are at in the ongoing evolution of website design and development. We highlighted these five trends that cover the different facets of website design, from visuals to user experience, but in short, they all reveal the same conclusion: websites in 2015 strive for a simpler interface with a more sophisticated user experience.
Forget the Fold
For a long time, web designers were instructed to place the most important pieces of content “above the fold”. This phrase refers to the part of the web page the user can see right after it loads. Before the diversity of screen sizes that we have now, the space “above the fold” was approximately 600px tall. This constraint led to cramped web page layouts that featured a lot of content to sift through before the user even begins to scroll. Today, we have a spectrum of screen sizes and web page layouts that respond to these different sizes, changing our concept of the “fold”. The fold is now fluid, and users are comfortable with scrolling to see more content that may not be readily visible upon page load. Many modern websites now use the space above the fold for showcasing a large visual with a single headline, dramatically diverging from the cramped layouts of their predecessors. An increasing number of users are browsing the internet on their phones, where scrolling is not a hindrance, but a natural part of the experience. Last year, mobile web users outnumbered desktop web users, effectively making “above the fold” a thing of the past.
With increased mobile web surfing comes a new emphasis on designing for mobile experiences first, and desktop experiences second. For example, when browsing on a smaller device, you will see that many websites feature three lines to symbolize their menu. When you tap on this menu icon, you will then see a dropdown of the navigation links. Meanwhile, on most websites on desktop, navigation links are explicitly displayed. However, we have noticed that this practice of nesting the navigation links under an icon is also being used on desktops as well. In other words, mobile design trends are informing how websites will look on desktops, and this will require a complete rethinking of how the content of a site should be structured.
On that note, designing for mobile poses certain questions: How can designers simplify the layout so that users can easily get to the information they need when they’re on the go? How can designers better utilize the screen real estate seeing as they are working with markedly smaller screens? Many web designers have tackled these challenges by stripping away any unnecessary visual clutter and simplifying the user experience. For example, many modern websites feature buttons that are “flat”. In other words, they are usually one solid color with no gradients, whereas buttons from the past were composed of images that made them look three-dimensional. While there are functional reasons for going with a flatter design, such as reducing page load time, many modern sites are embracing this idea of eliminating any visual noise. If you take a look at the publishing platform, Medium, their design is simple and clean, creating a zen-like experience when reading the articles. There is plenty of white space when browsing on desktop that could have been populated with content, but they have chosen not to use it–instead the white space serves the purpose of directing your eye to the content, making it a critical part of the experience. You can expect to see this intentional simplification of content and design as more sites cater to mobile browsing.
Just because mobile browsing has encouraged more minimalistic design does not mean that websites have become boring. In fact, modern websites are now highly visual, due to recent technological advances that allow for faster page loading, and the prevalence of photo sharing platforms such as Instagram. As a result, the bar for high-quality imagery has been raised. Web designers now seek custom photography solutions or stock photos that look more natural. Visuals can also come in the form of vector icons, which have grown in popularity due to the fact that they can scale to any size without compromising resolution, which is helpful for the diversity of today’s screen sizes.
More Sophisticated User Experiences
Last but not least, another recent trend is the ability to pace the user through the site by controlling the presentation of content, particularly with scrolling. One increasingly popular way to do this is having certain sections appear only when you get to a certain part of the page. Take bloomberg.com for example. As you are scrolling through an article, a blue box appears with social sharing icons on the right and remains fixed to the top of the viewport. However, as you keep scrolling, this blue box then scrolls up with the rest of the page, only to be replaced by a list of recommended articles once you are almost done reading the article. This is an excellent way to display all of the content you wanted the user to see in an uncluttered way. Furthermore, having the recommended articles appear as you reach the end of the article will entice them to explore more of the site’s content. While this particular approach seems to be a recent development, having a heightened awareness of a site’s user experience is not a trend but a prerequisite for any great site.
Does your website’s design follow these best practices? You might also want to check out our post 5 Signs It’s Time for A Website Redesign to see if it’s time for a change.