Unit 3, Lesson 8 Principles of Design AOIT Web Design Copyright © 2008–2013 National Academy...
-
Upload
diana-stanley -
Category
Documents
-
view
218 -
download
5
Transcript of Unit 3, Lesson 8 Principles of Design AOIT Web Design Copyright © 2008–2013 National Academy...
Unit 3, Lesson 8
Principles of Design
AOITWeb Design
Copyright © 2008–2013 National Academy Foundation. All rights reserved.
A website’s design creates a first impression
• What is your first impression of this site?• Do you immediately know what the site does?• Do you know who the site belongs to?
There are five elements of effective web design
• Content
• Functionality
• Navigation
• Visual design
• Media (graphics, video, animation, and audio)
Can you give a specific example of how one of the photo book websites you looked at in the beginning of this lesson was successful with each of these elements?
Content is logical, accurate, web-friendly
• Logical, labeled categories
• Up-to-date, accurate, nonoffensive
• Clear, concise bullet points
• Contact info included• Clear instructions
where needed• Obvious links/visited
links• Text: high contrast,
consistent, correct size, no movement Does the web page on this slide meet
these criteria?
Functionality makes sites easy to use
• All links work
• Works on all of the major browsers
• Pages load quickly
• No registration needed to view basic information
• Back button not disabled
• Site map and/or site search engine available
• Short, memorable URL
Describe an error you have experienced while surfing the Internet.
Navigation is clear, logical, persistent
• Clear, logical site navigation persists throughout the entire site.
• Additional shortcuts or navigation methods are used as needed.
• Logo in the top left corner always leads to the home page.
Have you ever found something really cool on the web that you then weren’t able to find again?
Home Page
My Class Grading Newsletter
Comments Classmates
Visual design is professional and pleasing
• The site clearly represents the purpose.
• All pages have a consistent look.
• A coherent, elegant color scheme represents the company or products.
• The background color or design is simple and does not interfere with the body of the page.
Media enhances a site
• Meaningful graphics, video, animation, audio, and links to social media
• Not too many bells and whistles
• Highest quality media, optimized for the web
• Appropriate, consistent, andrelevant buttons and icons
• Not done “because you can”or “because everyone is doing it”
Apple.com has a lot of graphics. Why is the site still appealing and logical?
Review: The five areas of good web design
Element What to Aim For
Content Simple, audience-appropriate, and organized, and only necessary elements are included
Functionality Works on every browser and platform, with no errors
Navigation Consistent on each page, and the path is always clear
Visual design Intuitive, easy to read, consistent, clearly illustrates message/purpose
Media Use of media is relevant, meaningful