Layout

55 Beautiful Green Layouts in Web Design

GisMullr — Fri, 28 Aug 2009 14:57:49 +0000

And continuing the series 'Beautiful Layouts in Web Design', today is all about green! As any other color, green has tons of beautiful shades... sometimes it's even a bit hard being sure that it's green that we are looking at. But anyways, here is a great selection of Green Layouts for you to enjoy and get inspired about. Once again you will find here a bit of everything: flash, html, drupal, etc.

It's amazing the enourmous amount of good and beautiful websites we can find out there. There are for sure a lot of talented and creative designers and for sure many other great sites that are not listed here. So if you have anything to share, go ahead!! For this selection I browsed around: CSS Gallery - Design Shack, cssperk, CSS Import and Best CSS Gallery between some other sources such as deviantART. So I recommend you to check out these places, they have several websites to show. And also, click at the images to visit the websites we will show here...

Hope you like it! :)

And in case you have a suggestion for a next post (another color, style, etc), let me know via twitter.com/GisMullr.

Aenemya - Digital art and web design portfolio of Marie 'kReEsTaL' Guillaumet

Eco Environments Ltd

Freelance Switch

onehub

Visual Elixir

lionite portfolio

devthought

Nathan Sanders

markup4U

quadrifolia

psdtolife

mint

Silverbackapp

e-invent

Pink Cactus

coldcactus

SprintBio

Monk Development

The Foster Mobley Group

QueroMedia

Simply Invoices

Create a Revolution

Stormlab

frexy

Mint: A Fresh Look at your Site

graphiceyedea

Bepeck

Envato

Essences d'ici et d'ailleurs

RIPIE6

CSS Mania

ASDA Financial Services

CSS Import

Sprouter

Big Cartel

Sofitek

Lilly's Table

I Avion

Crazy Xhtml

LAQED

hrasti

Lipton Green Mint

Nybble Tech

Lisa Bun

Green Infrastructureinc

And some samples from deviantART (under development)

by KRoNiC-fx

by SencerBugrahan

by pho3nix-bf

by spaka

by koenigpersoenlich

by gajdoslevente

by detrans

by BuBBaspa

Suggested by @earthdesigner

EMOTIONS by Mike

Christine Galvin Design

Green Any Site

About the author

Someone with a bachelor degree in Foreign Trade that really likes technology, design, photography and creativity. A person ‘digging’ a new way as a ‘geek apprentice’, blogger 'wanna be' and a communication lover! Current location: Porto Alegre, RS – Brazil
Twitter user: gismullr

Sponsored Links:

52 Beautiful Blue Layouts in Web Design

GisMullr — Tue, 25 Aug 2009 13:44:18 +0000

One of the things that I like most about web design is its results... yeap, I love to see great designed websites, and for sure we can find a bunch of those out there. Today we will show some beautiful blue layouts in web design. At this selection you will find a bit of everything: flash, html, drupal, etc.

As I'm looking around for some inspiration for my personal site (that I'm putting together) and I know that everybody loves to check out a good design, I decided to make this selection to show you. Most of the sites from this selection were found at CSS Gallery - Design Shack and cssperk between some other sources, so I recommend you to check out these places. And also, click at the images to visit the websites we will show here...

Hope you like it! :)

And in case you have a suggestion for a next post (another color, style, etc), let me know via twitter.com/GisMullr.

Lucino & Gene Abogados

Best Electrical

Safe Driving Academy

Envira Media Inc

Bartelme Design

Maniac Monkey Media

Tropical Sky Diving

Graham McDonnell

Glacial Multimedia

dgerelo

CSS Garden

Alex Swanson

ZCOPE

Ballpark

cmsthatsuitsyou.co.uk

MonAssoc

FeedStitch

Kosh Creative

EyeDraw

Owltastic

leihu.com

Bluedots Design

Thermometer App

Have you flossed today?

Sourcebits

Istanbul Dental Works

Insight Studios

reichweite.cc

marketing-informatico.com

nclud

nitobi

Amit Khera

Squared Eye

Post Box

Sohtanaka

Drupalcon

nys.wri

sIFRvault

Koves Technologies LLC

Blue Bonnet Cafe

Ahlera

Jack Flavored Rums

Opal Cove Resort

dg web design portfolio

nirmal

Sphere

Powerset

LocalSearch in a Box

Carron Media

Design Disease

Designed by Fabio "abduzeedo" Sasso, Eduardo Sasso & Fabiano Meneghetti

Openjobs

Sikbox

About the author

Sponsored Links:

35 Black Web Designs That Show Us That Once You Go Black, You Never Go Back

PauloGabriel — Tue, 17 Mar 2009 13:33:00 +0000

It's been some time since we had our last post on the Web Design series. We've been giving you a lot of graphic design inspiration, but it's time to get some web awesomeness. Yesterday we had black wallpapers, today, it's all about black layouts.

In August 28th we had the first Black Layouts post, and it was a big success! And since we've featured Black wallpapers yesterday, we've decided that once in a while we'll make a color week. This is the beginning, the Black Week! And tomorrow we'll get more of black design inspirations! Hope you all enjoy my selection... I had a hard time finding these. Cheers! ;)

About the author

Hello, everyone! I'm Paulo Gabriel, designer from Porto Alegre, Brazil, born in 1984. I have worked as a webdesigner since 2006, but websites and blogs have been a hobby for me since 1999. Here in Abduzeedo, I try to bring only the hot stuff for you... and hope that all of you enjoy my posts! For more cool stuff, you may also follow me on Twitter.

Sponsored Links:

Design Deconstructed: WhiteHouse.gov

Youssef Sarhan — Sat, 21 Feb 2009 03:41:55 +0000

Hello, my name is Youssef Sarhan & I regularly write on my design blog over at www.whiteinkblog.com, and I also like to share my posts here, on abduzeedo. With a great audience and community it's a brilliant forum for discussion. In this feature I try to shed some light on the development process and/or elements of a selected design. By deconstructing the design into layout, typeface, colours & use of images we will hopefully develop a better understand of how the final result was achieved. I feel that this degree of awareness is crucial to a graphic designers development; being able to not only identify the design elements but the rationale behind them.(Via: www.whiteinkblog.com)

In this edition of Design Deconstructed (DD) I am going to be observing the brand new website of the White House (http://www.whitehouse.gov/).

Within minutes of President Obama being sworn in the new site had gone live. I'd imagine it has received a huge spike in visitors but it seems to be coping perfectly. I'm trying to find out the designer/company who is behind it, so if anyone knows?

It looks fantastic. It's clean, feels like a position of authority and most importantly approachable. It doesn't look like a news site, like it used to. Here's an image of the homepage.

As you can see it's pretty sharp looking. You can view a 100% version if you click the image. I have overlaid the grid over it, at least a grid which I think fits. It's a 3 column grid thats subdivided again into 3 more columns. The subdivisions really come into play in the bottom footer which has many links to different categories.

Starting at the top, I think the header shows the level and attention to detail that went into making this site look how it does. It's detailed, precise and well-planned. These small images can really set a design off.

Further down, a divider which separates the main content and the categorical links. You may like to click and view the image at 100%.

Similarly at the bottom.

Love the use of little stars in the required field instead of an asterisk*

Next is the Navigation, easy to use rollover bar, I love the use of italc/regular fonts. Set in Georgia.

I feel overall the site suits the new President. I'd love to see the development process to get a real idea of how it came to this end. It's a nice alternative to his also excellently designed www.change.gov website which he used during the campaign.

The subtle use of the semi-transparent white box is a nice touch. Nothing too over the top on the site but at the same time it stands out and airs class.

The primary typeface for titles of the site in Gerogia. Copied from what I think is the css.

h1, h2, h3, h4, h5, h6 {font-family:Georgia,"Times New Roman",Times,serif; color:#036;}

You can view the style.css file here:

http://www.whitehouse.gov/includes/eop/style.css

The body text is set in Lucida.

html, body {font-family:"Lucida Sans Unicode","Lucida Grande",Verdana,Arial,Helvetica,sans-serif;} body {font-size:12px; margin:0; padding:0;} strong, em, b, i, .bold {font-family:"Lucida Sans","Lucida Sans Unicode","Lucida Grande",Verdana,Arial,Helvetica,sans-serif;}

Finally, the colour palette consists of appropriate shades. Blue, Navy, Maroon, Grey, etc. Here is a simple drop selection from the blurred image.

Here is an image I was saving until the end; Its the before version, as you can see. It's a good change. A huge improvement from the previous site, which looked like a news site. Hopefully this will be a reflection on the presidency.

Check it all out here: www.whitehouse.gov

About the author

My name is Youssef Sarhan and I am a Graphic Design student at The National College of Art & Design, Ireland. I co-founded WhiteInk with my friend Tim Phelan; which we occasionally write on. I also talk about and give tutorials on motion design at Keyframe Kid. Have a read of either to learn more about who I am and what I do.