Web & Patterns: patterns for a better web.

A nice error page from Mattrunks, a French website for motion graphic lovers.

A picture is worth a thousand words so I think that an infographic can easily summarize and replace the text in your website.

Clean and fresh alphabetical navigation found in Postable, an interesting tool to create your address book in a kind of user generated way.

A beautiful sliding navigation made of silhouettes in negative space.

A plant extending out of its pot, sustains this website’s footer, underlining the organic and green inspiration of this blog. Fight for future in fact all about environment: an interactive online campaign dedicated to educate and create awareness on protecting and conserving the Mother Nature in the most easy and fun way. It is like a [...]

A particularly well-made menu expands horizontally the main navigation while displaying below the secondary categories.

Another funny 404 error page where copywriting and visual work particularly well together.

A nice way to polish your website design is to add to your footer a small but memorable illustration.

A nice sliding effect in Joint Media portfolio shows the captions hidden underneath each pic.

A fresh, shiny example of footer design with vibrant, intensely hued baloons and bubbles to add emphasis to texts and titles.

A minimal grid meets a horizontal scrolling in this interesting, minimal, website about design and typography.

I immediately noticed and loved the plus sign used in the submit button of this huge, “organic” form.

I couldn’t shake this feeling that I was missing something in my collection of navigation, so today I picked for you this fine example of textual accordion menu.

The first thing you’ll need to do, when meeting an unknown audience, is obviously to introduce yourself. You’ll have to do it also in your website. In this case, illustrator and webdesigner Jacob Souva is introducing himself using an old photo of himself as a kid, framed by concentric circles, conveying a warm and friendly [...]

In this example, the white space (also know as negative space) all around the logotype erodes the basic form of the typefaces (e.g. the F’s stem or the T’s crossbar) creating a concise and extremely minimal design. Notice also the word “fabric”, stripped of the vowels, and enclosed by the O’s counter.

The New Minimum logo is so minimun that, in fact, it doesn’t even exists. It’s just a pixel hole carved on the menu (fixed on the page top). If you scroll the page, you can see the content passing under it. So zen, so minimal.

Look at me! I’m a simple logo stripped of any vowel and nevertheless I’m still laughing!

High contrast colors and big typography emphasize the ironically boastful nature of this website introduction.

The top big black horizontal scrollbar provides a useful navigation throughout Pentagram‘s website and portfolio.

13 wives is quite an obscure project based in Singapore, apparently involving women and drinking. Having said that, I wanted to share with you these beautiful background images masked by a geometrical W letter.

If your web monsters won’t make you sleep at night, you can just call this amazingly creative web agency.

The vertical expansion of this beautiful portfolio and its geometrical construction match perfectly the architectural content displayed.

A transparent navigation menu with sketched, hieroglyphics-like icons, floats over the stunning graphics of Bully studio’s portfolio.

Excellently executed paper bag icon.

This layout, made of different of pieces of paper haphazardly mixed, creates a strange yet fascinating effect.

Lego 404 error page made me both happy and nostalgic.

An antiquish decoration is used here for creating a nice distinction in the website’s sidebar.

This gigantic contact form is vividly decorated by a bright, “childish” illustration.

The layout grid become visibles thanks to the background pattern so you can see how every thing falls neatly in the right place.

Amazeelabs light up the web scene with their nice, handmade, typographic light bulb.