Website Layout Trends

Hello, and welcome.

Below will cover certain web layout trends, such as parallax scrolling, deviating from the grid and infinite content and scrolling. There are also some sub topics covered in the website, such as rich text and unique graphics.

Video Backgrounds

Through some complex techniques you can set a video, such as the one above to be a background for your site. This is done through a combination of HTML5, CSS3 and Javascript. You are also able to set videos to play automatically with no sound.

Parallax Scrolling

The term “parallax” first came from the visual effect of 2D side scrolling videogames that used different background image movement speeds to create the illusion of depth during gameplay. This was generally done by making the background of the game move slower than the foreground in order to make it seem further away. This same concept applies to parallax site design in which the background of the website moves at a different speed as the rest of the page for an impressive visual effect that allows for countless creative applications for online storytelling.

Parallax design gives websites a great opportunity to:

Wow viewers with page depth and animation
Take a story-telling approach to guide visitors through the site
Make page visits last longer by encouraging visitors to scroll through the entire page
Provoke curiosity
Direct visitors to calls to action
Reenforce website credibility with innovative interactive viewing

Unique Pictures and Graphics

Within the next year designers should look towards the trend of using unique pictures or graphics to be showcased or used on their websites. A big factor of this is rich photo content which helps develop the infinite scrolling sites which are a popular trend from this year.

Bright Colors

Many sites are using bright colors that draw users to focus points, stuff they want sold or read. This technique helps people not only to be brought in, but to use the site the way the client wants them to. Bright colors also allow a greater contrast to dark types that can be used, creating enhanced legibility.

Rich and Contrasting Text

Up until recently most sites used standard fonts, Helvetica, Roboto, Open Sans and others related to it. Now designers are using contrasting font faces to increase legibility as well as to draw user interest. This allows designers to design websites similar to how they would design advertisements or posters, allowing for a more coherent and heirarchal design.

Deviating From The Grid

Many designers are now deviating from a set structured grid design for web pages to increase uniqueness as well as increase user interacting with the site. Deviating from the grid allows for designers to overlap elements creating unique layouts for a navigation as well as a new way to layout graphics in a a site. This creates the ability to have a major focal point and elements playing off of it. Below you will see an rudimentary image example of a layout of how that might work.