Web Design Inspiration – Designer Websites

Web designers, agencies and web developers are usually the first to pick up on new web design trends and use them in their own websites. Their pages use the most important trends already and have a real good usability. Minimalistic, clean and flat design as well as retro colors are used very often.

There is also a trend towards a hidden navigation, which creates more space. The navigation also contains more functions, like filters and a contact form. Fully responsive web design is now the standard for agencies and designers.

I created this collection with some nice designer and agency websites. Enjoy them.


Minimal & Flat Web Design

The most important trend in 2013 is the flat and minimal design. Navigation elements are reduced to their basic functions and lose most of their styles as well. The focus is on the content.


Buffalo – Minimal & Flat Design

Web Design Agency with cool Flat Design

Web Design Agency with cool Flat Design

The Buffalo agency website relies on a flat and modern design in the form of hexagons, which are a kind of second navigation. The individual messages have a lot of space and they are distinguished from each other by simple lines. An elegant jQuery slider and CSS3 effects are skillfully staged without cluttering the page.

Visit Website


Nikita Shanin – Minimal Website Design

Developer Website with Minimal Design

Developer Website with Minimal Design

The website of the russian web developer Nikita Shanin has also been greatly reduced and has a minimal design.  The content on the pages loads fast and the animations are very smooth.

Visit Website


Yaron Schoen – Minimal Design and Stylish Navigation

Minimal Website with Great UX Design

Minimal Website with Great UX Design

Simple and clear UX design.  The self-made human interface designer Yaron Schoen is truly the master in the art of minimalism. The website is in a dialogue with the visitors and leads the user to the content. The navigation is hidden behind the logo on the top left corner and covers the full-screen when you activate it. His customers include Twitter, AOL, EA and National Geographic.

Visit Website


Image Mechanics – Smooth Page Loading

 

Minimal and Clean Design with Great Typography

Minimal and Clean Design with Great Typography

The australian agency Image Mechanics has a very reduced and clear messages on the website. The content is reloading with AJAX. I’m a bit disappointed from the 13px Arial font which is absolutely not suitable for the page.

Visit Website


William Leeks – Cool CSS3 Effects

Minimal Design and CSS3 Animations

Minimal Design and CSS3 Animations

The website of the developer and designer William Leek has a clean and flat design. Except for the CSS3 animations on the homepage the priority is given to the content.

Visit Website


Simple as Milk – Typography is King

Simple and Clean Web Design and Bold Colors

Simple and Clean Web Design and Bold Colors

The british agency simple as milk used a very stylish typography and a progressive color combination. The focus is clearly set on the content of the website. You can see this kind of trend also in the best-selling HTML5 templates.

Visit Website


Jim Ramsden – Small Website with Cool Navigation

Modern Website with Cool Drop-Down Menu

Modern Website with Cool Drop-Down Menu

Absolutely awesome website from the designer Jim Ramsden. He uses mobile user interface elements for his website. In addition to the narrow design, the hidden menu is a highlight. MUST SEE!

Visit Website


Manos – Flat Design and Bold Colors

Minimal and Flat Design Agency Website

Minimal and Flat Design Agency Website

The designers and developers of Manos, a studio that creates apps and websites, showing skill on their own website. Retro colors and flat design are very well used.

Visit Website


Full-screen Websites with cool navigation

Full-screen websites use the full width of every device. This is pretty useful if the visitor has an 24″ or 27″ screen with a big resolution. You can move the navigation to the left or right side and work with more space for the content. This kind of design is very good for blogs and web-magazines.


Booreiland – Awesome Zoom Slider

Agency Website with Awesome Slider

Agency Website with Awesome Slider

The dutch agency Booreiland staged their references perfectly. A slight zoom effect to the images intensifies the highlight on the reference. The navigation is innovatively designed and appears only on click. The powerful fusion of web and mobile interface elements will be particularly evident in the navigation. MUST SEE!


Online Department – Cool Cursor Navigation

Marketing Agency Website with Image Slider

Marketing Agency Website with Image Slider

Another dutch agency shows their references in the main slider on the homepage. The navigation on the page also reacts to key strokes which is a nice feature and often seen now. There are numerous elegant effects based on HTML5 & CSS3.

Visit Website


BKWLD – Video Background Slider

Agency Website with Video Background

Agency Website with Video Background

The sacramento-based agency BKWLD presents itself on the website with a video that leaves a lasting impression. Minimalist design, perfect videos in the background and only a few messages make this site an absolute masterpiece. MUST SEE! Two references of the agency are also exceptionally well: Drexel University Campaign and Osborn Barr.

Visit Website


Teehan and Lax – Impressive Full-Screen Menu

Agency Website with Great Full-Screen Menu

Agency Website with Great Full-Screen Menu

The agency Teehan + Lax website is the perfect synthesis of mobile user interface and minimal web design. The references are impressively staged on the home page slider. The navigation is only available on click but then in overwhelming beauty. Absolute MUST SEE!

Visit Website


Work – Genuine Project Navigation

Full-Width One-Page Website with Awesome Menu

Full-Width One-Page Website with Awesome Menu

The norwegian agency Work is a clear trendsetter with the high-spec website. The content of this page is packed very skilled in a one-page layout. The subject areas are clearly demarcated in color and both the references and the photos of the agency are placed in sliders. A special highlight is the project navigation hiding behind the yellow line in the margin. MUST SEE!

Visit Website


Fantasy Interactive – Full-Width Blog and Double Sidebar

Full Width Blog and Double Sidebar

Full Width Blog and Double Sidebar

The blog of the agency Fantasy Interactive skillfully uses the full-screen width. The individual news are spacious, fully linked and take a two-thirds of the screen. The sidebar on the right side is fixed and combined conventional footer and sidebar. The trend on normal websites is going more to mobile elements, which were originally optimized for touch gestures.

Visit Website


Team Geek – Award Winning Website

Award-Winning Website with Modern Design

Award-Winning Website with Modern Design

The multi-award winning website of the new zealand agency Team Geek is a classic one-page layout. A click on the navigation brings you to the appropriate content item.

Visit Website


Metro Design in modern Web Design

Metro style has become quite popular since Windows 8 came out. The design uses big tiles to separate the information. This kind of design is useful for portfolios, online-resumes and for eCommerce websites.


Etch – Grid Style Design

Grid Website with Filter and Flat Design

Grid Website with Filter and Flat Design

The app designers and developers of etch using their whole website for a single masonry. Each content item is placed in a separate tile, and those tiles can be filtered using the built-in jQuery Quicksand by category. What is usually known only as a product filter has been converted here to the navigation.

Visit Website


Float Design – Big Tiles for Projects

Flat Design and Grid Style

Flat Design and Grid Style

Tiles are used quite often as navigation elements right now. The designers of Float use this principle for their website very clever and combine it with a sticky navigation.

Visit Website


My Poor Brain – Full-Width Portfolio

Full Width Portfolio Website

Full Width Portfolio Website

The graphic designer and illustrator Tim from London also used tiles for his references across the entire width of the screen. A kind of synthesis between footer and navigation is located in the narrow strip on the left side of the screen.

Visit Website


TinyBigStudio – Big Content Tiles

Simple Designer Website with Portfolio

Simple Designer Website with Portfolio

The tinybigstudio by Pablo Dominguez also uses tiles to represent concepts and references. The colors are really typical for the flat design.

Visit Website


Extravagant and outrageous websites

If you are a web design and want to stand out from the crowd you can also use extravagant design. The following webpages show some great examples.


Webeffectual – Bold Design Elements

Bold Website with Big Typography

Bold Website with Big Typography

The bright CMYK colors of the Joomla and Drupal Agency are certainly not to everyone’s taste. However, the design is very modern and focused on the key content.

Visit Website


Filidor Wiese – Pixel-Art and CSS3 Effects

Cool CSS3 Effects for Different Times

Cool CSS3 Effects for Different Times

The lovingly animated website developer Filidor Wiese is definitely worth a visit. The digital version of Filidor is acting according to the time and doing some programming, sleeping or playing some games.

Visit Website


Ian Jamex Cox – Scroooooolllllling

One-Page Website with Awesome Scrolling

One-Page Website with Awesome Scrolling

The website of Ian James Cox was certainly a tough job. All content is on a page and the navigation brings you to the appropriate reference. This kind of one-page design is really cool.

Visit Website

Tobias Gebauer

Webworker, web developer and also web designer. I love blogging and working on my websites all the time. I like to share great web design inspiration, freebies and tutorials with the world :).

You may also like...

Pinterest