Basic Web site Design PMEHS Web Design Dr. Kerby.

Slides:



Advertisements
Similar presentations
Chapter 3 – Web Design Tables & Page Layout
Advertisements

Web Design Principles 5th Edition
Chapter 13 Web Page Design Studio
Cascading Style Sheets
Section 6.1 Write Web text Use a mission statement Generate and organize content ideas Section 6.2 Use page dimension guidelines Determine content placement.
6 Developing Content and Layout Section 6.1 Generate and organize content ideas Write and organize Web text Section 6.2 Identify page dimension guidelines.
Designing for Multiple Screen Resolutions Screen resolution is the width and height of the computer screen in pixels Most monitors have many screen resolutions.
Difference between content, layout and styles Miss Allgar
Web Design. Look and Feel Way your web site works Personality it conveys to the user Plan the way to looks Test against the variable nature of the web.
1 of 5 This document is for informational purposes only. MICROSOFT MAKES NO WARRANTIES, EXPRESS OR IMPLIED, IN THIS DOCUMENT. © 2007 Microsoft Corporation.
Effective Presentations Effective Presenters Body language Gestures Eye contact Voice Filler words.
Section 7.1 Identify presentation design principles Use a custom template Add pages to a navigation structure Section 7.2 Identify color scheme guidelines.
Expression Web 2 Concepts and Techniques Expression Web Design Feature Web Design Basics.
Bingoopile It’s More Than Just a Search Engine…. By: Khalid Taha, Anna Bierma, & Tristen Eivins.
PowerPoint Etiquette What works in the world of presentations…color, fonts, and transitions.
Web Design, 4 th Edition 4 Planning a Successful Web Site: Part 2.
The Internet Writer’s Handbook 2/e Web Page Design Writing for the Web.
Developing Content and Layout Lesson 6. Creating Web Site Content Online users scan a page, read key words of text, and check out graphics Reading from.
Copyright © 2002 by Pearson Education, Inc., publishing as Longman publishers. All rights reserved. Chapter 8 Designing Pages and Screens Professional.
 Word doc for you to download › Link at the beginning of class › 10 Questions › Answers to be added inline  Post to Sakai when completed › No resubmits.
Project Manager: Lead Designer: Information Architect: Lead Developer: Lakeshia Burnside Myrtle Nurse Ashlei Evans Stacey Jeanpaul Web site Visual Design.
the rhetorical situation  audience  purpose  context design principles  arrangement  emphasis  contrast  repetition  alignment  proximity (some)
Good Web Design. The Four A’s of Good Design Accessible Accurate Appropriate Appealing.
Website Usability presentation by Pasha Souvorin for Georgia Pathway in Advanced Web Design evaluating and planning for web design.
4 Simple Web Design Rules. Your Web Site Should Be Easy To Read  Choose your text and background colors very carefully  Don't use backgrounds that obscure.
Design Principles The good and the bad Alyssa Mendiola Summer 2009.
 Remember that HTML is just text  Need to point to pictures  Use the img tag  alt: › screen reader › REQUIRED for this class and to validate.
Chapter 2 Web Site Design Principles Principles of Web Design, Third Edition.
Introduction to Web Page Design. General Design Tips.
Chapter 2 Web Site Design Principles Principles of Web Design, 4 th Edition.
Designing Web Pages Layout and Composition. Defining Good Design Users are pleased by the design but drawn to the content Design should not be a hindrance.
Development and Design of Multimedia. Planning Your Title 1)Develop the concept or idea – a multimedia project starts with an idea that supports a vision.
BY: DAN PREVI Composite Materials. Consistent style and format Easy to find and use links Inviting colors and themes Efficient use of space Convinces.
Design Principles EDUC 6307: Design of Print Based Media Summer 2009 Ranelle Woolrich.
1 Basic Web site Design  PMEHS Web Design  Dr. Kerby.
Microsoft Expression Web 3 Expression Web Design Feature Web Design Basics.
Web Site Development - Process of planning and creating a website.
Informational Design.  Informational Design involves determining a Web page’s content  Content – text and graphics  A successful Web page uses words.
Web page layout in elegance.  Specific Designs for Target Audiences Consider your audiences tastes when creating your website.
Web Interface Design Basic GUI and Web layouts Fig H.12: Basic Layouts of Web and Graphic User Interfaces.
Copyright © Terry Felke-Morris Learning Outcomes  In this chapter...  common types of website organization  principles of visual design  your target.
 Add one element at a time  If it doesn’t do what you want, › Delete it › DON’T just keep piling on more items.
PowerPoint Etiquette What works in the world of presentations…color, fonts, and transitions.
1 Committed to Shaping the Next Generation of IT Experts. Chapter 4: Online Publishing: Creating a Web Site Exploring Microsoft Office Publisher 2013 Robert.
By: Your Name ELEMENTS OF WEB DESIGN. VISUAL APPEAL Optimization of Graphics, for people to stay on your website, your pictures have to load out as soon.
By Vicky Vickers Summarized by Mr. Parslow Webpage Design.
Section 6.1 Section 6.2 Write Web text Use a mission statement
Understanding the principles of website development
How to do Themes and Color Schemes.
Design basics for web, print, powerpoint, doodling on napkins, and more by Lisa Blankenship, rev
Surface Stage: Design Comps
8/18/2016 Web Development and Interactive Media
Page Design.
Section 7.1 Section 7.2 Identify presentation design principles
Elements of Design.
Document Design is CRAP
Elements of Design.
How to customize your Microsoft SharePoint Online website
Step 1: Design for a Computer Medium
How to customize your Microsoft SharePoint Online website
Page plans A01 Design.
Fixed Positioning.
Better Design Understand how to incorporate key design concepts to the entire site Guidelines for site design Use color, balance, alignment, and other.
PRESENTATION LAYOUTS This is a title slide
How to customize your Microsoft SharePoint Online website
Web Design 1 Website Construction.
What: The heading and banner are at the top
DESIGN PRINCIPLES and arguing in virtual spaces
Tips on good web site Design
Multipage Sites.
Presentation transcript:

Basic Web site Design PMEHS Web Design Dr. Kerby

Designing for the User Who is your audience ... Who will read these pages? Young people? Old people? Muscians? Politicians? Athletes? Children: theme of basic colors with simple graphics and layout What is the purpose of the site?

Consistent, Unified Look Colors Graphics Layout Navigation Same set of colors; navigation in same place on each page

Color scheme examples: Army Web site Nick Jr. Web site

Alignment Consistent Left (easier to read) Right Horizontal OR Vertical Left (easier to read) Right Center (eyes draw down the center)

White Space Types: Active – separates content/images Passive – blank areas that result in incomplete or mismatched shapes Well placed white space makes a Web page easier to follow/read. Recommended - 2:1 Lycos Web page

White space sample Banner Active White Space Passive White Space Image Navigation Text block Image Footer

Organize long lists of information and links. Microsoft Web site Or use a navigation bar . . . Adobe Web site

Organize Navigation User friendly Group like links together Give links specific names

Use of Color Red – stimulates emotion Green – inspires involvement or interaction Gray – indicates lack of commitment or neutrality Blue – shows calm and conservative Yellow – shows cheerfulness and hope for the future, restlessness and change, feelings of anxiety Purple – implies mystical quality Black – indicates power and sophistication

Online Resources Usability First Web page design tips Web evaluation form for secondary grades Ten Good Deeds in Web Design

Ten Good Deeds in Web Design Place Name and Logo on every page Provide a search box if Web site has over 100 pages. Clear headings and page titles. Use grouping and sections to make pages easy to scan.

Use hypertext links for navigation. Use thumbnails for catalogue pages. Create relevant thumbnails. Write clear link titles. Add accessibility to users with disabilities. Design sites in a way viewer will expect.

Ten Good Mistakes in Web Design Original Top Ten Mistakes Top Ten New Mistakes The REALLY Bad Web Page guide

Basic Web site Design PMEHS Web Design Mrs. Kerby

Feedback: Privacy Policy Feedback
Do Not Sell My Personal Information
About project: SlidePlayer Terms of Service

© 2025 SlidePlayer.com. Inc. All rights reserved.