Web Design
Principles
By: Joe Robinette
Haylee Gregory
Caleb Renfro
Unity
Unity
 This website shows unity by having all
elements organized, equally spaced yet
still close together. It’s attractive to the
eye and easy to locate things.
Variety
Variety
 This site shows many different colors and a
large array of products they offer. It has
an interesting layout that adds to the site.
Balance
Balance
 There is an even distribution of text to
pictures. Everything is weighted evenly in
the middle drawing the eye in. It is
asymmetrically balanced with equal
weight concerning the pictures, text, and
blank space.
Scale & Proportion
Scale & Proportion
 The T-rex is larger than everything
providing excitement. The roller coaster is
much smaller in picture than it would be in
a real life setting.
Rhythm
Rhythm
 You can see the motion of the athletes by
their positions and angles as well as the
crowd being blurred out.
Emphasis
Emphasis
 The freshman are easily emphasized
contrasting the grass. The eye is drawn to
them because of their placement in the
photo. The outline of people in red shirts
helps to draw your eyes as well.
Simplicity
Simplicity
 It is very basic and to the point with a lot
of blank space to draw your eye right to
the main function of the site.

More Related Content

PPTX
Fundamentals of web development
KEY
navigation
PPT
Mmd2093
PPTX
Web navigation design with respect to cognitive science
PPTX
CIS1203 Web Design Principles - Part 1
PPTX
Web designing
PDF
10 elements of a successful website
PPT
28 Jan 2010 Jour3340 Website Design&Elements
Fundamentals of web development
navigation
Mmd2093
Web navigation design with respect to cognitive science
CIS1203 Web Design Principles - Part 1
Web designing
10 elements of a successful website
28 Jan 2010 Jour3340 Website Design&Elements

Viewers also liked (16)

PPTX
Elements of web design
PDF
A brief introduction on HTML5 and responsive layouts
PPT
J O U R 3340 Sept 22 Online Journalism
PPTX
Designelements
PPT
7 elements of a website designed for impact
PPTX
Web Designing Services
PPTX
Introduction to website design
PPS
Planning Site Navigation
PDF
Web Design Fundamentals By Ahmed Faris
PPT
Dreamweaver & Me PPT
PPTX
HTML and Responsive Design
XLSX
Website Layout
PPTX
Design your first website using HTML
PDF
Website Layout and Structure
PDF
Types of website (1)
PDF
Secrets For A Lean Body
Elements of web design
A brief introduction on HTML5 and responsive layouts
J O U R 3340 Sept 22 Online Journalism
Designelements
7 elements of a website designed for impact
Web Designing Services
Introduction to website design
Planning Site Navigation
Web Design Fundamentals By Ahmed Faris
Dreamweaver & Me PPT
HTML and Responsive Design
Website Layout
Design your first website using HTML
Website Layout and Structure
Types of website (1)
Secrets For A Lean Body
Ad

Similar to Web design principles (11)

PPTX
Graphic Design Elements&Principles
PPT
Design portfolio waugh
PPTX
Basic principles of grapics and layout
PPTX
Principle of design
PPTX
Logodesign1
PPTX
Logo design.ppt
PPTX
Design Principles
PDF
Principles of Landscape Design
PPT
Principles of design
PPTX
Graphic design composition
PPTX
Design principles
Graphic Design Elements&Principles
Design portfolio waugh
Basic principles of grapics and layout
Principle of design
Logodesign1
Logo design.ppt
Design Principles
Principles of Landscape Design
Principles of design
Graphic design composition
Design principles
Ad

Recently uploaded (20)

PPTX
Part 1A Time - Not Linear Its Cyclic Spiral.pptx
PPTX
Salinan Gaza War Israel-Palestine Conflict Slides.pptx
PDF
Printable Thai Gospel Tract - Be Sure of Heaven.pdf
PDF
Grandes mujeres que dejaron un legado para el mundo
PDF
Future Relevancy of Black Methodist Consultation (BMC) by Matthews Bantsijang
PPTX
Article--Non-Narrated--Davidson_The_Biblical_Account_Of_Origins_Long.pptx
PPTX
Sabbath school lesson 3rd quarter en_2025t309.pptx
PPTX
Why God? a Beginning Course on Apologetics - Part 1
PPTX
God, His Creation, His Game and Service to Him.pptx
PDF
1-TAUHID-Conscept of God in Islamic Relegioon1.pdf
PDF
Spiritual Life Blossoms When Truly Know Him - Slideshow
PDF
_OceanofPDF.com_Ayurveda_and_the_mind_-_Dr_David_Frawley.pdf
PPTX
The Three Laws- Doctrine of Salvation in Christianity
PPTX
What is Christianity and the whole history
PDF
He Bore the Sin of Many - part 1
PDF
15 August – Brave Stories of India’s Freedom
PDF
Light-On-Life-s-Difficulties-by-james-Allen.pdf
PDF
Krishna’s 8 Symbols and What They Represent
PPTX
Organizational Psychology Advance Notes.pptx
PDF
Life of Saint John Gabriel Perboyre, C.M.
Part 1A Time - Not Linear Its Cyclic Spiral.pptx
Salinan Gaza War Israel-Palestine Conflict Slides.pptx
Printable Thai Gospel Tract - Be Sure of Heaven.pdf
Grandes mujeres que dejaron un legado para el mundo
Future Relevancy of Black Methodist Consultation (BMC) by Matthews Bantsijang
Article--Non-Narrated--Davidson_The_Biblical_Account_Of_Origins_Long.pptx
Sabbath school lesson 3rd quarter en_2025t309.pptx
Why God? a Beginning Course on Apologetics - Part 1
God, His Creation, His Game and Service to Him.pptx
1-TAUHID-Conscept of God in Islamic Relegioon1.pdf
Spiritual Life Blossoms When Truly Know Him - Slideshow
_OceanofPDF.com_Ayurveda_and_the_mind_-_Dr_David_Frawley.pdf
The Three Laws- Doctrine of Salvation in Christianity
What is Christianity and the whole history
He Bore the Sin of Many - part 1
15 August – Brave Stories of India’s Freedom
Light-On-Life-s-Difficulties-by-james-Allen.pdf
Krishna’s 8 Symbols and What They Represent
Organizational Psychology Advance Notes.pptx
Life of Saint John Gabriel Perboyre, C.M.

Web design principles

  • 1. Web Design Principles By: Joe Robinette Haylee Gregory Caleb Renfro
  • 3. Unity  This website shows unity by having all elements organized, equally spaced yet still close together. It’s attractive to the eye and easy to locate things.
  • 5. Variety  This site shows many different colors and a large array of products they offer. It has an interesting layout that adds to the site.
  • 7. Balance  There is an even distribution of text to pictures. Everything is weighted evenly in the middle drawing the eye in. It is asymmetrically balanced with equal weight concerning the pictures, text, and blank space.
  • 9. Scale & Proportion  The T-rex is larger than everything providing excitement. The roller coaster is much smaller in picture than it would be in a real life setting.
  • 11. Rhythm  You can see the motion of the athletes by their positions and angles as well as the crowd being blurred out.
  • 13. Emphasis  The freshman are easily emphasized contrasting the grass. The eye is drawn to them because of their placement in the photo. The outline of people in red shirts helps to draw your eyes as well.
  • 15. Simplicity  It is very basic and to the point with a lot of blank space to draw your eye right to the main function of the site.