You know, we use ad-blockers as well. We gotta keep those servers running though.
Did you know that we publish useful books and run
friendly conferences — crafted for pros like
yourself? E.g. our upcoming SmashingConf Barcelona,
dedicated to smart front-end techniques and design patterns.

What do corporate websites have in common with other people’s children? Three things: they have their charm, like finger-paintings on the refrigerator; they can be useful, if infrequently; they are usually admired only by the people who created them. [Content Care Dec/22/2016]

While designers know that a user’s experience on a website has a large impact on the way that customer will interact with them, impressing that concept on the corporate establishment has taken a very long time. Trends in design are making their way into corporate web, albeit slowly; with patience and a little luck, businesses will soon start to consider carefully coded and appropriately functional design as important as their mission statement and recent sustainability reports.

One unfortunate fact is evident above all else: despite having plenty of money at their disposal, many corporations are lost in sterile MS Word-esque designs that are more stagnant than a museum exhibit… though at least museums have dinosaurs and mummies and stuff. Here’s hoping we all will get new corporate clients soon.

Below, we present some interesting corporate websites, although the insight they offer may not be immediately apparent. This review is not about aesthetics or visual appeal, but rather about the design solutions the sites exhibit. In fact, corporate websites aren’t as visually arresting as you might think, so if the appeal isn’t immediately apparent in the previews below, take a moment to visit and interact with each of them.

Levi Strauss & Co
With its website, Levis demonstrates that it has not only a strong flair for style and interactivity, but a rich sense of history. Hover over or click the photographs to see some of the company’s defining moments; ever known for its sense of identity, Levis draws you into its past, present and future, excellently breaking through to customers and inviting them to stay.

McDonald’s
By simplifying and softening the navigation, McDonald’s opens the entire screen up to use as canvas for their product. Harmonious colors in the typography complement the food (and exploit the visual association with hamburgers), while the vivid photography does not obscure surrounding elements.

Starbucks
Gentle colors and careful hierarchy of elements aside, Starbucks’ strength is in the details. The navigation exhibits an attention to hierarchy not often seen on corporate websites, while offering alternative destination links, should you find yourself in the wrong section. Such consideration for the user would be a welcome trend in design going into 2011.

Sony
You’ll see that this is a link to Sony Canada’s website. While the navigation and theme is the same as its American counterpart, the experience here is different: here you can see short films in which people relate their experiences of how Sony technology has enriched their lives. Best of all, a floating meter lets you sort stories into categories, giving you control of the content. Brilliantly executed.

Adidas
Few websites employ a grid design that is at once so rigid and flexible. Individual modules expand and contract to allow for dynamic exploration—a lot of fun, particularly because the website has so many parts to explore. The only thing to note is that images do not obviously reflects the content they open to display, necessitating the standard top-menu — an important point in usability.

Citroen
While the technique of using tiny images to fill a shape has been done a million ways, Citroen takes an old technique to the next level. Draw your cursor across the world to see the photos dance around it, beckoning you to select a region. An excellent use of a landing page, effectively drawing in users without information inundation.

Fender Guitars
While you may need to be a guitar player to fully appreciate the beautiful lines and tones of Fender products, you need only a pair of eyes to appreciate the simplicity and functionality of Fender’s website. Unobtrusive navigation at the top and hot links lower down make way for a large stage on which Fender can showcase the stars of its website: its beautiful instruments.

Heinz
One of the most recognizable brands in the world, Heinz has intelligently focused its website on its consumers. Rotate the globe by clicking on photos to see simple recipes from around the world. A design brilliantly suited to users of any skill level, Heinz has found a new means to engage their customers and entice them to visit more.

Prologue Films
Any company that designs opening credits and effects for movies needs a keen aesthetic sense, and Prologue Films’ visual dynamic is evident on its website. A clean grid with gray tones puts the company’s custom type and effects (an impressive collection) front and center, the same technique made famous by artists and photographers. Using a pop-up window for the content, though, is ill-advised.

Rolex
The beauty of this website is in Rolex’ masterful attention to detail. With the gorgeous products on display, the eye almost misses the clever tricks contained therein, such as the clock face that adjusts to your time zone. The intuitive user experience reinforces the notion that great design blends together. When it works right, it’s seamless.

Steinway & Sons
Lucky for us, Steinway invests as much effort into its website as it does into its pianos. Elegant type and warm subtle imagery grace this design and project an image of quality, undoubtedly the intended effect.

Aflac
While a blue and white palette is nothing new, Aflac has mastered the use of subtle gradients to enhance type. Smartly assembled, this site is intuitive and easily digestible. The clever part is the horizontal scrolling frame, a visual hook aptly used here to display customer testimonials.

American Standard
A gorgeous website; American Standard exemplifies grid design, employing the majority of frame as a news scroller. Intelligent use of color, elegant type and thoughtful spacing make this website particularly easy on the eyes.

Avery Dennison
At first glance, this might look like the website of any old manufacturer of office supplies. At second glance, though, brilliant little touches leap out:: the subtle grid, the attention to readability, the side-scrolling frame that harmonizes type, color and imagery. Oddly dissonant, the side and top navigations make this website looks almost as if it were a composite of different designs over time, a curiosity.

Con Edison
While the Con Edison website doesn’t have much to look at, the section for the annual report has been capably executed. Great attention to space, clean type and subtle movement are all used to great effect in this section where Con Edison addresses its corporate responsibility.

Grow Interactive
Most interactive firms don’t have exciting websites, which makes Grow stand out all the more. Grow demonstrates an expert use of type and illustration, moving your eye in perfect circles over the page, and nuances like the small interactive animals along the footer make it stand out among its peers.

PGI (formerly Premiere Global)
Here is another rare instance of a Canadian version surpassing its regional siblings. A playful take on the boxed blog/corporate theme, the website for PGI puts an interactive panel into the fold, an attractive way to draw users further into the website. The layout and color elements are evidence of authentic design acumen.

Rohm and Haas
This Fortune 500 company knows how to engage visitors online, with interactive features coming from every angle. The innovation in its products is reflected in the playfulness of the website, which encourages users to explore. Careful, effective use of otherwise familiar textures and themes support an engaging concept, to good effect.

Society for Environmental Graphic Design
While the inclusion of an organization of graphic designers in this showcase is no surprise, SEGD shines in its presentation of simple yet powerful elements. As any designer can attest, bold colorful shapes can easily run a design off course, but that isn’t the case here. SEGD has married vivid color with effective usability, creating a website that is smooth and wonderfully user-friendly.

Virb
Recently rebranded and redesigned, Virb demonstrates a capable grasp of visual elements even in this placeholder page: good typography, ample white space, soft shapes and forms — akin more to social media than standard corporate toadery, excellently indicative of the target demographic.

Acro Media
A Web development firm that knows exactly when to stick to the grid and when to break boundaries. The most impressive parts of this website are the way certain elements react to hovering, such as the company name in yellow at the top left. Mousing over it flips the logo around to display a toll-free number. Clever.

AgencyNet Interactive
The spirit of AgencyNet is clearly the team of creatives behind its work. Showing the team at work (and play) behind the scenes in the office is refreshing, well executed and a great way to engage viewers to learn about the company.

AmoebaCorp
A small creative firm, AmoebaCorp shows expert use of type on its website. The type establishes a strong hierarchy, enabling the content and navigation to coexist on the left without confusing the user about functionality.

Imaginary Forces
Less is more with Imaginary Forces, which displays its brilliant work as prominently as possible by cluttering the screen as little as possible. Even without the showcased work, the website would stand out: take away the grand images, and you’d still have a clever arrangement of type and navigation, which is more than can be said of most websites.

Kurylowicz & Associates
This Polish architecture firm has produced a website that bleeds inspiration from every pixel. Elegant in its use of gray tones, this website combines line, shape and space in a way no other website does. Perhaps it took an engineer to think abstractly enough to design with such abandon, but the result is brilliance online, from start to finish.

Vancouver Convention Centre
Aside from the harmonious colors and subtle grid that frames the content, the Vancouver Convention Centre succeeds by going the extra mile to make its website visitors feel local: the “Cheers!” factor in action. Not many websites impart a sense of belonging with their welcome; that this one does makes a strong case for using heart as a design tool as much as shape, color and texture.

Finding beautiful corporate websites proved to be quite a challenge, and we had to make a number of unusual choices along the way. We sought regional versions of international websites, for instance, because multi-national companies present a number of differences among their sister websites. Bizarrely, did you know that many Fortune 500 companies don’t even have websites? Or worse, have non-working ones?

Admittedly, the word “corporate” is pretty loose in definition here. For the sake of impartiality, we did not discriminate by industry or field. We were more interested in collecting websites that employ interesting techniques. Because innovative and fresh stand out on the Web whatever the industry, putting aside traditional definitions is crucial.

Johny Favourite

Speider

I wonder if clients are so discombobulated by web technology that they just sit there and allow the developers and designers do their thing? Maybe a bit of sparkling type and prancing unicorns are suggested here and there but rejected in the end?

-1

6

dsfsdf

Jables

Yeah… working for a a corporation my self bud they rarely let you “Do your thing.” Especially when marketing gets involved. They like to think of themselves at the highest echelon of design since their degree plan required them take intro to graphic design. They may know what looks good but they tend to get overly excited and cram everything that looks good all onto one page. (i.e. the Adidas site) As far as functionality is concerned its the designer/developers job to make sure that this “Cramming” is functional which the Adidas developers didn’t do a bad job at. So if the corporation wants unicorns and sparkling type they’ll get it no doubt about that. But that’s not what this article was about. This article was about functioning websites be they beautiful or not.

0

8

andy

I agree totally. I worked at a B2B agency for a short period and they tried to extract more contemporary designs from me. It didn’t work. Perhaps its the B2B mentality that discourages good creative hehe.

Stomme poes

Hm, these are showcased as usable websites?
I just recently got ahold of Jakob Nielsen’s Eyetracker study. Sites like the Rolex one (large image taking up space) did poorly (the example in the study was JCPenny). These all LOOK NICE, but do users skip over important text because the designer was trying not to look like 1990?
The company I work for sells clothing from brand names like Levi, and going through their corporate sites to get necessary product images or information has always been a frustrating experience, especially with all the slow Flash loading. But, luckily, I’m not a customer trying to buy something there… maybe that’s the difference. Maybe these sites aren’t for customers.

Design-wise, though, many of these are very beautiful.

0

11

bosh

Totally agree with this. These sites seem to think they are (posh) magazines and we have all the time in the world to browse right through them. We don’t. In fact, we don’t care at all really, given a few basic nice things are in place (clear nav bar, obvious info areas etc). We just want to find what we came to find, really quickly, and get on with the next thing we need to do in our very busy lives.

It’s not always popular to say these sort of things, but any ‘punter’ will more than likely agree with this perspective.

OK?

0

12

Age

If you think that we live in a utilitarian world where design has no meaning your dead wrong. There’s a reason why we have Bently and a Ford – in the end both are cars right? Also, design evokes emotions and most decisions are based on emotion believe it or not – marketing 101.

Also, ironically you emphasis that no one has the luxury to engage with a site due to lack of time yet you find time to comment on this site…

Open your eyes bro and start appreciating the finer details in life, OK?

0

13

Speider

If you drive a Bently, you will see the difference from a Ford. Performance is the key in any product. The design entices (hence the emotion response), enhances usability (salability) and sells the product (needs satisfaction). Design, however, is secondary to usability. Lose that and you lose sales and even decay your branding.

This is why design by committee destroys all three main factors, ergo (with a bit of a jump over other factors), no consumer confidence.

Speider

@lee – No, people want to look at pictures, see a list of the functions and while they say, “if you have to ask the price, you can’t afford it,” the price as times have changed (no pun intended). They want the two most basic functionalities; visuals and information they can comprehend. Within that — within the design, functionality rules. So why can’t beauty and functionality co-exist? Probably because there was some non-creative interaction.

As for “giving up” on the web site — how many times have we all gotten impatient and promised ourselves we’d “come back?” It won’t sell more Seikos to Rolex lovers…unless it’s within their real budget.

Keep in mind the demographic of the consumer. The site is mostly visited by those who dream of owning such a time piece. Edge consumers will check it out online so they are not embarrassed in the store by asking. Those rich enough to not care are usually just given the watch so the manufacturer can say “so-and-so wears one!” Otherwise a weekly shopping trip on Rodeo Drive might have them pick one or two up.

0

16

Age

@Speider – I really wish that a lot of these self proclaimed experts that troll these websites really had a chance to come down to the city and participate in the kind of research we do. I’m not talking about reading some usability document online and making it the “law”.

If we put together a focus group where two versions of the Rolex site was presented: one looking like Craigslist (the world you propose) and one with a big image of a water splash hitting a Rolex watch (current site) the splash would win 9/10 times. I’m sorry to inform you this but people gravitate towards beauty over anything else. You have to stop assuming that people would analyze a website like you would – most people don’t live in a world of zeros and ones. Design wins every time.

fabivs

SavJag

We’ve recently redesigned the corporate website for the Landmark Group, a leading retail and hospitality conglomerate in the Middle East and India. landmarkgroupme.com/. Would appreciate feedback from the Smashing community…

0

25

sfensony

Nice first look does not define good sites at all. They should be usable and some of these are far from it.

I.e. Prologue Films page which seems to be OK unless you try to go for more content and see light blue texts mixed with light blue background lines on white page. WTF is that? How much contrast they’ve set up on their screens to consider this readable?

Apart from it: Citroen site is the worst IMHO. Waited 3 minutes (loading) to see Flash which immediately gave me an impression that Citroen is trying to run away from me. reminded me about old pranking software which was taking control over Windows Start button.

pakaworld

Phil

Sorry but I don’t really agree with your selection. rolex.com for example has some massive usability issues, mcdonalds.com looks nice on the home page but suffers from inconsistency on deeper levels and starbucks.com is massively overloaded. And citroen.com? Seriously? I had to load a flash, click 4 times to get my country, click once more to chose my language, was redirected to another page, load an other flash and then I could start using the page.

0

36

Jack Nycz

The ‘inconsistencies’ are individual page styling – something I rather like in a website. Check out http://jasonsantamaria.com/ – Jason Santa Maria is one of the most respected and sought after web guys in the world right now and every single one of his articles is styled differently based on whatever he is writing about in that article. I agree with you on Rolex though – but then again, Rolex isn’t looking to grab any customers with their website. If your going to get a Rolex, their website will not make that decision for you, more so your bank account!

Karthikeyan

Paul Foth

This is a bit of a tangent to the main thrust of the article, but the labelling of museum exhibits as “stagnant” in the third paragraph isn’t a legitimate generalization. Having experience in both the museum and the Web worlds, I see a lot of similarities between exhibits and Web sites. Just as there are outstanding Web sites, there are also outstanding museum exhibits, where much attention is devoted to things like interactivity, interpretive context, content selection and composition, color choice, and how the user selects what material to examine. It’s not stretching things too far to say that a Web site is a particular kind of exhibit, and that Web designers and developers and exhibit designers and developers could learn a few things from each other.

0

48

Bobby Foley

That’s a very good point, Paul. To be clear my intention wasn’t to slag museums but to draw upon a generalization. In actuality, I imagine that museum curators must be busy individuals with the way exhibits are so immaculately presented.

I agree with you that we could learn things from them, particularly in that a sense of culture can add subtext and heart to any work. Thank you for reading, and for bringing up a good point.

0

49

Paul Foth

Thanks for the clarification, Bobby. Interesting that you bring up the word “curator,” because it’s starting to be applied to the Web world in the context of content curation–i.e., the strategic selection, arrangement, and interpretation of a site’s content.

Bobby Foley

Habit, I suppose — the few people I know in that world are curators at small city galleries. And really, I think few terms adequately inspire the vision and personality required in such a role.

I think that the concept of curation has been long overdue in web design, it’s a shame that’s it’s taken until now for the community to consider; as the method of delivery of the imagery and content is arguably (and in many cases, lamentably) for important than the content itself, it seems like a natural progression.

0

51

Andrew

All web production is an exhibit, definition: ‘to make manifest; explain’ – can’t think of one instance in 10 years web design these haven’t applied: you’re making something real, tangible, presenting it to the world and providing information (explaining the character, motivations etc) through words, sound, imagery, animation etc.

0

52

Tom

This is a great example of what you can do when you have great source material to draw from.

A reality though – even of some larger corporate web sites – is you are only as good as your source material and no – they don’t have the budget or inclination to do any photography – because the over-filtered, overtly saturated, photoshopped images are all we have – even if they are from 1995 (we don’t know where the source images are).

So – yes – this article is great inspiration – if only my clients sold Steinways or Rolexes.

Saurabh

Tim S

Excellent article. I’d love to see a similar article that specifically focuses on “catalog” companies, i.e. companies that need to showcase a very large number of products and clearly showcase them and allow users to sort intelligently through them. Amazon is the obvious example, but other interesting ones to evalute might be shoe companies (shopnewbalance.com), music companies (bigfishaudio.com), fashion companies (express.com), gadget companies (monoprice.com, meritline.com, focalprice.com), supply companies (rima.com), etc…

There is an art to having a clean design yet giving as-easy-as-possible access to hundreds/thousands of products and conveying that you carry everything the customer could ever want.

Amanda

I really like this list… great to see how traditional companies are pushing the edge in web…. my only wish is that so many of the sites NOT be from creative firms. While these are great to see, as they are always cutting edge and interesting, I think it is much more helpful to see how non-creatives are able to market their products in inventive ways. Thanks for posting some great sites!!

0

63

Alan Aragon

mike

What exactly did you like about Rolex user experience? What do you think a +40 client with no or small web experience would do when entering the site? I’m sure he’ll understand that when you click the “right button” you can go from stories of a watch to another watch…

Moksha

Jacky

I think the SEGD site is actually a bad example. It’s content and imagery are restricted to the boxes. Which is too bad because since it’s an environmental graphics showcase website, it should have large enough pictures for people to clearly see the photograph details.

Also, I found the nav to be quite annoying. It’s slow and sometimes you can’t see that the other tabs are since the current one over laps. The inner menu is horrible. Once you’re inside a project showcase, you there’s no back button to go back up a level.

Matt Blalock

Seriously? The Lens Crafters website looks like a load of crap to me. It’s nothing like their genius marketing, the warming emotion their ads and stores tend to evoke. It’s cold and distant… and almost entirely utilitarian.

Kenneth B

Vikesh Patel

Some nice websites listed, i like the ‘Grow interactive’ website the design concept is simple. But with little details such as the textured backgrounds, bold typography and flash animations the site looks interesting.
also really like the design for the ‘prologue’ website, the typography and lined background makes the site look like a futuristic notepad however its not the easiest website to navigate around.

IronPhoenix

facundo

It is funny how to see while people still talking shit about flash platform, it is still a reality (and will be) that if you want to create a UNIQUE web experience you can forget about HTML. As always. Didn´t expect to see them on SM where it seems that you guys have something against the flash platform.

The only reason I see why people don´t like flash is because they don´t know how to use ActionScript. The same goes for the usability and “user friendly” gurus. Each website is different, each project is different, each client has a different goal and target and to try to set up golden rules on the subject, is just stupid. You can discuss it all the day long but at the end, is like the colors, each one have their favorite and you can´t say people why red is better than blue. It does not work like that in the real world.

Kai

Matt Blalock

Why doesn’t Smashing Magazine create a design gallery? You’re uniquely positioned to market the gallery – I’d expect you to become a market leader in design gallery/css gallery in a matter of months. I have no idea what the stats are for those galleries, but I’d expect it could be similar to Smashing Magazine.

Feature selections of the gallery in posts just like this, but direct users to the gallery for an even broader selection. To monetize, offer positions in the gallery listings for sponsor to designers and service providers.

If you’d like more advice/input on the topic, I’m available for a quick chat.

marcs

Victoria Blount

Some nice websites listed, i like that they don’t conform to the standard layout restrictions that designing a corporate website can provide. The only concern i would have is, if the user isn’t web savvy then it will be more difficult to navigate the unusual layout and they may be put off.

0

92

Erwin Heiser

Hate to say it but most of these are terrible and terribly over reliant on flash. Why the hell is the Grow site even in Flash?
Standout for me is the Steinway site: classy, understated, beautiful typography, its homepage even validates.

Tyler Herman

ross

all flash websites? I remember back in 04 i used to do all flash sites and was like yea thats cool no restrictions, then a .net developer came over to me and said thats stupid. He was right, people want content now and clean designed. Its better to be a designer with restrictions then without, and I think flash now works on a couple mobile platforms. Flash is not mobile friendly yet, and more importantly, people dont just look at one website at a time. With at least 10 windows open, I dont want these all flash sites to slow down my comp. Seriously, I like flash used as elements of the site, but sick and tired of hearing every marketing director and owner of a company saying I like that cool flash stuff..yea I like cool effects too, I’ll just prefer to go to the imax to see cool effects.

0

97

Jerky Oats

Some inspiring website designs ideas, I like some of the imagery that the designers have used with these designs. Although some of the website are quite flash heavy, which created longer loading times.

Darrow Alexander

Allie

For me, this list is 50-50. Some are gorgeous and really are beautiful and creative. Then the other half- (especially Avery, PGI, and even ((for me)) the Society for Env. Graphic Design) are not beautiful nor very creative.
I do not click on the links, just look at the screen shots, so just going by visuals, but PGI is just, badly designed. The dots make the whole front page look cluttered and there’s no defining- this is the important (or main part) of our site. Just don’t like it.

pete

Subscribe to our email newsletter for useful tips and valuable resources, sent out every second Tuesday.

Please provide us with your email address:

As designing static pages has become untenable, many have started to approach design in a modular way.
In this book, we’ll identify what makes an effective design system that empowers teams to
create great digital products.
Pre-order the book now →

Today, too many websites are still inaccessible. In our new book
Inclusive Design Patterns, we explore how to craft
flexible front-end design patterns and make future-proof and accessible interfaces without extra effort. Hardcover, 312 pages.
Get the book →

Meet the new Sketch Handbook, our brand
new Smashing book that will help you master all the tricky, advanced facets of Sketch. Filled with
practical examples and tutorials in 12 chapters, the book will help you become more proficient in your work.
Get the book.

Trends don’t matter, but techniques do.
With SmashingConf Barcelona, we’ll explore problems,
smart solutions and lessons learned from actual projects.
Taking place on October 17–18 at the Palau de la Música Catalana.
To the tickets →