Lesson 1: Basic Principles of Web Design

Click for closed captioning

Next Step

Step 2: Design in Action

Click for closed captioning

In this video, you'll see two examples of two websites that are clean, professional and within your power to build by the end of the course.

You can visit the sites at www.lillypereira.com and www.furlined.com. Lilly Pereira is also interviewed below.

If you're looking for more web design inspiration, Site Inspire is a hub for quality web design. You can also find interesting sites among the Webby Award Winners, in Communication Arts and on the class Pinterest page.

Further Readings and Links

There's much more to learn about design principles.

The Pew Internet and American Life Project has data on how we use the Internet. As I perused the surveys on the site, the statistic that stood out is that 17% of adults browse the web mostly on their smart phones. Among teenagers the rate is 25 percent and growing. Are any of the statistics from Pew Internet that are surprising to you?

Recently, the FontShop Blog published a two-part series on visual hierarchy that does a nice job of summarizing the basic principles of designing in a visually purposeful way.

Ellen Lupton's essay "White Space" is a convincing verbal manifesto on the importance of designing with negative space. She wrote it for Ambidextrous magazine in 2009.

You can find all sorts of lists and tips relating to graphic design online. One of the more succinct and useful is "7 Key Principles That Make a Web Design Look Good" by Juul Coolen.


Next Step

Step 3: Meet a Graphic Designer

Click for closed captioning

Lilly Pereira is a graphic designer who works in Easthampton, Massachusetts.

Like all professionals, Lilly gets inspiration for her work from the work of other designers. Some of her favorite online spots to scout good news design are Designworklife, Dribbble, Behance and The Book Cover Archive.

As you start to design your own website, one of the smartest things you can do is look at the work of other web designers. Hierarchy, navigation, fonts, colors– all will be easier to create on your own website if you have ideas to emulate.

More About Fonts

"I'm totally comfortable being called a type nerd," Lilly told me.

For non-designers, the passion many professionals feel for typography comes as a surprise. In this basic class, we won't have time to get into the finer points of typography together. But if you'd like to learn more, Lilly's favorite websites about typography are Typographica and Fonts in Use. She also likes the FontShop Blog, which runs pieces on some of the design issues we've considered in this lesson.

Later in the class, we'll talk more about how to use Google Fonts, which has hundreds of web-ready, open source fonts.

Eames Harriet Series
Abril Alright Sans
Andes Detroit
Benton Sans Mercury
Miller Reina

Next Step

Log in to Moodle to complete Assignment 1.