Principles of Web Design Keep it simple Content is critical--Form is not. Speed is “King”. Consistent filenames are key. Design efficiently. Cite your.

Slides:



Advertisements
Similar presentations
Web Page Design Critical Elements for a Well Designed Web Page.
Advertisements

Usability Prepared by: The NYS Forum for Information Resource Management IT Accessibility Committee.
Basic Principles of Web Page Design CSCI 150, CSCI 155, CSCI , MSTI 131 and MSTI 260 Developed by BNapoli.
With Microsoft FrontPage 2003 Publishing a Web Page.
Principles of Web Design 5 th Edition Chapter Nine Site Navigation.
INTRODUCTION OF WEB DESIGN 2003 TALL SUMMER INSTITUTE 7/7/2003 Chi-Hua Tseng.
Designing Your Page Step 1: Design for a Computer Medium A computer screen is not a printed page. Readability changes depending on color, layout and format.
Chapter 2 Web Site Design Principles Principles of Web Design, Third Edition.
Basic Web Design Considerations CS /6/07. Basic terms Web page Web page Web site Web site Home page Home page Sub pages Sub pages.
Web Page Design ECE 3940 Megan O’Byrne 10 September 09.
A02 Creating my website NAME ______________. UNIT 2 – A02 – Creating my Website The purpose of this assessment objective is to create 5 web pages containing.
WEB DESIGNING Prof. Jesse A. Role Ph. D TM UEAB 2010.
Website Design BTT1OC/2OC. What is web design? O A web site is a digital page consisting of HTML (hypertext markup language) files, images, movies, sound,
7 Selecting Design and Color Section 7.1 Identify presentation design principles Use a custom template Add pages to a navigation structure Section 7.2.
Welcome to Our Website Comments and Suggestions Welcomed! Presented by: Vicky Green.
Section 7.1 Identify presentation design principles Use a custom template Add pages to a navigation structure Section 7.2 Identify color scheme guidelines.
Introduction to Nvu Jing Fu. What is nVu? Free web design and development tool WYSIWYG (/wiziwig/) software Other similar tools: Dreamweaver, Googlepages.
Section 2.1 Compare the Internet and the Web Identify Web browser components Compare Web sites and Web pages Describe types of Web sites Section 2.2 Identify.
Chapter Objectives Discuss the relationship between page length, content placement, and usability Complete Step 4: Specify the website’s navigation system.
1 After completing this lesson, you will be able to: Define your goals for a Web site. Analyze your audience. Create a blueprint for your Web site. Design.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
HTML Web Authoring Tonya L. DeZarn Janice Thompson Juana Wallace.
Planning a Web Site Unit Two Planning Steps 1. Determine the audience & objectives. 2. Sketch a storyboard or flowchart of the pages. 3. Create a folder.
Multimedia Notes Review for 8 th Grade Computer Skills Competency Test.
Chapter 18 Web Design April 16 th & 17 th. Content The most essential element of any Web page is the content Before you begin a Web page you want to know.
Name Teacher: Group: 1 Unit 2 – Webpage Creation.
Web Technologies Website Development Trade & Industrial Education
Electronic Commerce BBA (Hons) ( ) (Website Designing and Publishing) By: Farhan Mir.
Chapter 2 Web Site Design Principles
Mastering the Internet, XHTML, and JavaScript Web Design.
WEB DESIGN USING DREAMWEAVER. The World Wide Web –A Web site is a group of related files organized around a common topic –A Web page is a single file.
Web Site Design Principles
FrontPage Introduction Presented by: Audrey Marshall for Interactive Multimedia Design.
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.
WEBiT Adding a new page. 1. View a page like the one you wish to create a. Navigate to a page with a similar layout to the new page you wish to create.
Web Page Design. Some Terms Cascading Style Sheet, (CSS) –a style sheet language used to describe the look and formatting of a document written in html;
An Introduction To Websites With a little of help from “WebPages That Suck.
Lecture 3 Web Design What makes a "good" website? Getting started on your website. Planning the layout. Picking a theme. Effective Design Tips.
General Information: This document was created for use in the "Bridges to Computing" project of Brooklyn College. This work is licensed under the Creative.
Web Design and Development for E-Business By Jensen J. Zhao Copyright 2003 Prentice Hall, Inc. Web Design and Development for E-Business Jensen J. Zhao.
Web software. Two types of web software Browser software – used to search for and view websites. Web development software – used to create webpages/websites.
Chapter 2 Web Site Design Principles Principles of Web Design, Third Edition.
1 After completing this lesson, you will be able to: Transfer your files to the Internet. Choose a method for posting your Web pages. Use Microsoft’s My.
Introduction to Web Page Design. General Design Tips.
Chapter 2 Web Site Design Principles Principles of Web Design, 4 th Edition.
Web Site Design 15 Easy Steps to an Excellent Web Site.
Software. A web site is a collection of web pages on a particular topic. A web page is a document written in HTML code. Web pages are linked together.
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.
Web Site Design Plan Checklist Web Design Presented by: Angelo Russo #10 11/22/2014Angelo Russo #101.
 Network  A _____ of computers that can _________ w/ each other  Examples of hardware  ______________ & communication lines  Internet  Hardware.
Storyboard, Design, Layout.  Create storyboards  Decide upon navigation  Prepare short page summaries.
?. When designing, you should analyze your target audience. Design you webpage around your target audience Target Audience.
Unit 8.2 / Lesson 1 / presentation1b Website Styles.
WEB DESIGN PRINCIPLES Dale Blasingame School of Journalism & Mass Communication Texas State University.
introductionwhyexamples What is a Web site? A web site is: a presentation tool; a way to communicate; a learning tool; a teaching tool; a marketing important.
COMP 143 Web Development with Adobe Dreamweaver CC.
What makes a Good Website?. Examples of Bad Websites For more really.
PowerPoint Computer Solutions 1. Multimedia A powerful blend of text, graphics, sound, animation, and video on your computer.  Multimedia is an effective.
Web technologies Session 2. Slide 2. 1 Objectives for session 2  To develop participants’ knowledge, skills and understanding of web-page design  To.
Chapter 2 Web Site Design Principles
Pre-Production Meet with the client to create a project plan:
Web Site Design Plan Checklist
Web software.
Step 1: Design for a Computer Medium
Unit 2 – Webpage Creation
Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%
Web Design 1 Website Construction.
Principles of Good Web Design
A02 Creating my website NAME ______________.
Designing a Web Site.
Presentation transcript:

Principles of Web Design Keep it simple Content is critical--Form is not. Speed is “King”. Consistent filenames are key. Design efficiently. Cite your sources.

K.I.S.S. Principle Maintain simple, consistent page layout. Keep backgrounds simple and high contrast to allow easy viewing of content. Design the page so that user does not have to scroll from left to right to see the whole page

Content is Critical…. Users are completely uninterested in learning anything about how your site works. They came for content. “Learn and think about your audience, then learn and think about computers, then think again about your audience.” Use a simple template to design your webpage. You then have time for other things in your life.

Speed is King You have 3 seconds to convince a user not to use the Back button. More speed, less interactivity Follow the less is more principle.

Consistent filenames are key. Use all lowercase No spaces First page is named index.htm All webpage files are stored in the same folder All images are stored in a folder within the folder that stores the web files.

Design efficiently Include images and animation that help communicate the content. Images should not exceed a total 100k per page. Do not include identification information with photographs. Use a large, commonly understood navigation scheme. Use meaningful terms for hyperlinks

Design tips continued Use standard fonts Colors should be “web safe” as much as possible. Pages should be sized so they will display properly in a variety of screen resolutions.

Cite your sources “Give credit where credit is due” Have another coworker double check the webpage before publishing.

Web Design Resources html

Sources 8/34/index1a_page2.html?tw=design y/webtenets.htm 12.pisd.edu/guide/schools/webpages/