Developing a Web Site.

Slides:



Advertisements
Similar presentations
How can Microsoft PowerPoint 2007 help you share information?
Advertisements

Basic Principles of Web Page Design CSCI 150, CSCI 155, CSCI , MSTI 131 and MSTI 260 Developed by BNapoli.
M I S Dr. Ernst-Gerd vom Kolke 1 Web Design - Introduction n Design for printed and electronic information isn’t very different n Special aspects for web.
. Website and file organization. How websites work.
Developing Effective Civic Websites An effective website balances what the client wants, what users need, and what constitutes good design by considering:
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.
THE BASICS OF THE WEB Davison Web Design. Introduction to the Web Main Ideas The Internet is a worldwide network of hardware. The World Wide Web is part.
WEB DESIGNING Prof. Jesse A. Role Ph. D TM UEAB 2010.
Creating a Web Site Back to Table of Contents. Creating a Web Site Conceiving a Web Site Planning a Web Site 2 Creating a Web Site Section 9-1 Section.
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.
Section 7.1 Identify presentation design principles Use a custom template Add pages to a navigation structure Section 7.2 Identify color scheme guidelines.
Process of __________, arranging, & ______________ visual elements of art to accomplish or address a particular purpose  Elements of Visual Design 
5 Planning a Web Site Section 5.1 Determine the purpose of your Web site Define the target audience for your Web site Write a mission statement Section.
LEARN THE QUICK AND EASY WAY! VISUAL QUICKSTART GUIDE HTML and CSS 8th Edition Chapter 2: Working with Webpage Files.
Getting Started with Dreamweaver
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.
4.5 Multimedia Production. Learning Outcome 1. Design the structure and user interface for a multimedia project. 2. Produce a successful multimedia project.
Chapter Objectives Discuss the relationship between page length, content placement, and usability Complete Step 4: Specify the website’s navigation system.
Adobe Dreamweaver CS3 Revealed CHAPTER ONE: GETTING STARTED WITH DREAMWEAVER.
Section 5.1 Section 5.2 Determine the purpose of your Web site
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.
Web Design, 3 rd Edition 4 Planning a Successful Web Site: Part 2.
Web Design, 4 th Edition 4 Planning a Successful Web Site: Part 2.
The Internet and the World Wide Web. The Internet A Network is a collection of computers and devices that are connected together. The Internet is a worldwide.
Using Adobe ® Dreamweaver ® and Photoshop ® An Introduction PART ONE The design phase before launching Dreamweaver.
PBA Front-End Programming Page Composition. Page composition Now we know about – Colors – Fonts, texts and editorial style – Links and navigation – …
1 Word Lesson 3 Formatting Documents Microsoft Office 2010 Fundamentals Story / Walls.
Introduction to Web Page Design. General Design Tips.
Planning a Web Site Lesson 5. Planning a Web Site When creating a Web site, you should: Determine the site’s purpose and goals Identify target audience.
Developing a Web Site. Two Components of Web Site Development Systematic Planning Systematic Planning Design and Development Design and Development.
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.
Slide 1-1 The Web Wizard’s Guide to Web Design by James Lengel.
Building Your Web Page. Build Your Web Page Orfordville Public Library held at: Parkview High School Tue. April 8 Tue. April 15 Tue. April 22.
Web Site Design Plan Checklist Web Design Presented by: Angelo Russo #10 11/22/2014Angelo Russo #101.
History Internet – the network of computer networks that provides the framework for the World Wide Web. The web can’t exist without the internet. Browser.
Technical Communication A Practical Approach Chapter 14: Web Pages and Writing for the Web William Sanborn Pfeiffer Kaye Adkins.
Planning a Website 5 Step Process. Step 1 – Determine Purpose & Goals Why do I want a website? Why do I want a website? What are my immediate goals for.
By: Lisa Harris Lisa Johnson Suzanne Sprouse.  Standards drive planning  Guide Instruction  Necessary for assessment,  i.e. you are going to assess.
Web page design. Web Site Design Principles Design for the Medium What is meant by Hyper Media? Hypertext links.
Web Design, 5 th Edition 3 Planning a Successful Website: Part 1.
Copyright © Terry Felke-Morris Learning Outcomes  In this chapter...  common types of website organization  principles of visual design  your target.
MARK3030 Navigational Testing Navigation Design Basics all of the ways that users can move around a site and understand where to go revealed in the appearance.
Connecting From Home Editing at Home(You don’t have to.)
Getting Started with Dreamweaver
Objective % Select and utilize tools to design and develop websites.
Imaging and Design for Online Environment
Principles of Good Screen Design
Section 7.1 Section 7.2 Identify presentation design principles
Web Design ECT 270 Robin Burke.
Chapter A - Getting Started with Dreamweaver MX 2004
Pre-Coding Web Design – Sec 3-1
Web Site Design Web site diagrams from the Yale Style Manual at:
Web Site Design Plan Checklist
بسم الله الرحمن الرحيم.
Section 5.1 Section 5.2 Determine the purpose of your Web site
Objective % Select and utilize tools to design and develop websites.
PBA Front-End Programming
Step 1: Design for a Computer Medium
Web Development & Design Foundations with HTML5 8th Edition
Web Programming– UFCFB Lecture-4
Enhancing Student Learning and Retention with Community Partnerships
Back to Table of Contents
Designing for the World Wide Web
HCI and Hypermedia/WWW
Getting Started with Dreamweaver
CIS 376 Bruce R. Maxim UM-Dearborn
Chapter 4 Planning Site Navigation
PowerPoint Lesson 1 Microsoft Word Basics
CS7026: Authoring for Digital Media
4.01 Examine web page development and design.
Presentation transcript:

Developing a Web Site

Two Components of Web Site Development Systematic Planning Design and Development

Four Elements of Systematic Planning The Web audience Goals and objectives for the Web site Sketch out the Web site Select a Web authoring tool

Systematic Planning – Web Audience Ask yourself the following questions about your audience. Who am I developing the web site for. Do any of the following affect my audience; Age Gender Financial Status Education The audience guides every aspect of your Web design.

Systematic Planning – Goals and Objectives Provide the general framework of your Web site . Are broad statements that indicate the purpose of the site Objectives Precise statements about specific Web site content. Organize site content information and depth and breadth of site information

Systematic Planning – Sketch out the Web Site Using the Objectives for the site create an outline of how the site should be organized.

Systematic Planning – Select a Web Authoring Tool There are three main types of tools; Tools that do most of the web page and site design work for you usually free. Free tools that allow you to create your own Web pages and Sites Advanced Web page and site design tools that you purchase.

Design and Development Involves the following elements; Navigation structures Design principles Homepage and page construction Graphics

Design and Development - Navigation Structures Sequential structure organizes information sequentially in alphabetical order, chronological order, or in order from general to specific information Grid structure organizes information in no particular order of importance A hierarchical structure is the most common way to organize complex navigational schemes. A Web structure is a free-flowing, non-structured navigation.

Design and Development - Design Principles The simplicity principle states that in order to communicate effectively, visuals should convey one basic idea. Emphasis provides a means by which attention can be drawn to the important elements of a web page or visual. Balance is a form of equilibrium within a Web page or visual. Unity refers to the strength of the relationship between the elements of a web page or visual.

Design and Development - Home Page and Web Pages The place where people meet your web site. The top vertical four inches are the most valuable real estate in your Web site Consistency is the key to good web page design. Visual organization of titles, subtitles, navigation links, buttons, text and graphics is very important on all web pages.

Design and Development - Graphics There are two types of graphics used on web pages; GIF JPEG Graphics can add visual interest to a Web page and help tie a Web site together

File and Folder Structure of a Web Site A Web site is contained in a single directory (folder) on a computers hard drive. This is know as the root directory or folder All files that make up a Web site are found in the root folder.

File and Folder Structure of a Web Site