The 8 elements of design:
In this section of the post I will go over the 8 elements of design and what they are about, and their uses. It is good to think of these 8 elements more as components of your website more than anything else. We will now start going over the 8 elements.
1. Color(hue)– This is used when designing colors for your websites. This element is designed with use of the color wheel. There are a few different types of every color on the color wheel, there is a tint and there is a shade. Tint is where the color is lighter by adding white, where shade is making it darker by adding black. There are a few types of ways to choose your colors. For example a monochrome color scheme is all iterations of a given color.(Lynda)
2. Value(tone)– This is the degree of lightness or darkness in your website. Certain feelings can be related to colors, for example, light colors can be related to feminine. Dark can be related to masculine things, camping or sports.(Lynda)
3. Texture- “While I believe there are many techniques to achieve this one of the best items in my arsenal is textures. The proper and subtle use of a texture takes a design from being flat and dead to noticeable and alive.” -Josh Byers. Textures are very important, they can make a boring website and make it pop. It is good not to overdo your textures though, because too much can be a bad thing. (StudioPress)
4. Shape- It is a flat area bound by line, value or color. Shapes can either be positive or negative; positive bent the shape, negative being a cut-out of the shape.(lynda) Shapes can add interest to your websites and can make them more aesthetically pleasing, but your shapes should not be used for just aesthetics, you should use them to convey a message to your viewer. For example, you could use shapes as your logo.
5. Form– Is the overall weight of your shapes and how they relate to each other.(lynda) Shape can also be defined as a 3d object on a web page. (incredibleart)
6. Space(white-space)– An area or distance between content in your design, blank area.(lynda) white-space can be a controversial subject among designers and website owners; designers want like white-space, while website owners just want it filled up. Some advantages of using white-space is easier legibility, it can make your website more effective,and it can be aesthetically pleasing. Some of the reasons some people do not believe in using white-space is because they don’t want their users having to scroll, and want to put a lot of information on the page.(Boagworld)
7. Line– Is a mark real or implied on a web page which defines position and/or direction.(lynda) Lines can be considered one of the most basic elements of design. Lines can provide emotion, focus, or separate things.(Wikispaces)
8. Type– It is the fonts that you choose for your website, that affect your design. Fonts can evoke the right mood to your audience as well as communicate things. There are several typefaces for many fonts to use for your design. For example: Arial Regular, Arial Bold, Italic, and Bold Italic.(lynda)
The eight elements of design should be components in your web design that your should incorporate into you web page. Just Remember the things that we have discussed in this part of the article. (lynda)
Principles of design:
Where as the elements of design were components to your design the principles of design could be considered rules that you should follow when designing a web page.
1. Contrast– Juxtaposition of elements on your page to show emphasis.(lynda) High Contrast can be important to make things in your web page stand out. It can also be used with size, something bigger can be identified as more important.(webdesignerdepot)
2. Emphasis- Is when attention is focused on a single area, indicating that it is more important than other things on your page. It can be used to create a sense of flow on your page.(lynda)
3. Balance- Designs on your web page have a since of weight and are considered equal.(lynda) Balance can be used to help guide users to certain things in your web page. Symmetry can be used to keep every thing the same size and organized in your website. (onextrapixel)
4. Unity– Pleasing arrangement of parts within a web page.(lynda) Unity can help give a consistent identity to your brand or web page, and gives you a connection between your elements. Unity can be used to create a strong relationship in your web pages. One of the ways you can achieve unity is to use a color scheme and use repetition.(webdesign.tutsplus)
5. Pattern– Offers a way to keep your designs organized and provide a feeling of harmony through repeating elements.(lynda) Using patterns in your web page can add strength and realism to your pages.(sixrevisions)
6. Movement- Actual or suggestion of movement in a design(lynda) Change in direction or images that are related to each can provide imply movement, and changes in lightness or darkness.(kent)
7. Rhythm & Repetition- “Is something in a design that is repeated enough times to create a visible rhythm. In design, rhythm is created by simply repeating elements in predictable patterns. This repetition is a natural thing that occurs everywhere in our world. As people, we are driven everyday by predictable, timed events. The sun comes up every day and sets every day, the seasons cycle in predictable patterns every year, and we all know that the World Cup happens every four years. Rhythm in design is just re-creating that, re-creating these predictable timed patterns, creating a sub-conscience relationship with ourselves and creating comfort or familiarity.” -Patrick Cox.
8. Proportion– Relationship between things in a web page in terms of size, value, or degree.(lynda) Proportion can also be thought as as harmony of scale. Everything in your design should change similarly, if you make something big, you should make something else bigger.(vanseodesign)
9. Simplicity– It is the removal of anything that is not necessary in your web page, such as extra graphics. When done right reveals essence of a form.(lynda)
10. Gradation– It is a gradual change in design that occurs over a design. It can change in a series of stages, steps, or degrees. An example of gradation would be a gradient used in a web page. (lynda)
In conclusion, the 10 principles of Design are rules you should follow when designing your website. It is good too always keep these in mind when making decisions about your website. (lynda)
Jenkins, Sue. Lynda, n.d. Web. .
Byers, Josh. “Using Textures to Enhance Your Design.” StudioPress. N.p., n.d. Web. 12 Sept. 2013. .
Farley, Jennifer. “Elements Of Design: Shape.” SitePoint Elements Of Design Shape Comments. Sitepoint, n.d. Web. 12 Sept. 2013. .
Cox, Joe. “Elements and Principles of Design Student Handout.” Elements and Principles of Design Student Handout. Incredibleart, n.d. Web. 12 Sept. 2013. .
Boag, Paul. “Advice on Web Design and Digital Strategy from Paul Boag.” Boagworld Complete. Boagworld, n.d. Web. 12 Sept. 2013. .
Seugling, Michele. “Elements of Visual Design – Line.” Elements of Visual Design – Line. Wikispaces, n.d. Web. 12 Sept. 2013.
“Fully Understanding Contrast in Design.” Webdesigner Depot RSS . Webdesignerdepot, n.d. Web. 12 Sept. 2013. .
Hamiltonone, Stephanie. “The Concept of Balance in Web Design.” The Concept of Balance in Web Design. Onextrapixel, n.d. Web. 12 Sept. 2013. .
Cox, Patrick. “Developing Visual Rhythm in Web Design.” Codrops Developing Visual Rhythm in Web Design Comments. Tympanus, n.d. Web. 12 Sept. 2013. .
Turnbull, Connor. “Unity in Web Design.” Webdesigntuts RSS . Webdesign.tutsplus, n.d. Web. 12 Sept. 2013. .
Ahktar, Waheed. “Six Revisions.” Six Revisions RSS . Sixrevisions, n.d. Web. 12 Sept. 2013. .
“Design Principles – Movement.” Design Principles – Movement. Kent, n.d. Web. 12 Sept. 2013. .
Bradley, Steven. “How To Use Size, Scale, And Proportion In Web Design – Vanseo Design.” Vanseo Design. Vanseodesign, n.d. Web. 12 Sept. 2013. .