A look at the Web Design Principles from our Web Based Software class.

1. WEB DESIGN
PRINCIPLES
Kelsey Kirkpatrick, Morgan Fruits, Kevin Georges

2. UNITY
Canvas – Unity
• All elements of the
website have the same
alignment (flush left)
• Easy to navigate
• All of the links are
similar to each other
• All professors use the
same process to upload
their files and
assignments, which
makes it more unified

3. VARIETY
Instagram – Variety
• Different photos create a
colorful collage of images
• Different sizes of images
make the page look more
interesting
• The page is still
organized even though
there is variety in the
images

4. BALANCE
Facebook – Balance
• Symmetrical design
because all of the
elements are evenly
balanced
• Toolbars on both left and
right make the page equal

5. SCALE & PROPORTION
Flickr – Scale & Proportion
• The images in the left
column are larger which
makes them more dominant
• Photos are larger than the
text because they are the
focus of the website

6. RHYTHM
Hugs for Monsters – Rhythm
• The illustrations on the website
direct your eye across the page
• The radial layout of the
illustration brings your attention
back to the center of the page

7. EMPHASIS
PSU – Emphasis
• The image of the students
on the home page is
isolated, therefore it
creates emphasis
• The size of the image on
the home page also
emphasizes its importance
• Image is placed in the
center of the screen which
creates a focal point

8. SIMPLICITY
Twitter – Simplicity
• White background of
the toolbars makes the
design look simplistic
• No extra elements
besides what is necessary
• Only using two columns
• Number of characters is
limited so there isn’t too
much text