Join Sue Jenkins for an in-depth discussion in this video Understanding the elements of design, part of Design Aesthetics for Web Design (2013).
- View Offline
In design school, graphic and web designers often learn about the formal principles and elements of design. These concepts can and should be used as guides in making important aesthetic decisions that can help you create more unique designs. With more distinctive areas of interest. So what are the elements of design? Simply put, you can think of the elements of design as the basic components involved with creating any design. Likewise, you can think of the principles of design as the rules of design which should always be considered even if you end up not using them.
The main difference between principles and elements is that principles are like the rules you should follow while elements are the things that will help you follow those rules for the best outcome. How many elements of design do we need to learn? There is some debate over how any elements there actually are. Depending on who you talk to, some say six, some say ten, I've even seen lists with numbers everywhere in between. So for our purposes with regard to designing for the web, we are going to say that there are eight elements of design and they are in no particular order, color, value, texture, shape, form, space, line and type.
And if you're like me, and you have trouble remembering huge lists, you might want to use an pneumonic device, that you can easily reorder these words in any way that makes sense to you to make up an easy to remember sentence, like this one that I made up. Ten very creative students speak 25 languages. And, the first letter of each word corresponds to one of the words in the eight elements of design. Now you know that there are eight elements of design. In the next set of lessons we'll examine each of these elements to see how they can directly influence the quality of a web design.
- Understanding aesthetics
- Picking harmonious colors
- Structuring your layout
- Using space to organize your design
- Communicating with the right fonts
- Aligning objects to achieve balance
- Adding movement with scrolling and animation
- Achieving proportion by scaling objects and text
- Creating CSS for different devices