Skip to main content

The split-screen web page trend of 2018

The trend of the split screen website seems to be growing ever more popular as we move forwards into 2018. We saw more and more great design examples in 2017 and this we feel is set to grow ever more popular in 2018.

This got us thinking about double page spreads in magazine layouts and about traditional magazine layout and rules of best practice and how they could be applied to this new trend.

Split screen design - Feelingpeaky Ltd

The diagram above shows how the eye scans a traditional magazine page layout from top left to bottom then up and round top ending bottom right and how some content could work on a webpage layout. Of course this sort of layout is only relevant for desktop presentation. The layout would respond to stack going through to tablet and mobile. But that aside when prototyping layouts it may well worth be considering this traditional best practice.

 

The Golden Ratio

Split screen design - Feelingpeaky Ltd

Another related layout would be the Golden Ratio. This is a mathematical equation found in nature for creating natural looking compositions. The Golden Ratio describes the perfectly symmetrical relationship between two proportions. You can also use the golden ratios rules in split screen design. It can again be beneficial when it comes to layout of the design elements on the page.

 

The Z-Pattern

Split screen design - Feelingpeaky Ltd

Finally, the Z Pattern is a modern philosophy that users when reading websites scan the page left to right and top to bottom. As one would expect the z-pattern follows the lines of the letter z. Website visitors start in the top/left, moving along horizontally to the top – right corner and then take their eye diagonally to the bottom- left before finishing their movement with another horizontal direction to the bottom – right. The designer would therefore place the most important elements along the pattern’s pathway. Again this pattern can be incorporated into a split screen layout as shown above.

Results driven web design services delivered

Ensure your next website is growth orientated – Driving increased visitors and increased conversions

web design services