chapter 3 planning the site l.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
Chapter 3 Planning the Site PowerPoint Presentation
Download Presentation
Chapter 3 Planning the Site

Loading in 2 Seconds...

play fullscreen
1 / 45

Chapter 3 Planning the Site - PowerPoint PPT Presentation


  • 242 Views
  • Uploaded on

Chapter 3 Planning the Site Chapter 3 Principles of Web Design Objectives Create a site specification Identify a content goal Analyze your audience Build a Web site development team Create conventions for filenames and URLs Set a directory structure Diagram the site Chapter 3

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'Chapter 3 Planning the Site' - Pat_Xavi


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
objectives

Chapter 3

Principles of Web Design

Objectives
  • Create a site specification
  • Identify a content goal
  • Analyze your audience
  • Build a Web site development team
  • Create conventions for filenames and URLs
  • Set a directory structure
  • Diagram the site

Principles of Web Design 2nd Ed. Chapter 3

create a site specification

Chapter 3

Principles of Web Design

Create a Site Specification

Answer the following questions:

  • Why are you building the Web site? Can you write a two or three-paragraph mission statement that briefly states the site’s goals?
  • What do you envision as the goal of the site? What do you (or your company or organization) hope to gain from creating and maintaining a Web site?

Principles of Web Design 2nd Ed. Chapter 3

create a site specification4

Chapter 3

Principles of Web Design

Create a Site Specification

Answer the following questions:

  • How will you judge the success of the site? What are the measuring factors you can use to assess the effectiveness of the site?
  • Who is the target audience? What characteristics do they share? How will you find out more about them?
  • What are the limiting technical factors affecting your site?

Principles of Web Design 2nd Ed. Chapter 3

identify the content goal

Chapter 3

Principles of Web Design

Identify the Content Goal
  • Examine closely what type of site you are building
  • Your objectives and your users’ objectives may be quite different
  • Adopt your user’s perspective
  • Think about the type of content you’re presenting and look to the Web for examples of how best to present it

Principles of Web Design 2nd Ed. Chapter 3

identify the content goal6

Chapter 3

Principles of Web Design

Identify the Content Goal

Types of web sites:

  • Billboard
  • Publishing
  • Portal
  • Special interest
  • Virtual gallery
  • E-commerce, catalog, online shopping
  • Product support
  • Intranet/Extranet

Principles of Web Design 2nd Ed. Chapter 3

analyze your audience

Chapter 3

Principles of Web Design

Analyze Your Audience

Produce an audience definition:

  • What is it that users want when they come to your site?
  • How can you attract them and entice them to return for repeat visits?
  • What type of computer and connection speed does your typical visitor have?

Principles of Web Design 2nd Ed. Chapter 3

analyze your audience8

Chapter 3

Principles of Web Design

Analyze Your Audience
  • Who are the typical members of your audience? Are they male or female? What level of education do they have? What is their reading and vocabulary level? What level of technical aptitude do they have?
  • Why do people come to your site? Do they want information? Do they want to download files? Are they looking for links to other Web sites?

Principles of Web Design 2nd Ed. Chapter 3

analyze your audience9

Chapter 3

Principles of Web Design

Analyze Your Audience
  • Do you have a captive audience, such as a base of loyal customers that want up-to-date information? Are you designing for an intranet, where users are employees of an organization?
  • Will other sites link to your site, or will your site provide links? If someone unfamiliar with the site visits, will they know what you offer?

Principles of Web Design 2nd Ed. Chapter 3

analyze your audience10

Chapter 3

Principles of Web Design

Analyze Your Audience
  • How often will users return to your site? Do they have a reason to come back?
  • What computing platform do your users have? What is their typical connection speed? What type of browser do they use? If you are on an intranet, is there a standard for browsers, connection, and screen resolution?

Principles of Web Design 2nd Ed. Chapter 3

analyze your audience11

Chapter 3

Principles of Web Design

Analyze Your Audience
  • Whose skills do you need to build the site? Who will create the graphics, code the pages, and write the text? Do you have the talent and economic resources that you need?

Principles of Web Design 2nd Ed. Chapter 3

slide12

Chapter 3

Principles of Web Design

  • Figure 3-1
  • Figure 3-2

Principles of Web Design 2nd Ed. Chapter 3

build a development team

Chapter 3

Principles of Web Design

Build a Development Team

The following roles are necessary:

  • Server Administrators
  • HTML Coders
  • Designers
  • Writers and Information Designers
  • Software Programmers
  • Database Administrators
  • Marketing

Principles of Web Design 2nd Ed. Chapter 3

filenames and urls

Chapter 3

Principles of Web Design

Filenames and URLs
  • Plan your file-naming conventions for your site
  • Talk to your system administrator and find out what type of operating system your Web server uses
  • Typically you’ll develop your Web site locally on a PC or Macintosh. You will upload the files to the Web server as the last step in the publishing process.

Principles of Web Design 2nd Ed. Chapter 3

filenames and urls15

Chapter 3

Principles of Web Design

Filenames and URLs
  • If the Web server runs a different operating system from your local development system, transferring your files to the server may break local URL links because of either file name or directory structure inconsistencies

Principles of Web Design 2nd Ed. Chapter 3

slide16

Chapter 3

Principles of Web Design

  • Table 3-1

Principles of Web Design 2nd Ed. Chapter 3

file naming conventions

Chapter 3

Principles of Web Design

File Naming Conventions
  • Case Sensitivity - Use lowercase for all file names and in the HTML code
  • Character Exceptions - Leave out special characters such as /, \, &, and *
  • File Extensions - Use the correct three-letter extension

Principles of Web Design 2nd Ed. Chapter 3

use the iso standard

Chapter 3

Principles of Web Design

Use the ISO standard

The International Standards Organization (ISO) standard specifies a maximum of eight letters followed by a period and a three-letter extension. Allowed characters are letters, numbers, and the underscore character.

Principles of Web Design 2nd Ed. Chapter 3

use the iso standard19

Chapter 3

Principles of Web Design

Use the ISO standard

Here are some valid file name examples:

  • mypage.htm
  • chap_1.htm
  • picture1.jpg
  • logo.gif

Principles of Web Design 2nd Ed. Chapter 3

default main page name

Chapter 3

Principles of Web Design

Default Main Page Name
  • Every Web site has a default main page that displays when the browser requests the directory of the site rather than a specific file
  • Before you start coding, check with your system administrator to verify the main page file name
  • index.htm is the most common default main page name

Principles of Web Design 2nd Ed. Chapter 3

url usage

Chapter 3

Principles of Web Design

URL Usage
  • Complete URLs - Includes the protocol, domain name, path, and file name. Refers to another server on the Internet.
  • Partial URLs - Omits the protocol and domain name. Refers to a file that resides on the same server.

Principles of Web Design 2nd Ed. Chapter 3

slide22

Chapter 3

Principles of Web Design

  • Figure 3-3

Principles of Web Design 2nd Ed. Chapter 3

directory structure

Chapter 3

Principles of Web Design

Directory Structure
  • A typical Web server has a user area that contains folders for each user
  • Your files are stored in your user area, along with other files from other Web sites stored in their respective user areas
  • The directory structure of the Web server affects the format of your site’s URL

Principles of Web Design 2nd Ed. Chapter 3

slide24

Chapter 3

Principles of Web Design

  • Figure 3-4

Principles of Web Design 2nd Ed. Chapter 3

directory structure25

Chapter 3

Principles of Web Design

Directory Structure
  • When you buy a domain name, the name you choose is an alias that points to your actual location on the Web server

Principles of Web Design 2nd Ed. Chapter 3

slide26

Chapter 3

Principles of Web Design

  • Figure 3-5

Principles of Web Design 2nd Ed. Chapter 3

build a relative file structure

Chapter 3

Principles of Web Design

Build a Relative File Structure
  • You will most likely build your Web site on a computer that is different from the computer that will be hosting your site. Keep this in mind when you are designing the directory and file structure.
  • Because your files will be transferred to another computer, any URLs you specify to link to other pages in your site must include paths that are transferable

Principles of Web Design 2nd Ed. Chapter 3

build a relative file structure28

Chapter 3

Principles of Web Design

Build a Relative File Structure
  • Relative paths tell the browser where a file is located relative to the document the browser is currently viewing

Principles of Web Design 2nd Ed. Chapter 3

slide29

Chapter 3

Principles of Web Design

  • Figure 3-6
  • Figure 3-7
  • Figure 3-8

Principles of Web Design 2nd Ed. Chapter 3

diagram the site

Chapter 3

Principles of Web Design

Diagram the Site
  • Plan your site by creating a flowchart that shows the structure and logic behind the content presentation and navigation choices
  • This preliminary step is one of the most important that you take in planning your site

Principles of Web Design 2nd Ed. Chapter 3

linear structure

Chapter 3

Principles of Web Design

Linear Structure
  • The linear information structure lets you guide the user along a path. This structure lends itself to book-type presentations or content that requires the user to follow a predefined path.

Principles of Web Design 2nd Ed. Chapter 3

slide32

Chapter 3

Principles of Web Design

  • Figure 3-9

Principles of Web Design 2nd Ed. Chapter 3

tutorial structure

Chapter 3

Principles of Web Design

Tutorial Structure
  • The tutorial structure is perfect for computer-based training content such as lessons, tutorials, or task-oriented procedures

Principles of Web Design 2nd Ed. Chapter 3

slide34

Chapter 3

Principles of Web Design

  • Figure 3-10

Principles of Web Design 2nd Ed. Chapter 3

web structure

Chapter 3

Principles of Web Design

Web Structure
  • Many smaller Web sites follow the Web structure which offers links to and from every page in the site. This allows the user to jump freely to any page from any other page.

Principles of Web Design 2nd Ed. Chapter 3

slide36

Chapter 3

Principles of Web Design

  • Figure 3-11

Principles of Web Design 2nd Ed. Chapter 3

hierarchical structure

Chapter 3

Principles of Web Design

Hierarchical Structure
  • The hierarchical structure is probably the most common information design. It lends itself to larger content collections because the section pages break up and organize the content at different levels throughout the site.

Principles of Web Design 2nd Ed. Chapter 3

slide38

Chapter 3

Principles of Web Design

  • Figure 3-12

Principles of Web Design 2nd Ed. Chapter 3

cluster structure

Chapter 3

Principles of Web Design

Cluster Structure
  • The cluster structure is similar to the hierarchical structure, except that every topic area is an island of information unto itself, with all pages in each cluster linked to each other

Principles of Web Design 2nd Ed. Chapter 3

slide40

Chapter 3

Principles of Web Design

  • Figure 3-13

Principles of Web Design 2nd Ed. Chapter 3

catalog structure

Chapter 3

Principles of Web Design

Catalog Structure
  • The catalog structure accommodates electronic shopping. The user can browse or search for items and view specific information about each product on the item pages.

Principles of Web Design 2nd Ed. Chapter 3

slide42

Chapter 3

Principles of Web Design

  • Figure 3-14

Principles of Web Design 2nd Ed. Chapter 3

summary

Chapter 3

Principles of Web Design

Summary
  • Start with pencil and paper. Your ideas will be less restricted and you can easily revise and recast without recoding.
  • Write a site specification document. You’ll find it invaluable as a reference while building your site.

Principles of Web Design 2nd Ed. Chapter 3

summary44

Chapter 3

Principles of Web Design

Summary
  • Analyze your audience and try to create an audience profile. Focus your site on the user’s needs, and continue to meet those needs by adapting the site based on user feedback.
  • An effective site is more commonly the result of a team effort. Leverage different skill sets and experience to build a Web site team.

Principles of Web Design 2nd Ed. Chapter 3

summary45

Chapter 3

Principles of Web Design

Summary
  • Plan for successful implementation of your site by creating portable file naming conventions. Build a relative file structure that can be transferred to your Web server without a hitch.
  • Use a pencil and paper to diagram your site. Even if the design changes, you’ll save a lot of time and effort by visually detailing the structure of your content.

Principles of Web Design 2nd Ed. Chapter 3