By Jeff Kline

Blog

Simplicity in Nonprofit Web Design

Thursday, March 21, 2013

Frank Lloyd Wright and Dieter Rams on Web Design

The concept of simplicity is nothing new. It’s the one style of web design that can’t really be called a “trend.” But somehow, many of us seem to forget the importance of stripping away the excess, opening up the whitespace, and narrowing the focus to a single idea.

Last week we talked about Apple, and the innovative design philosophies Steve Jobs and Jony Ive embraced to bring us the simplistic and stunning iPods, iPads and iPhones we know and love.

But as we know, all the best artists borrow from those who came before them. Before Jobs and Ive embraced simplicity, there was Dieter Rams.

dieter rams radio and apple ipod

Left: Pocket radio (model T3) designed by Dieter Rams; Right: Apple iPod

DIETER RAMS

Form Follows Function

Dieter Rams was Braun’s chief design officer from 1961 until 1997. He is a strong believer that form follows function – that a product’s design should be based solely on the way in which that product functions. As he states in his Ten Principles of Good Design, “ Good design emphasizes the usefulness of a product whilst disregarding anything that could detract from it.”

Ask yourself – what is the function of your nonprofit website? How do you want visitors to use it? How does your website support your internet marketing strategy?

clientuploads/google1.pngclientuploads/yahoo1.png

With a quick glance at the Google homepage, its primary function is clear. With Yahoo!, not so much. I think Google’s understanding of web design and user experience is one of many reasons it surpassed Yahoo’s dominance in the search market during the early 2000’s.

Less, But Better

Dieter Rams is famously quoted for saying, “Weniger, aber besser.” Less, but better. He believes not just in simplicity, but also in centering the user’s focus on the most important elements of a product. 

Which are the essential aspects of your nonprofit website, and which are the non-essentials? On a single page, place only what’s most important and absolutely necessary.

Embrace whitespace. It improves readability and makes a good first impression, encouraging visitors to dig deeper into your website. 

Here are a few examples of brilliant use of whitespace (courtesy of Treehouse):

https://www.accrisoft.com/clientuploads/nudge.png

https://www.accrisoft.com/clientuploads/sofa.png

clientuploads/philiphouse.png

Environmentally-Friendly

Another one of Rams’ Ten Principles is that “good design is environmentally-friendly.” Rams advocates for design that avoids visual pollution of the product’s environment. He famously applied this concept to a barely-there shelving unit he designed for Vitsœ.

clientuploads/dieter-rams-vitsoe-606.jpg 

But how do you apply this “environmentally-friendly” concept to your nonprofit website design? Let’s ask Frank Lloyd Wright.

FRANK LLOYD WRIGHT

clientuploads/fallingwater.png

Frank Lloyd Wright was a famous architect who designed more than a thousand structures in his lifetime, but is probably best known for the design of Fallingwater.

Wright’s design philosophy, which he dubbed “organic architecture,” involved a harmonious relationship between a structure and its environment. That’s why, when he set about creating a nature retreat for the wealthy Kauffman family, Wright designed a home that would be built directly on top of a waterfall. He didn’t want the family to just look at the falls – he wanted them to experience the falls.

To create a truly harmonious design, Wright incorporated many of the site’s natural elements into the home. The hearth around the fireplace, for example, was constructed using boulders found nearby. The stone floors of the living room were waxed, so that they would resemble the stream below. And the jutting terraces of the house were arranged in a way that mimicked nearby rock formations.

The result is a house that blends into its environment and becomes one with nature.

clientuploads/fallingwater2.png 

Think about your website’s environment – the screen on which it is viewed. 

Whether it’s a large desktop monitor, a laptop, a tablet or a smartphone, your website’s environment is quite different from a leafy woodland retreat. It’s sleek, simple and sophisticated. Incorporate that same sleek style into your nonprofit website design.

Take into account how different colors, typefaces and font sizes will appear. Consider how your web design will look on different screen sizes. And be sure to leave in plenty of whitespace to create that elegant, sleek look that will make your web design truly harmonious with any visitor’s device. 

clientuploads/renoir.jpgGETTING PASSIONATE ABOUT WEB DESIGN

Please forgive me if I was a bit too philosophical in my thoughts and feelings regarding nonprofit website design. It’s just that I view great web design with the same passion of an art lover viewing Renoir’s Le Dejeuner des Canotiers, or in the same way Coach Bill Walsh of the San Francisco 49ers would marvel at Joe Montana’s ability to snatch a victory from the jaws of defeat. I get the same feeling of exhilaration a wine connoisseur experiences when a 1947 Chateau Cheval Blanc runs down the glass and first touches the lips. 

I’m passionate about web design because I believe it is a reflection of an organization’s soul, a powerful tool for driving revenue, and a key component to a successful internet marketing strategy that accomplishes business goals. That’s why I’ll be continuing to blog about nonprofit website design practices for the next several weeks. I encourage you to follow along! 

YOUR TURN

Do you think of your nonprofit website design as just another piece of your branding and marketing efforts - or do you believe it is a reflection of the heart and soul of your organization? Share your thoughts in the comments section below!

Comments

comments powered by Disqus

Need Support?

Submit a Ticket
Back to top
Ready to Get Started? Contact Us for Pricing