Transcript How Much Do You Know About the Internet?

Creating web pages
Why? How?
What is the Internet?
 The
Internet is a large system of
computers networked together to
share information.
 8.5 million users in 1995
 605 million users in 2002 (Nua)
How does the Internet work?
SBAC Server
Clients: Fort Clarke, Alachua Elementary, Horizon Center, Duval, etc.
What is the WWW?




World Wide Web
Multimedia portion of the
Internet (i.e. graphics,
sounds, video, text, etc.)
Hyperlinks
Requires browser software
(i.e. Internet Explorer,
Netscape, Safari, etc.)
To be a consumer of WWW
content




Searching strategies
Evaluation skills
Organizational tools
Instructional strategies

Make learning intentional
To be a producer of WWW
content






Organize and plan!!!
Good web design
Accessibility
Speak the language (sort of)
Access a server
Know your URL
Be organized and plan!!!

What will you need?

Three applications
HTML Editor (Dreamweaver, Claris Home Page,
GoLive, Communicator, etc.)
 Web Browser (Internet Explorer, Netscape
Communicator, Mozilla, Safari, Firefox)
 FTP Application (Fetch, WS_FTP, Explorer also has
this option)

Be organized and plan!!!

What will you need? A PLAN!!





Audience
Function(s) or purpose(s)
Content
Storyboard to organize content
“Never assume your site is logical -test it”
Effective Design
Storyboard your Site
Home
Page
(index)
Scavenger
Hunts
Hotlists
dinosaurs
planets
planets
dinosaurs
WebQuests
women in
history
Good Web Design
“Anyone can learn the mechanics of making a web
page. And anyone can make an ugly web page.
Lots of people do. But the only reason so many
people make bad web pages is that they don’t
understand the very basic design principles.”
Williams & Tollett, 2000, p. 104
Or C.A.R.P.
Contrast
•Guides your eye around the page
•Need a focal point
•Creates information hierarchy
•Makes skimming more simple
•If two elements are not the same, make
them very different
Williams & Tollett, 2000
Alignment






Choose one
Don’t mix
Move text away from left edge
Shy away from centered alignment
(especially paragraphs!!!)
Doesn’t mean everything is aligned along
the same edge but that everything has the
same type of alignment
Move away from edge
Williams & Tollett, 2000
Repetition
•Repeat certain elements to tie site
together
•Makes pages look like they belong
together
•Makes site easier to use
•Navigation
•Know when you have left the site
Williams & Tollett, 2000
Proximity
•Need organized, purposeful space
•Items are often orphaned or have
inappropriate relationships
•Alignment often serves as unifying
structure
•Spacing <BR> versus <P> (shift enter vs.
enter)
Williams & Tollett, 2000
Williams & Tollett, 2000
Accessibility

Section 508


Requirements and Standards for Web
Content Accessibility
To ensure people with disabilities have
access to, and use of, information and data
that is comparable to that available to
individuals who do not have disabilities
What does 508 mean for you?






A text equivalent for every non-text
item
Color consideration
Multiple ways to access information
Redundant links on image maps
Most editors help with this
“Bobby-approved”
HTML: The Language





Don’t need to know anymore
Hypertext Mark-up Language
Characterized by < > and </ >
HTML editors do most of the coding for us
Common HTML editors: Netscape
Composer, Front Page, Dreamweaver,
Claris Home Page, etc.
Notice protocol
Access the server



Use FTP (file transfer protocol) software
WS_FTP, Fetch, etc.
Enables you to put files from your
computer onto a server so others
connected to the Internet can view your
work.
Access the server



Must know your server name, user ID and
password
plaza.ufl.edu
Gatorlink + password
Structure

URL: Uniform Resource Locator
The format for identifying locations
(addresses) on the Web.

http://plaza.ufl.edu/~kdawson/danny_duckling.html

protocol
server
directory/folder
File name
The little things that will throw
you for a loop




File names- no spaces, symbols, or capital
letters.
Everything goes in a folder and then
upload folder
Don’t move images and pages after you
link them.
Use tables, more tables and tables to keep
everything in place. Hide the lines if you
don’t like the look.
Steps








Storyboard your site
Make a folder on your desktop
Find your images and put them in the folderrename if necessary
Open Netscape Composer (FREE)
Choose your colors, text
Make your table(s)
Add your images, text, navigation, etc.
Save and then save as and rename
Reference

Williams, R. & Tollet, J. (2000) The Nondesigner’s web book. Berkeley, CA:
Peachpit Press.