SlideShare a Scribd company logo
To create an effective website, the designer of
the web must instill a number of pointers.
It should be an eye catching.
Visitors in your site should be curious in the
information you presented.
DESIGN PRINCIPLES AND ELEM
1. PURPOSE
 Terms of the goal it aims to fulfill.
 Website can be categorized into different types
and functions depending on the purpose they
serve the user.
 Websites visitors may want to look for the information, be
entertained, play games, socialize or transaction business.
 It should define first the purpose to determine the theme of
the website.
2. COMMUNICATION
 Absorb as much valuable information as possible in short
amount of time.
 It should be concise and direct to the point.
 Organized in a manner that should entice in readers.
 Avoid long fuzzy sentences.
 With headings, subheadings and in bullet form.
3. TYPEFACES
 Most dominant and noticeable in terms of visuals.
 Deals with text format, text style and text.
 Appearance of the text can greatly contribute to the perception of the visitors of
the website.
 Academic websites will use simple typefaces.
4. COLORS
 Appropriate combinations of the
foreground and the background color can
produce a better viewing experience.
 It can introduce a mood.
 It can introduce the perception of a modern or classic
look on the website.
5. IMAGE
 Deliver a complete message.
 Correct images can connect to viewers effectively.
 Proper balance, colour and contrast accompanied by
text, can deliver great impact and information to the
audience.
6. NAVIGATION
 It is the facility that the audience can use to go through the website.
WAYS TO CREATE AN EFFECTIVE AND GOOD NAVIGATION
1. Hierarchical organization of information.
2. Placing the buttons or links.
3. The use of search bars.
7. LAYOUTS
 Arrangement of the content and elements.
POSSIBLE LAY-OUTS.
1. Grid - enables the users to create sections/
groups or related informations.
- the information can be arranged in
columns or group boxes.
2. F-Pattern - placing more information at the top
or left part of the screen.
3. Mobile - portability and convenience brought
about by mobiles.
- should consider the lay-out for mobiles.
8. LOAD TIME
 The time that the website will load or appear
onto the viewers’ display device.
METHODS:
1. Minimize the elements in a web page.
2. Optimize the size and resolution of the
images.
Submitted by:
Alagar, Ruth Ann M.
Barrientos, Danelyn C.
Danque, Airah
Martin, Charmaine P.
GRADE 12 – GAS
EMPOWERMENT technology

More Related Content

What's hot

Empowerment Technologies Lecture 6 (Philippines SHS)
Empowerment Technologies Lecture 6 (Philippines SHS)Empowerment Technologies Lecture 6 (Philippines SHS)
Empowerment Technologies Lecture 6 (Philippines SHS)
John Bosco Javellana, MAEd.
 
Intro to Web Design
Intro to Web DesignIntro to Web Design
Intro to Web Design
Kathy Gill
 
Imaging and design for the online environment (empowermwnt technologies)
Imaging and design for the online environment (empowermwnt technologies)Imaging and design for the online environment (empowermwnt technologies)
Imaging and design for the online environment (empowermwnt technologies)
EricaVS
 
Nature and purposes of of online platforms and applications
Nature and purposes of of online platforms and applicationsNature and purposes of of online platforms and applications
Nature and purposes of of online platforms and applications
wylljie
 
ICT CONTENT DEVELOPMENT
ICT CONTENT DEVELOPMENTICT CONTENT DEVELOPMENT
ICT CONTENT DEVELOPMENT
ChristopherEsteban2
 
Multimedia and ICT.pptx
Multimedia and ICT.pptxMultimedia and ICT.pptx
Multimedia and ICT.pptx
SheilaTorino
 
Web Design Tools (WYSIWYG)
Web Design Tools (WYSIWYG)Web Design Tools (WYSIWYG)
Web Design Tools (WYSIWYG)
KayeBaaclo
 
Basic principles of graphics and layout
Basic principles of graphics and layoutBasic principles of graphics and layout
Basic principles of graphics and layout
LovelyshennahAligato
 
Empowerment Technologies Lecture 8 (Philippines SHS)
Empowerment Technologies Lecture 8 (Philippines SHS)Empowerment Technologies Lecture 8 (Philippines SHS)
Empowerment Technologies Lecture 8 (Philippines SHS)
John Bosco Javellana, MAEd.
 
Web Page Creation
Web Page CreationWeb Page Creation
Web Page Creation
Rastaman05
 
Empowerment Technology Lesson 4
Empowerment Technology Lesson 4Empowerment Technology Lesson 4
Empowerment Technology Lesson 4
alicelagajino
 
Publishing and sustaining ict projects
Publishing and sustaining ict projectsPublishing and sustaining ict projects
Publishing and sustaining ict projects
Charlotte Quemada
 
Imaging and Design for Online Environment
Imaging and Design for Online EnvironmentImaging and Design for Online Environment
Imaging and Design for Online Environment
Angelito Quiambao
 
Empowerment Technologies Lecture 7 (Philippines SHS)
Empowerment Technologies Lecture 7 (Philippines SHS)Empowerment Technologies Lecture 7 (Philippines SHS)
Empowerment Technologies Lecture 7 (Philippines SHS)
John Bosco Javellana, MAEd.
 
Empowerment Technologies - Module 6
Empowerment Technologies - Module 6Empowerment Technologies - Module 6
Empowerment Technologies - Module 6
Jesus Rances
 
Effective web navigation
Effective web navigationEffective web navigation
Effective web navigation
ananda gunadharma
 
6 Advance Presentation Skill
6 Advance Presentation Skill6 Advance Presentation Skill
6 Advance Presentation Skill
Teodoro Llanes II
 
Empowerment technology Group 7
Empowerment technology Group 7Empowerment technology Group 7
Empowerment technology Group 7
FrancisJuanson1
 
Slideshare ppt
Slideshare pptSlideshare ppt
Slideshare ppt
jhannnii
 
ONLINE PLATFORMS FOR ICT CONTENT DEVELOPMENT
ONLINE PLATFORMS FOR ICT CONTENT DEVELOPMENTONLINE PLATFORMS FOR ICT CONTENT DEVELOPMENT
ONLINE PLATFORMS FOR ICT CONTENT DEVELOPMENT
RianneMaeIda
 

What's hot (20)

Empowerment Technologies Lecture 6 (Philippines SHS)
Empowerment Technologies Lecture 6 (Philippines SHS)Empowerment Technologies Lecture 6 (Philippines SHS)
Empowerment Technologies Lecture 6 (Philippines SHS)
 
Intro to Web Design
Intro to Web DesignIntro to Web Design
Intro to Web Design
 
Imaging and design for the online environment (empowermwnt technologies)
Imaging and design for the online environment (empowermwnt technologies)Imaging and design for the online environment (empowermwnt technologies)
Imaging and design for the online environment (empowermwnt technologies)
 
Nature and purposes of of online platforms and applications
Nature and purposes of of online platforms and applicationsNature and purposes of of online platforms and applications
Nature and purposes of of online platforms and applications
 
ICT CONTENT DEVELOPMENT
ICT CONTENT DEVELOPMENTICT CONTENT DEVELOPMENT
ICT CONTENT DEVELOPMENT
 
Multimedia and ICT.pptx
Multimedia and ICT.pptxMultimedia and ICT.pptx
Multimedia and ICT.pptx
 
Web Design Tools (WYSIWYG)
Web Design Tools (WYSIWYG)Web Design Tools (WYSIWYG)
Web Design Tools (WYSIWYG)
 
Basic principles of graphics and layout
Basic principles of graphics and layoutBasic principles of graphics and layout
Basic principles of graphics and layout
 
Empowerment Technologies Lecture 8 (Philippines SHS)
Empowerment Technologies Lecture 8 (Philippines SHS)Empowerment Technologies Lecture 8 (Philippines SHS)
Empowerment Technologies Lecture 8 (Philippines SHS)
 
Web Page Creation
Web Page CreationWeb Page Creation
Web Page Creation
 
Empowerment Technology Lesson 4
Empowerment Technology Lesson 4Empowerment Technology Lesson 4
Empowerment Technology Lesson 4
 
Publishing and sustaining ict projects
Publishing and sustaining ict projectsPublishing and sustaining ict projects
Publishing and sustaining ict projects
 
Imaging and Design for Online Environment
Imaging and Design for Online EnvironmentImaging and Design for Online Environment
Imaging and Design for Online Environment
 
Empowerment Technologies Lecture 7 (Philippines SHS)
Empowerment Technologies Lecture 7 (Philippines SHS)Empowerment Technologies Lecture 7 (Philippines SHS)
Empowerment Technologies Lecture 7 (Philippines SHS)
 
Empowerment Technologies - Module 6
Empowerment Technologies - Module 6Empowerment Technologies - Module 6
Empowerment Technologies - Module 6
 
Effective web navigation
Effective web navigationEffective web navigation
Effective web navigation
 
6 Advance Presentation Skill
6 Advance Presentation Skill6 Advance Presentation Skill
6 Advance Presentation Skill
 
Empowerment technology Group 7
Empowerment technology Group 7Empowerment technology Group 7
Empowerment technology Group 7
 
Slideshare ppt
Slideshare pptSlideshare ppt
Slideshare ppt
 
ONLINE PLATFORMS FOR ICT CONTENT DEVELOPMENT
ONLINE PLATFORMS FOR ICT CONTENT DEVELOPMENTONLINE PLATFORMS FOR ICT CONTENT DEVELOPMENT
ONLINE PLATFORMS FOR ICT CONTENT DEVELOPMENT
 

Similar to Web Design Principles and Elements

Web design principles
Web design principlesWeb design principles
Web design principles
EILLEN IVY PORTUGUEZ
 
BASIC WEB DESIGN PRINCIPLES.pptx
BASIC WEB DESIGN   PRINCIPLES.pptxBASIC WEB DESIGN   PRINCIPLES.pptx
BASIC WEB DESIGN PRINCIPLES.pptx
Software
 
PRINCIPLES-ELEMENTS-OF-GOOD-WEBSITE-DESIGN-USING.pptx
PRINCIPLES-ELEMENTS-OF-GOOD-WEBSITE-DESIGN-USING.pptxPRINCIPLES-ELEMENTS-OF-GOOD-WEBSITE-DESIGN-USING.pptx
PRINCIPLES-ELEMENTS-OF-GOOD-WEBSITE-DESIGN-USING.pptx
APRILROSEVICENTE1
 
Presentation1
Presentation1Presentation1
Presentation1
jonnel gonzaga
 
NATURE AND PURPOSE OF ONLINE PLATFORM AND APPLICATION (HOPE IV)
NATURE AND PURPOSE OF ONLINE PLATFORM AND APPLICATION (HOPE IV)NATURE AND PURPOSE OF ONLINE PLATFORM AND APPLICATION (HOPE IV)
NATURE AND PURPOSE OF ONLINE PLATFORM AND APPLICATION (HOPE IV)
EliashaMarieRemalla
 
Web designing chapter 01
Web designing chapter 01Web designing chapter 01
Web designing chapter 01
Farmanzaland
 
Practical exam-gegremosa-st.john-pptx (2)
Practical exam-gegremosa-st.john-pptx (2)Practical exam-gegremosa-st.john-pptx (2)
Practical exam-gegremosa-st.john-pptx (2)
AlphaLephew
 
10 Ways to Keep Readers Interested and Improve Content Readability - iSEO AI.pdf
10 Ways to Keep Readers Interested and Improve Content Readability - iSEO AI.pdf10 Ways to Keep Readers Interested and Improve Content Readability - iSEO AI.pdf
10 Ways to Keep Readers Interested and Improve Content Readability - iSEO AI.pdf
iSEO AI
 
Distributing Content to the Omnichannel Traveler
Distributing Content to the Omnichannel Traveler Distributing Content to the Omnichannel Traveler
Distributing Content to the Omnichannel Traveler
Robert Simon
 
HOW UX IS IMPORTANT FOR SEARCH ENGINE MARKETING
HOW UX IS IMPORTANT FOR SEARCH ENGINE MARKETINGHOW UX IS IMPORTANT FOR SEARCH ENGINE MARKETING
HOW UX IS IMPORTANT FOR SEARCH ENGINE MARKETING
kirti sharma
 
434519651-ONLINE-PLATFORMS-AS-TOOLS-FOR-ICT-CONTENT-DEVELOPMENT-pptx.pptx
434519651-ONLINE-PLATFORMS-AS-TOOLS-FOR-ICT-CONTENT-DEVELOPMENT-pptx.pptx434519651-ONLINE-PLATFORMS-AS-TOOLS-FOR-ICT-CONTENT-DEVELOPMENT-pptx.pptx
434519651-ONLINE-PLATFORMS-AS-TOOLS-FOR-ICT-CONTENT-DEVELOPMENT-pptx.pptx
RegineArellano2
 
ICT 9 LESSON 1.pdf
ICT 9 LESSON 1.pdfICT 9 LESSON 1.pdf
ICT 9 LESSON 1.pdf
RedenOriola
 
Infograph Power!
Infograph Power!Infograph Power!
Infograph Power!
introtodigital
 
Generic conventions of a website
Generic conventions of a websiteGeneric conventions of a website
Generic conventions of a website
LaurenHolyoak1
 
Digital Marketing By krishna.pdf
Digital Marketing By krishna.pdfDigital Marketing By krishna.pdf
Digital Marketing By krishna.pdf
rkraina4
 
What is Web Designing?
What is Web Designing?What is Web Designing?
What is Web Designing?
MPIRIC Software
 
Website designing company in delhi
Website designing company in delhiWebsite designing company in delhi
Website designing company in delhi
Css Founder
 
EmpTech Lesson 9-Web Page Design Using Templates and online WYSIWYG Platforms...
EmpTech Lesson 9-Web Page Design Using Templates and online WYSIWYG Platforms...EmpTech Lesson 9-Web Page Design Using Templates and online WYSIWYG Platforms...
EmpTech Lesson 9-Web Page Design Using Templates and online WYSIWYG Platforms...
liera silvan
 
Top10 Usability Guidelines for Bloggers
Top10 Usability Guidelines for BloggersTop10 Usability Guidelines for Bloggers
Top10 Usability Guidelines for Bloggers
Brian Sullivan
 
Website Design and Development step-by-step.docx
Website Design and Development step-by-step.docxWebsite Design and Development step-by-step.docx
Website Design and Development step-by-step.docx
Appxperts Solution
 

Similar to Web Design Principles and Elements (20)

Web design principles
Web design principlesWeb design principles
Web design principles
 
BASIC WEB DESIGN PRINCIPLES.pptx
BASIC WEB DESIGN   PRINCIPLES.pptxBASIC WEB DESIGN   PRINCIPLES.pptx
BASIC WEB DESIGN PRINCIPLES.pptx
 
PRINCIPLES-ELEMENTS-OF-GOOD-WEBSITE-DESIGN-USING.pptx
PRINCIPLES-ELEMENTS-OF-GOOD-WEBSITE-DESIGN-USING.pptxPRINCIPLES-ELEMENTS-OF-GOOD-WEBSITE-DESIGN-USING.pptx
PRINCIPLES-ELEMENTS-OF-GOOD-WEBSITE-DESIGN-USING.pptx
 
Presentation1
Presentation1Presentation1
Presentation1
 
NATURE AND PURPOSE OF ONLINE PLATFORM AND APPLICATION (HOPE IV)
NATURE AND PURPOSE OF ONLINE PLATFORM AND APPLICATION (HOPE IV)NATURE AND PURPOSE OF ONLINE PLATFORM AND APPLICATION (HOPE IV)
NATURE AND PURPOSE OF ONLINE PLATFORM AND APPLICATION (HOPE IV)
 
Web designing chapter 01
Web designing chapter 01Web designing chapter 01
Web designing chapter 01
 
Practical exam-gegremosa-st.john-pptx (2)
Practical exam-gegremosa-st.john-pptx (2)Practical exam-gegremosa-st.john-pptx (2)
Practical exam-gegremosa-st.john-pptx (2)
 
10 Ways to Keep Readers Interested and Improve Content Readability - iSEO AI.pdf
10 Ways to Keep Readers Interested and Improve Content Readability - iSEO AI.pdf10 Ways to Keep Readers Interested and Improve Content Readability - iSEO AI.pdf
10 Ways to Keep Readers Interested and Improve Content Readability - iSEO AI.pdf
 
Distributing Content to the Omnichannel Traveler
Distributing Content to the Omnichannel Traveler Distributing Content to the Omnichannel Traveler
Distributing Content to the Omnichannel Traveler
 
HOW UX IS IMPORTANT FOR SEARCH ENGINE MARKETING
HOW UX IS IMPORTANT FOR SEARCH ENGINE MARKETINGHOW UX IS IMPORTANT FOR SEARCH ENGINE MARKETING
HOW UX IS IMPORTANT FOR SEARCH ENGINE MARKETING
 
434519651-ONLINE-PLATFORMS-AS-TOOLS-FOR-ICT-CONTENT-DEVELOPMENT-pptx.pptx
434519651-ONLINE-PLATFORMS-AS-TOOLS-FOR-ICT-CONTENT-DEVELOPMENT-pptx.pptx434519651-ONLINE-PLATFORMS-AS-TOOLS-FOR-ICT-CONTENT-DEVELOPMENT-pptx.pptx
434519651-ONLINE-PLATFORMS-AS-TOOLS-FOR-ICT-CONTENT-DEVELOPMENT-pptx.pptx
 
ICT 9 LESSON 1.pdf
ICT 9 LESSON 1.pdfICT 9 LESSON 1.pdf
ICT 9 LESSON 1.pdf
 
Infograph Power!
Infograph Power!Infograph Power!
Infograph Power!
 
Generic conventions of a website
Generic conventions of a websiteGeneric conventions of a website
Generic conventions of a website
 
Digital Marketing By krishna.pdf
Digital Marketing By krishna.pdfDigital Marketing By krishna.pdf
Digital Marketing By krishna.pdf
 
What is Web Designing?
What is Web Designing?What is Web Designing?
What is Web Designing?
 
Website designing company in delhi
Website designing company in delhiWebsite designing company in delhi
Website designing company in delhi
 
EmpTech Lesson 9-Web Page Design Using Templates and online WYSIWYG Platforms...
EmpTech Lesson 9-Web Page Design Using Templates and online WYSIWYG Platforms...EmpTech Lesson 9-Web Page Design Using Templates and online WYSIWYG Platforms...
EmpTech Lesson 9-Web Page Design Using Templates and online WYSIWYG Platforms...
 
Top10 Usability Guidelines for Bloggers
Top10 Usability Guidelines for BloggersTop10 Usability Guidelines for Bloggers
Top10 Usability Guidelines for Bloggers
 
Website Design and Development step-by-step.docx
Website Design and Development step-by-step.docxWebsite Design and Development step-by-step.docx
Website Design and Development step-by-step.docx
 

Recently uploaded

The Accursed House by Émile Gaboriau.pptx
The Accursed House by Émile Gaboriau.pptxThe Accursed House by Émile Gaboriau.pptx
The Accursed House by Émile Gaboriau.pptx
DhatriParmar
 
Lapbook sobre os Regimes Totalitários.pdf
Lapbook sobre os Regimes Totalitários.pdfLapbook sobre os Regimes Totalitários.pdf
Lapbook sobre os Regimes Totalitários.pdf
Jean Carlos Nunes Paixão
 
A Strategic Approach: GenAI in Education
A Strategic Approach: GenAI in EducationA Strategic Approach: GenAI in Education
A Strategic Approach: GenAI in Education
Peter Windle
 
Advantages and Disadvantages of CMS from an SEO Perspective
Advantages and Disadvantages of CMS from an SEO PerspectiveAdvantages and Disadvantages of CMS from an SEO Perspective
Advantages and Disadvantages of CMS from an SEO Perspective
Krisztián Száraz
 
Acetabularia Information For Class 9 .docx
Acetabularia Information For Class 9  .docxAcetabularia Information For Class 9  .docx
Acetabularia Information For Class 9 .docx
vaibhavrinwa19
 
MASS MEDIA STUDIES-835-CLASS XI Resource Material.pdf
MASS MEDIA STUDIES-835-CLASS XI Resource Material.pdfMASS MEDIA STUDIES-835-CLASS XI Resource Material.pdf
MASS MEDIA STUDIES-835-CLASS XI Resource Material.pdf
goswamiyash170123
 
The Diamond Necklace by Guy De Maupassant.pptx
The Diamond Necklace by Guy De Maupassant.pptxThe Diamond Necklace by Guy De Maupassant.pptx
The Diamond Necklace by Guy De Maupassant.pptx
DhatriParmar
 
Chapter 3 - Islamic Banking Products and Services.pptx
Chapter 3 - Islamic Banking Products and Services.pptxChapter 3 - Islamic Banking Products and Services.pptx
Chapter 3 - Islamic Banking Products and Services.pptx
Mohd Adib Abd Muin, Senior Lecturer at Universiti Utara Malaysia
 
Digital Artifact 2 - Investigating Pavilion Designs
Digital Artifact 2 - Investigating Pavilion DesignsDigital Artifact 2 - Investigating Pavilion Designs
Digital Artifact 2 - Investigating Pavilion Designs
chanes7
 
The Diamonds of 2023-2024 in the IGRA collection
The Diamonds of 2023-2024 in the IGRA collectionThe Diamonds of 2023-2024 in the IGRA collection
The Diamonds of 2023-2024 in the IGRA collection
Israel Genealogy Research Association
 
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
Levi Shapiro
 
The basics of sentences session 5pptx.pptx
The basics of sentences session 5pptx.pptxThe basics of sentences session 5pptx.pptx
The basics of sentences session 5pptx.pptx
heathfieldcps1
 
special B.ed 2nd year old paper_20240531.pdf
special B.ed 2nd year old paper_20240531.pdfspecial B.ed 2nd year old paper_20240531.pdf
special B.ed 2nd year old paper_20240531.pdf
Special education needs
 
How libraries can support authors with open access requirements for UKRI fund...
How libraries can support authors with open access requirements for UKRI fund...How libraries can support authors with open access requirements for UKRI fund...
How libraries can support authors with open access requirements for UKRI fund...
Jisc
 
Mule 4.6 & Java 17 Upgrade | MuleSoft Mysore Meetup #46
Mule 4.6 & Java 17 Upgrade | MuleSoft Mysore Meetup #46Mule 4.6 & Java 17 Upgrade | MuleSoft Mysore Meetup #46
Mule 4.6 & Java 17 Upgrade | MuleSoft Mysore Meetup #46
MysoreMuleSoftMeetup
 
Digital Artifact 1 - 10VCD Environments Unit
Digital Artifact 1 - 10VCD Environments UnitDigital Artifact 1 - 10VCD Environments Unit
Digital Artifact 1 - 10VCD Environments Unit
chanes7
 
Introduction to AI for Nonprofits with Tapp Network
Introduction to AI for Nonprofits with Tapp NetworkIntroduction to AI for Nonprofits with Tapp Network
Introduction to AI for Nonprofits with Tapp Network
TechSoup
 
2024.06.01 Introducing a competency framework for languag learning materials ...
2024.06.01 Introducing a competency framework for languag learning materials ...2024.06.01 Introducing a competency framework for languag learning materials ...
2024.06.01 Introducing a competency framework for languag learning materials ...
Sandy Millin
 
Natural birth techniques - Mrs.Akanksha Trivedi Rama University
Natural birth techniques - Mrs.Akanksha Trivedi Rama UniversityNatural birth techniques - Mrs.Akanksha Trivedi Rama University
Natural birth techniques - Mrs.Akanksha Trivedi Rama University
Akanksha trivedi rama nursing college kanpur.
 
Pride Month Slides 2024 David Douglas School District
Pride Month Slides 2024 David Douglas School DistrictPride Month Slides 2024 David Douglas School District
Pride Month Slides 2024 David Douglas School District
David Douglas School District
 

Recently uploaded (20)

The Accursed House by Émile Gaboriau.pptx
The Accursed House by Émile Gaboriau.pptxThe Accursed House by Émile Gaboriau.pptx
The Accursed House by Émile Gaboriau.pptx
 
Lapbook sobre os Regimes Totalitários.pdf
Lapbook sobre os Regimes Totalitários.pdfLapbook sobre os Regimes Totalitários.pdf
Lapbook sobre os Regimes Totalitários.pdf
 
A Strategic Approach: GenAI in Education
A Strategic Approach: GenAI in EducationA Strategic Approach: GenAI in Education
A Strategic Approach: GenAI in Education
 
Advantages and Disadvantages of CMS from an SEO Perspective
Advantages and Disadvantages of CMS from an SEO PerspectiveAdvantages and Disadvantages of CMS from an SEO Perspective
Advantages and Disadvantages of CMS from an SEO Perspective
 
Acetabularia Information For Class 9 .docx
Acetabularia Information For Class 9  .docxAcetabularia Information For Class 9  .docx
Acetabularia Information For Class 9 .docx
 
MASS MEDIA STUDIES-835-CLASS XI Resource Material.pdf
MASS MEDIA STUDIES-835-CLASS XI Resource Material.pdfMASS MEDIA STUDIES-835-CLASS XI Resource Material.pdf
MASS MEDIA STUDIES-835-CLASS XI Resource Material.pdf
 
The Diamond Necklace by Guy De Maupassant.pptx
The Diamond Necklace by Guy De Maupassant.pptxThe Diamond Necklace by Guy De Maupassant.pptx
The Diamond Necklace by Guy De Maupassant.pptx
 
Chapter 3 - Islamic Banking Products and Services.pptx
Chapter 3 - Islamic Banking Products and Services.pptxChapter 3 - Islamic Banking Products and Services.pptx
Chapter 3 - Islamic Banking Products and Services.pptx
 
Digital Artifact 2 - Investigating Pavilion Designs
Digital Artifact 2 - Investigating Pavilion DesignsDigital Artifact 2 - Investigating Pavilion Designs
Digital Artifact 2 - Investigating Pavilion Designs
 
The Diamonds of 2023-2024 in the IGRA collection
The Diamonds of 2023-2024 in the IGRA collectionThe Diamonds of 2023-2024 in the IGRA collection
The Diamonds of 2023-2024 in the IGRA collection
 
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
June 3, 2024 Anti-Semitism Letter Sent to MIT President Kornbluth and MIT Cor...
 
The basics of sentences session 5pptx.pptx
The basics of sentences session 5pptx.pptxThe basics of sentences session 5pptx.pptx
The basics of sentences session 5pptx.pptx
 
special B.ed 2nd year old paper_20240531.pdf
special B.ed 2nd year old paper_20240531.pdfspecial B.ed 2nd year old paper_20240531.pdf
special B.ed 2nd year old paper_20240531.pdf
 
How libraries can support authors with open access requirements for UKRI fund...
How libraries can support authors with open access requirements for UKRI fund...How libraries can support authors with open access requirements for UKRI fund...
How libraries can support authors with open access requirements for UKRI fund...
 
Mule 4.6 & Java 17 Upgrade | MuleSoft Mysore Meetup #46
Mule 4.6 & Java 17 Upgrade | MuleSoft Mysore Meetup #46Mule 4.6 & Java 17 Upgrade | MuleSoft Mysore Meetup #46
Mule 4.6 & Java 17 Upgrade | MuleSoft Mysore Meetup #46
 
Digital Artifact 1 - 10VCD Environments Unit
Digital Artifact 1 - 10VCD Environments UnitDigital Artifact 1 - 10VCD Environments Unit
Digital Artifact 1 - 10VCD Environments Unit
 
Introduction to AI for Nonprofits with Tapp Network
Introduction to AI for Nonprofits with Tapp NetworkIntroduction to AI for Nonprofits with Tapp Network
Introduction to AI for Nonprofits with Tapp Network
 
2024.06.01 Introducing a competency framework for languag learning materials ...
2024.06.01 Introducing a competency framework for languag learning materials ...2024.06.01 Introducing a competency framework for languag learning materials ...
2024.06.01 Introducing a competency framework for languag learning materials ...
 
Natural birth techniques - Mrs.Akanksha Trivedi Rama University
Natural birth techniques - Mrs.Akanksha Trivedi Rama UniversityNatural birth techniques - Mrs.Akanksha Trivedi Rama University
Natural birth techniques - Mrs.Akanksha Trivedi Rama University
 
Pride Month Slides 2024 David Douglas School District
Pride Month Slides 2024 David Douglas School DistrictPride Month Slides 2024 David Douglas School District
Pride Month Slides 2024 David Douglas School District
 

Web Design Principles and Elements

  • 1.
  • 2. To create an effective website, the designer of the web must instill a number of pointers. It should be an eye catching. Visitors in your site should be curious in the information you presented. DESIGN PRINCIPLES AND ELEM
  • 3. 1. PURPOSE  Terms of the goal it aims to fulfill.  Website can be categorized into different types and functions depending on the purpose they serve the user.  Websites visitors may want to look for the information, be entertained, play games, socialize or transaction business.  It should define first the purpose to determine the theme of the website.
  • 4. 2. COMMUNICATION  Absorb as much valuable information as possible in short amount of time.  It should be concise and direct to the point.  Organized in a manner that should entice in readers.  Avoid long fuzzy sentences.  With headings, subheadings and in bullet form.
  • 5. 3. TYPEFACES  Most dominant and noticeable in terms of visuals.  Deals with text format, text style and text.  Appearance of the text can greatly contribute to the perception of the visitors of the website.  Academic websites will use simple typefaces.
  • 6. 4. COLORS  Appropriate combinations of the foreground and the background color can produce a better viewing experience.  It can introduce a mood.  It can introduce the perception of a modern or classic look on the website.
  • 7. 5. IMAGE  Deliver a complete message.  Correct images can connect to viewers effectively.  Proper balance, colour and contrast accompanied by text, can deliver great impact and information to the audience.
  • 8. 6. NAVIGATION  It is the facility that the audience can use to go through the website. WAYS TO CREATE AN EFFECTIVE AND GOOD NAVIGATION 1. Hierarchical organization of information. 2. Placing the buttons or links. 3. The use of search bars.
  • 9. 7. LAYOUTS  Arrangement of the content and elements. POSSIBLE LAY-OUTS. 1. Grid - enables the users to create sections/ groups or related informations. - the information can be arranged in columns or group boxes. 2. F-Pattern - placing more information at the top or left part of the screen. 3. Mobile - portability and convenience brought about by mobiles. - should consider the lay-out for mobiles.
  • 10. 8. LOAD TIME  The time that the website will load or appear onto the viewers’ display device. METHODS: 1. Minimize the elements in a web page. 2. Optimize the size and resolution of the images.
  • 11. Submitted by: Alagar, Ruth Ann M. Barrientos, Danelyn C. Danque, Airah Martin, Charmaine P. GRADE 12 – GAS EMPOWERMENT technology