Split Layout

Split format should primarily be used when you have 2 contrasting options that you would like to present to your user.  Because you are splitting the real estate of your site, I would recommend engaging the user with your design to make it more interactive. Consider the format Google used to advertise the new Star Wars trilogy. They are drawing in the user and engaging them by asking them to choose a side of the force. This is a great example of how you can use split layout to engage their users.

Media Layout

Media Layout is meant to display a bulk of media. This could be news stories, updates, videos, articles, etc. The goal of a media format is to give the user options to find something on the site that might grab their interest and keep them on your site. The largest complication when using this style is the actual formatting of the page. Since you are putting a lot of information on the page for the use to sort through, its important that every element is evenly spaced and the content is well organized. Consider how the New York Times homepage displays its content. By using a neat layout, providing bolded headlines, and occasionally using pictures, the user is able to easily navigate a page full of content. 

E-Layout

I call this the E-Format because when you lay your content out on a site it looks like an E. Most of the bulk of the content will be on the left side of the site, with the content spanning to the right side of the screen. This is taking advantage of the fact that most of the people reading your site will be used to reading content from left to right. “E” format is most effective for blogs that have a lot of articles with feature images, or just content you would like for them to browse through chronologically. Consider how the New York Times lays out their older articles. It is meant to give you a general overview of what the article has to offer while still keeping it compact and a brief. 

Z-Layout

“Z” Layout is very similar to “E” format but is meant to draw the users attention around the page in a Z pattern. The main difference is that Z-format will use both the left and right side of the screen to draw the users attention. There will often be content on the right side of the page. This format serves the same purpose as E, but works to break the repetition of its format. This is mostly used when displaying user testimonials, reviews, etc. This is used well when you anticipate the user to scan your site quickly. Consider how Amazon.com’s front page lays out their products. It’s meant to show you a bulk of products in hopes that one stands out that you end up buying.

Product Layout

Product Layout doesn’t have to be exclusive to a product. It’s more meant to shout to the user, “Hey this is what this site is about.” It’s most often used with products because it is direct and attention getting. Consider Apple’s landing page for the iPhone. You immediately know what the page is about.