Download Intro to Dreamweaver Notes - Garnet Valley School District

Welcome To Web Page
Design
Mr. Ursone
Accessing the Web




Web Page: where you see text,
graphics, sounds, etc.
Uniform Resource Locator (URL):
Web address. Ex.
http://www.yahoo.com
Web Browser: Helps you navigate
through the internet. Ex. Internet
Explore & Mozilla Firefox.
Hyperlink: a button, when clicked,
that takes you to another place on
the web
Accessing the Web


Website: Group of web pages that
are linked together
Home page or index page: The
“main” page of the website.
Describes the purpose and content.
Types of Websites





pg.6
Portal Web Site: Provides many services
from one site. Ex. Lycos - provides news,
weather, email, games, search engine, etc.
News Web Site: News articles relating to
current events. Ex. Cbs.com
Informational Web Site: Contains facts,
such as research and statistics. Ex.
Usa.gov
Business/marketing site: Promotes or
sells products or services. Ex. Amazon.com
Educational Web Sites: Formal and
informal teaching and learning. Ex.
Temple.edu
Types of Websites




Entertainment Web Site:
interactive and engaging. Contains
music, video, sports, games, etc. Ex.
Freearcade.com
Advocacy Web Site: Describes a
cause, opinion, idea. Ex.
Americanhumane.org
Weblog or blog: Journal that
reflects the ideas of the author
and/or site visitors
Wiki: Allows users to add, create,
delete, or modify web content
Types of Websites




Social Network: Online community. Ex.
Myspace.com
Content Aggregator: A business that
gathers Web content and distributes it to
subscribers for free or for a fee. Ex.
iSyndicate
Personal Web Site: Set up by an
individual or family typically not associated
with any organization. Ex. Ursone.com
http://en.wikipedia.org/wiki/Website#Type
s_of_websites
Let’s discuss some specific Web sites you all
are familiar with and how you would classify
them according to the nine basic types
Planning a Web Site

Purpose
To keep visitors interested in the
site
 Easy to navigate
 Organized

Discussion: What makes a Web site likable? What is
wrong with a Web site when people do not like it? Why is
it important for Web site developers to visit existing Web
sites during the planning process?
Planning a Website

Purpose and Goal

What type of website will it be?
 News,



Entertainment, Marketing, etc.
It may be a combination of types
Develop a statement describing
this to your visitors
Target Audience

Who is your site geared towards?
 People
with similar interests, gender,
education, age range, income,
profession, and computer proficiency
Planning a Website

Web Technologies
Broadband service (fast)
 Baseband (Slow)

 If
audience has slow connection you
will not want to fill your page with
images, flash, graphics, etc.

Site Comparison
Look at sites that are the same
type as your site
 Incorporate what you like from
those sites to your site

Planning a Website

(Content)
Value-Added Content
What topics do you want to cover
 How much information will you
present about each topic
 What will attract your target
audience to your site
 How will you keep them revisiting
 What changes will you have to
make to keep your site updated

Planning a Website


Text: Bulk of the content
Images: The next most commonly
included content


Discussion: What images might be
effective to use on a Web site that
promotes a neighborhood community
center? Why?
Color Palette: What colors will you
choose


(Content)
Limit the number to a select few
Multimedia: Adds interactivity and
action to your site.

Includes: Animation, audio, and video
Web Site Navigation

Navigation: Pathway through
your site


Web pages cannot be isolated
from the rest of your site
On every page of your site, you
must answer 3 questions
Where am I?
 Where do I go from here?
 How do I get to the home page?

Design Basics

Navigation/Site Map: Outlines
the structure of the site
 See

Figure 1-7 on page 12
Navigation Elements: With a
click they help you make your
way through a website
 Examples
include: Text, buttons,
images, site index, a menu, search
feature, frames, and a navigation bar
Developing a Web Site

Typography: the appearance
and arrangement of text
 Use
web-safe fonts such as Times,
Courier, and Arial
 These are more popular and the ones
most visitors will have installed on
their computers

Typography, images, page
layout, and color are the key
design elements that will make
up your website
Developing a Web Site





Page Layout: Establish a consistent,
logical layout that allows you to add
text and images easily
Use templates when you can to
maintain consistency
Include one topic per page
Use concise statements and bulleted
points to get your point across
Be sure to review and test your web
site

Consistency, grammatical errors,
functioning links and multimedia, is it
going to be displayed properly
Publishing a Web Site

Publishing: Making your web
site available to visitors
 Involves
server
uploading the site to a
Understanding Web Addresses
(URLs)
What does all that
http://abcde.com/fgh/ijkl/ mean
anyway???
 HTTP:// - (Hypertext Transfer
Protocol) Ok what does that
mean?


It establishes a connection
between the web server and your
computer and sends you back your
web pages
Understanding Web Addresses
(URLs)

http://abcde.com/fgh/ijkl/
Domain Name

The main component of a Web
sites URL


Kind of like the web sites last name
Usually the Web sites Home page name
Understanding Web Addresses
(URLs)

http://abcde.com/fgh/ijkl/
Path (Subfolder)

Tells the visitor which route they
took to get to this page on the
website
Maintaining a Web Site

Changing and updating content
By adding new text, images, etc.
or by deleting obsolete material
 Check for broken links and adding
new links if necessary
 Document the last change date

 Even
made
when no revisions have been
Cascading Style Sheets Styles


CSS styles you format text, images,
headings, tables, etc. on one page
and if you apply this style sheet to
another page the new page will have
the same format.
You can have multiple CSS styles per
web site
Activity: Use the Internet to find three sources Put info, including
for images that you can use for your own site. Web addresses
Activity II: Find two sites that have a similar
topic to your site. Write down 3 ideas from
each site that you would like to incorporate in
your site
(URLs), for Acts I
& II on a Word
doc. And turn it in.
Save this in your
H-Drive.