Web design is always evolving, but I reckon I can pick out 5 layouts which a lot of sites seem to follow lately. Of course there are many more out there, this is just a subset of what I consider the most popular.

For each trend I will give a brief description and then give what I call the “poster boy” of the trend.

Horizontally Striped (Marketing Layout)

This layout is typified by the website being compartmentalized into horizontal sections. Each segment serves a specific purpose, with the amount of “real” information increasing as you move further down the page, and the amount of “marketing” information decreasing as you move down the page.

First is a relatively thin header which contains the logo and some simplified navigation.

Second is the “marketing” section where things such as cute vector icons/characters go promoting the most attention-grabbing aspect of the product/service on offer.

Third is the “content” heavy section which contains must more detail about the product or service. If the second section has grabbed the user’s attention, it is up to the third section to capitalize on the users intrigue.

Fourth, is usually the footer.

There were heaps and heaps of sties to choose from for this layout trend. In the end I settled with Wishlistr.com.

Bare, White and Pastel

This trend is typified by sites with white backgrounds, straight to the point text and pastel colors for subtle styling.

In my opinion these sites are for “products that speak for themselves”. That is not to say that products with graphic-heavy websites are not good – far from it – but this bare-feel to a website gives me the sense that “hey we are not going to spend oodles of money on employing some whiz bang graphic designer. look at our product.. we know you will like it”. I guess this is kind of similar the approach Google took when designing their website.

Because the site is relatively bare, typography becomes very important. Certain words or phrases are made to stand out even more due to the bare feeling. This is great for marketing, as long as you don’t over do it.

Pastel colors provide a subtle way to highlight certain section of the website to once again stand out above the bare white. Pastel yellows and blues seem to be the most popular colors for this.

Poster-boy for this trend is 37signals:

Busy, Artsy Headers

Next up is the layout trend which I am seeing used for a lot of blogs (particularly blogs of talented graphic designers). They are taking website headers to an all new level with some beautiful artwork to catch the users attention.

One possible problem with this style is that the header overwhelms and distracts the user too much. So best to use styling elements such as swirls, leaves, grass, flowers, sky etc rather than real-life objects like people or furniture.

If you’ve got the talent, use it!

Poster-boy for this trend is one of my favorite blogs, Web Designers Wall:

Distressed, Textured and Intense

Now onto a bit more of a darker theme. Textures are back, bigger than ever. Wood textures in particular are very much in-style now. As is the typical grungy look and feel.

This all adds up to a distressed and intense web design which oozes personality.

One thing to be aware of is that not everyone is a fan of this style. Some may find it too dark, depressing or lets face it, EMO!

Poster-boy for this style is a site I found on one of the CSS galleries – Artworks by Dan Friml:

Grids Galore

When most people think of grids, they think of newspaper websites. And that’s a fair enough thing really since that is the most common place we see the style. Grids are usually for content heavy sites.

Typography plays a huge part, but color and images should also help draw the users attention to certain grid boxes of the website.

Designers have to be careful not to overwhelm the user. There is a definite technique involved with getting the information out there, but still giving the site a feeling of structure.

Poster-boy of this trend is Kineda:

Well there’s five trends. I am not implying the poster-boy sites were the first to have the trend, but in my eyes they typify the trend best.

Are there other sites which you think typify one of the trends better? Or are there any other trends which you think are far more popular than the ones I identified?

Tags: trends, web, web design