SlideShare a Scribd company logo
1 of 18
Web Design: Important Concepts Staci Trekles  Purdue University Calumet
Basic Rules to Live By  ,[object Object],[object Object],[object Object]
Basic Rules to Live By ,[object Object],[object Object],[object Object],[object Object],[object Object]
What do we mean by  “audience”? ,[object Object],[object Object],[object Object]
For example… ,[object Object],[object Object]
Another example… ,[object Object],[object Object],[object Object],[object Object],[object Object]
One more set… ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
When designing for an audience ,[object Object],[object Object],[object Object],[object Object]
User Preferences ,[object Object],[object Object],[object Object],[object Object]
User Preferences ,[object Object],[object Object],[object Object]
User Preferences ,[object Object],[object Object],[object Object]
So what makes a page  “good”? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
So that means that a good web page is a boring one… ,[object Object],[object Object],[object Object],[object Object],[object Object]
Good Designs Get the Message Across ,[object Object],[object Object],[object Object],[object Object],[object Object]
How about these? ,[object Object],[object Object]
What are your favorites? ,[object Object],[object Object],[object Object]
Useful Resources ,[object Object],[object Object],[object Object],[object Object],[object Object]
Recommended Reading ,[object Object],[object Object],[object Object],[object Object]

More Related Content

What's hot

What's hot (12)

Hammer or Screwdriver - Web 2.0 Tools
Hammer or Screwdriver - Web 2.0 ToolsHammer or Screwdriver - Web 2.0 Tools
Hammer or Screwdriver - Web 2.0 Tools
 
The SADIe Transcoding Platform
The SADIe Transcoding PlatformThe SADIe Transcoding Platform
The SADIe Transcoding Platform
 
Module 08: Responsive Web Design
Module 08: Responsive Web DesignModule 08: Responsive Web Design
Module 08: Responsive Web Design
 
Usabilty Heuristics explained
Usabilty Heuristics explainedUsabilty Heuristics explained
Usabilty Heuristics explained
 
Webdesign (2)
Webdesign (2)Webdesign (2)
Webdesign (2)
 
UX for startups - Wayra workshop
UX for startups - Wayra workshopUX for startups - Wayra workshop
UX for startups - Wayra workshop
 
Access User Experience
Access User ExperienceAccess User Experience
Access User Experience
 
Rock Your School's Website - Stacy Jagodowski & Peter Baron
Rock Your School's Website - Stacy Jagodowski & Peter BaronRock Your School's Website - Stacy Jagodowski & Peter Baron
Rock Your School's Website - Stacy Jagodowski & Peter Baron
 
15 Problems Which Creates in Good Website
15 Problems Which Creates in Good Website 15 Problems Which Creates in Good Website
15 Problems Which Creates in Good Website
 
corePHP Usability Accessibility by Steven Pignataro
corePHP Usability Accessibility by Steven PignatarocorePHP Usability Accessibility by Steven Pignataro
corePHP Usability Accessibility by Steven Pignataro
 
The 10 Golden Usability Heuristics (Montreal Girl Geeks September 2014)
The 10 Golden Usability Heuristics (Montreal Girl Geeks September 2014)The 10 Golden Usability Heuristics (Montreal Girl Geeks September 2014)
The 10 Golden Usability Heuristics (Montreal Girl Geeks September 2014)
 
Sitios Flash vs sitios no Flash
Sitios Flash vs sitios no FlashSitios Flash vs sitios no Flash
Sitios Flash vs sitios no Flash
 

Viewers also liked

Lab 3: WWW and HTML
Lab 3: WWW and HTMLLab 3: WWW and HTML
Lab 3: WWW and HTML
vanessajade
 
Lab 4: Introduction to HTML
Lab 4: Introduction to HTMLLab 4: Introduction to HTML
Lab 4: Introduction to HTML
vanessajade
 
Fundamentals of Web building
Fundamentals of Web buildingFundamentals of Web building
Fundamentals of Web building
RC Morales
 

Viewers also liked (10)

Understanding social justice through instructional design
Understanding social justice through instructional designUnderstanding social justice through instructional design
Understanding social justice through instructional design
 
Lab 3: WWW and HTML
Lab 3: WWW and HTMLLab 3: WWW and HTML
Lab 3: WWW and HTML
 
Learn html through programs
Learn html through programsLearn html through programs
Learn html through programs
 
Web design basics_02
Web design basics_02Web design basics_02
Web design basics_02
 
Lab 4: Introduction to HTML
Lab 4: Introduction to HTMLLab 4: Introduction to HTML
Lab 4: Introduction to HTML
 
Web design basics
Web design basicsWeb design basics
Web design basics
 
Web Design 1: Introductions
Web Design 1: IntroductionsWeb Design 1: Introductions
Web Design 1: Introductions
 
Fundamentals of Web building
Fundamentals of Web buildingFundamentals of Web building
Fundamentals of Web building
 
HTML practicals
HTML practicals HTML practicals
HTML practicals
 
Basics of Web Design: A primer of what you need to know to design for the web
Basics of Web Design: A primer of what you need to know to design for the webBasics of Web Design: A primer of what you need to know to design for the web
Basics of Web Design: A primer of what you need to know to design for the web
 

Similar to Basics of Web Design

web design
web designweb design
web design
butest
 
Basic webpage layout and design
Basic webpage layout and designBasic webpage layout and design
Basic webpage layout and design
Andz Bass
 
BYU-Idaho Web Developers' Information Session 2011-05-16
BYU-Idaho Web Developers' Information Session 2011-05-16BYU-Idaho Web Developers' Information Session 2011-05-16
BYU-Idaho Web Developers' Information Session 2011-05-16
BYUIWebmaster
 
1 httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2 ht.docx
1  httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2  ht.docx1  httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2  ht.docx
1 httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2 ht.docx
jeremylockett77
 
Web design , accessibility, and usability tips in Blackboard
Web design , accessibility, and usability tips in Blackboard Web design , accessibility, and usability tips in Blackboard
Web design , accessibility, and usability tips in Blackboard
Wilmington University
 

Similar to Basics of Web Design (20)

Java Unit 5(part 1)
Java Unit 5(part 1)Java Unit 5(part 1)
Java Unit 5(part 1)
 
web design
web designweb design
web design
 
UID BIT Coursework
UID BIT CourseworkUID BIT Coursework
UID BIT Coursework
 
Webdesign
WebdesignWebdesign
Webdesign
 
Basic webpage layout and design
Basic webpage layout and designBasic webpage layout and design
Basic webpage layout and design
 
BYU-Idaho Web Developers' Information Session 2011-05-16
BYU-Idaho Web Developers' Information Session 2011-05-16BYU-Idaho Web Developers' Information Session 2011-05-16
BYU-Idaho Web Developers' Information Session 2011-05-16
 
Usability Shmoozability for MCWT Foundation
Usability Shmoozability for MCWT FoundationUsability Shmoozability for MCWT Foundation
Usability Shmoozability for MCWT Foundation
 
Martin Bazley - using simple technologies with different audiences (reduced f...
Martin Bazley - using simple technologies with different audiences (reduced f...Martin Bazley - using simple technologies with different audiences (reduced f...
Martin Bazley - using simple technologies with different audiences (reduced f...
 
Inclusive design: real accessibility for everyone
Inclusive design: real accessibility for everyoneInclusive design: real accessibility for everyone
Inclusive design: real accessibility for everyone
 
Web Design Phase
Web Design PhaseWeb Design Phase
Web Design Phase
 
Creating online learning resources royal collection 18 jan 2011 reduced images
Creating online learning resources royal collection 18 jan 2011 reduced imagesCreating online learning resources royal collection 18 jan 2011 reduced images
Creating online learning resources royal collection 18 jan 2011 reduced images
 
Web Usability Page Design
Web Usability   Page DesignWeb Usability   Page Design
Web Usability Page Design
 
1 httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2 ht.docx
1  httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2  ht.docx1  httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2  ht.docx
1 httpswww.eeoc.goveeocnewsroomrelease10-7-19.cfm2 ht.docx
 
TrueCrime - Redesign FFW Slides.pptx
TrueCrime - Redesign FFW Slides.pptxTrueCrime - Redesign FFW Slides.pptx
TrueCrime - Redesign FFW Slides.pptx
 
November 2016 - ECN - You're Speaking Drupalese to Me
November 2016 - ECN - You're Speaking Drupalese to MeNovember 2016 - ECN - You're Speaking Drupalese to Me
November 2016 - ECN - You're Speaking Drupalese to Me
 
Solid Web site Design Guidance Any individual Could Utilize
Solid Web site Design Guidance Any individual Could UtilizeSolid Web site Design Guidance Any individual Could Utilize
Solid Web site Design Guidance Any individual Could Utilize
 
Martin bazley Creating effective content 15 Mar 11
Martin bazley Creating effective content 15 Mar 11Martin bazley Creating effective content 15 Mar 11
Martin bazley Creating effective content 15 Mar 11
 
Web designing chapter 01
Web designing chapter 01Web designing chapter 01
Web designing chapter 01
 
Web usability MKS
Web usability MKSWeb usability MKS
Web usability MKS
 
Web design , accessibility, and usability tips in Blackboard
Web design , accessibility, and usability tips in Blackboard Web design , accessibility, and usability tips in Blackboard
Web design , accessibility, and usability tips in Blackboard
 

More from Staci Trekles

More from Staci Trekles (20)

iPads in the Classroom
iPads in the ClassroomiPads in the Classroom
iPads in the Classroom
 
1:1 in the Elementary Setting: One Year Later
1:1 in the Elementary Setting: One Year Later1:1 in the Elementary Setting: One Year Later
1:1 in the Elementary Setting: One Year Later
 
Independence, Critical Thinking, and Blended Learning
Independence, Critical Thinking, and Blended LearningIndependence, Critical Thinking, and Blended Learning
Independence, Critical Thinking, and Blended Learning
 
Mitigating Cheating and Plagiarism
Mitigating Cheating and PlagiarismMitigating Cheating and Plagiarism
Mitigating Cheating and Plagiarism
 
Differentiation and Apps: Understanding your students and course design
Differentiation and Apps: Understanding your students and course designDifferentiation and Apps: Understanding your students and course design
Differentiation and Apps: Understanding your students and course design
 
Are we seriously going 1:1 this year? A case study of teacher perceptions in...
Are we seriously going 1:1 this year?  A case study of teacher perceptions in...Are we seriously going 1:1 this year?  A case study of teacher perceptions in...
Are we seriously going 1:1 this year? A case study of teacher perceptions in...
 
Scholarship of Teaching and Learning - Data Analysis
Scholarship of Teaching and Learning - Data AnalysisScholarship of Teaching and Learning - Data Analysis
Scholarship of Teaching and Learning - Data Analysis
 
2016-2017 Mentorship Program details
2016-2017 Mentorship Program details2016-2017 Mentorship Program details
2016-2017 Mentorship Program details
 
Using Mnemonics to Engage Students and Improve Recall: The Simersong Story
Using Mnemonics to Engage Students and Improve Recall: The Simersong Story Using Mnemonics to Engage Students and Improve Recall: The Simersong Story
Using Mnemonics to Engage Students and Improve Recall: The Simersong Story
 
Scholarship of Teaching and Learning - Design and Analysis
Scholarship of Teaching and Learning - Design and AnalysisScholarship of Teaching and Learning - Design and Analysis
Scholarship of Teaching and Learning - Design and Analysis
 
Scholarship of Teaching and Learning - IRB
Scholarship of Teaching and Learning - IRBScholarship of Teaching and Learning - IRB
Scholarship of Teaching and Learning - IRB
 
Elementary 1:1 iPad Implementation: Successes and Struggles in the First Year
Elementary 1:1 iPad Implementation: Successes and Struggles in the First YearElementary 1:1 iPad Implementation: Successes and Struggles in the First Year
Elementary 1:1 iPad Implementation: Successes and Struggles in the First Year
 
Blended Learning: Doing it Right the First Time
Blended Learning: Doing it Right the First TimeBlended Learning: Doing it Right the First Time
Blended Learning: Doing it Right the First Time
 
Introduction to SoTL Fall 2016
Introduction to SoTL Fall 2016Introduction to SoTL Fall 2016
Introduction to SoTL Fall 2016
 
QM Standards 5 & 6: Interaction and Technology
QM Standards 5 & 6: Interaction and TechnologyQM Standards 5 & 6: Interaction and Technology
QM Standards 5 & 6: Interaction and Technology
 
QM Standard 8: Accessibility and Finishing Touches
QM Standard 8: Accessibility and Finishing TouchesQM Standard 8: Accessibility and Finishing Touches
QM Standard 8: Accessibility and Finishing Touches
 
QM Standards 2, 3, & 4: Objectives and Alignment
QM Standards 2, 3, & 4: Objectives and AlignmentQM Standards 2, 3, & 4: Objectives and Alignment
QM Standards 2, 3, & 4: Objectives and Alignment
 
QM Standards 1 & 7: Course Beginnings and Syllabi
QM Standards 1 & 7: Course Beginnings and SyllabiQM Standards 1 & 7: Course Beginnings and Syllabi
QM Standards 1 & 7: Course Beginnings and Syllabi
 
You, Your Students, and Assessment
You, Your Students, and AssessmentYou, Your Students, and Assessment
You, Your Students, and Assessment
 
Testing Tools: Qualtrics, BlackBoard, and Respondus
Testing Tools: Qualtrics, BlackBoard, and RespondusTesting Tools: Qualtrics, BlackBoard, and Respondus
Testing Tools: Qualtrics, BlackBoard, and Respondus
 

Recently uploaded

Poster_density_driven_with_fracture_MLMC.pdf
Poster_density_driven_with_fracture_MLMC.pdfPoster_density_driven_with_fracture_MLMC.pdf
Poster_density_driven_with_fracture_MLMC.pdf
Alexander Litvinenko
 
會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文
會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文
會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文
中 央社
 
MSc Ag Genetics & Plant Breeding: Insights from Previous Year JNKVV Entrance ...
MSc Ag Genetics & Plant Breeding: Insights from Previous Year JNKVV Entrance ...MSc Ag Genetics & Plant Breeding: Insights from Previous Year JNKVV Entrance ...
MSc Ag Genetics & Plant Breeding: Insights from Previous Year JNKVV Entrance ...
Krashi Coaching
 

Recently uploaded (20)

Dementia (Alzheimer & vasular dementia).
Dementia (Alzheimer & vasular dementia).Dementia (Alzheimer & vasular dementia).
Dementia (Alzheimer & vasular dementia).
 
Chapter 7 Pharmacosy Traditional System of Medicine & Ayurvedic Preparations ...
Chapter 7 Pharmacosy Traditional System of Medicine & Ayurvedic Preparations ...Chapter 7 Pharmacosy Traditional System of Medicine & Ayurvedic Preparations ...
Chapter 7 Pharmacosy Traditional System of Medicine & Ayurvedic Preparations ...
 
Features of Video Calls in the Discuss Module in Odoo 17
Features of Video Calls in the Discuss Module in Odoo 17Features of Video Calls in the Discuss Module in Odoo 17
Features of Video Calls in the Discuss Module in Odoo 17
 
Word Stress rules esl .pptx
Word Stress rules esl               .pptxWord Stress rules esl               .pptx
Word Stress rules esl .pptx
 
Poster_density_driven_with_fracture_MLMC.pdf
Poster_density_driven_with_fracture_MLMC.pdfPoster_density_driven_with_fracture_MLMC.pdf
Poster_density_driven_with_fracture_MLMC.pdf
 
BỘ LUYỆN NGHE TIẾNG ANH 8 GLOBAL SUCCESS CẢ NĂM (GỒM 12 UNITS, MỖI UNIT GỒM 3...
BỘ LUYỆN NGHE TIẾNG ANH 8 GLOBAL SUCCESS CẢ NĂM (GỒM 12 UNITS, MỖI UNIT GỒM 3...BỘ LUYỆN NGHE TIẾNG ANH 8 GLOBAL SUCCESS CẢ NĂM (GỒM 12 UNITS, MỖI UNIT GỒM 3...
BỘ LUYỆN NGHE TIẾNG ANH 8 GLOBAL SUCCESS CẢ NĂM (GỒM 12 UNITS, MỖI UNIT GỒM 3...
 
Spring gala 2024 photo slideshow - Celebrating School-Community Partnerships
Spring gala 2024 photo slideshow - Celebrating School-Community PartnershipsSpring gala 2024 photo slideshow - Celebrating School-Community Partnerships
Spring gala 2024 photo slideshow - Celebrating School-Community Partnerships
 
會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文
會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文
會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文會考英文
 
UChicago CMSC 23320 - The Best Commit Messages of 2024
UChicago CMSC 23320 - The Best Commit Messages of 2024UChicago CMSC 23320 - The Best Commit Messages of 2024
UChicago CMSC 23320 - The Best Commit Messages of 2024
 
PSYPACT- Practicing Over State Lines May 2024.pptx
PSYPACT- Practicing Over State Lines May 2024.pptxPSYPACT- Practicing Over State Lines May 2024.pptx
PSYPACT- Practicing Over State Lines May 2024.pptx
 
TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT VẬT LÝ 2024 - TỪ CÁC TRƯỜNG, TRƯ...
TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT VẬT LÝ 2024 - TỪ CÁC TRƯỜNG, TRƯ...TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT VẬT LÝ 2024 - TỪ CÁC TRƯỜNG, TRƯ...
TỔNG HỢP HƠN 100 ĐỀ THI THỬ TỐT NGHIỆP THPT VẬT LÝ 2024 - TỪ CÁC TRƯỜNG, TRƯ...
 
How to Manage Closest Location in Odoo 17 Inventory
How to Manage Closest Location in Odoo 17 InventoryHow to Manage Closest Location in Odoo 17 Inventory
How to Manage Closest Location in Odoo 17 Inventory
 
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjj
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjjStl Algorithms in C++ jjjjjjjjjjjjjjjjjj
Stl Algorithms in C++ jjjjjjjjjjjjjjjjjj
 
Exploring Gemini AI and Integration with MuleSoft | MuleSoft Mysore Meetup #45
Exploring Gemini AI and Integration with MuleSoft | MuleSoft Mysore Meetup #45Exploring Gemini AI and Integration with MuleSoft | MuleSoft Mysore Meetup #45
Exploring Gemini AI and Integration with MuleSoft | MuleSoft Mysore Meetup #45
 
Graduate Outcomes Presentation Slides - English (v3).pptx
Graduate Outcomes Presentation Slides - English (v3).pptxGraduate Outcomes Presentation Slides - English (v3).pptx
Graduate Outcomes Presentation Slides - English (v3).pptx
 
Improved Approval Flow in Odoo 17 Studio App
Improved Approval Flow in Odoo 17 Studio AppImproved Approval Flow in Odoo 17 Studio App
Improved Approval Flow in Odoo 17 Studio App
 
IPL Online Quiz by Pragya; Question Set.
IPL Online Quiz by Pragya; Question Set.IPL Online Quiz by Pragya; Question Set.
IPL Online Quiz by Pragya; Question Set.
 
MSc Ag Genetics & Plant Breeding: Insights from Previous Year JNKVV Entrance ...
MSc Ag Genetics & Plant Breeding: Insights from Previous Year JNKVV Entrance ...MSc Ag Genetics & Plant Breeding: Insights from Previous Year JNKVV Entrance ...
MSc Ag Genetics & Plant Breeding: Insights from Previous Year JNKVV Entrance ...
 
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
24 ĐỀ THAM KHẢO KÌ THI TUYỂN SINH VÀO LỚP 10 MÔN TIẾNG ANH SỞ GIÁO DỤC HẢI DƯ...
 
How To Create Editable Tree View in Odoo 17
How To Create Editable Tree View in Odoo 17How To Create Editable Tree View in Odoo 17
How To Create Editable Tree View in Odoo 17
 

Basics of Web Design

  • 1. Web Design: Important Concepts Staci Trekles Purdue University Calumet
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.