128 The Internet amp Website Design

bull What is the Internetndash Parts of the Internetndash Internet amp WWW basicsndash Searching the WWW

bull Website design considerations

bull HTML (Hypertext Markup Language)

bull Resources for website design on the WWW

The Internet

bull Where did it come fromndash History ARPA network

bull Largest computer network in theworld a network of networksndash network two things connected for communication

bull Many partsndash WWW gopher telnet ftp Usenet e-mail chat rooms

bull Who owns it No one

The Internet

bull Where did it come fromndash History ARPA network

bull Largest computer network in theworld a network of networksndash network two things connected for communication

bull Many partsndash WWW gopher telnet ftp Usenet e-mail chat rooms

bull Who owns it No one

Parts of the Internet Capabilities

bull WWW World Wide Webbull GOPHERS Use menus to locate text materialbull TELNET Log on one computer work on anotherbull FTP Transfer files from computer to computerbull USENET NEWSGROUPS Electronic bulletin

boards for discussion groupsbull E -MAIL Person -to-person messaging

document sharingbull CHAT ROOMS Interactive conversations

The World Wide Web

bull A part of the Internetndash history CERN

bull Getting accessndash Service providers AOL SLU

Primary Network Southwestern Bell Charter Communications etc

bull Look at a browser

bull ldquoBrowsingrdquo vs ldquosurfingrdquo

The World Wide Web

bull A part of the Internetndash history CERN

bull Getting accessndash Service providers AOL SLU

Primary Network Southwestern Bell Charter Communications etc

bull Look at a browser

bull ldquoBrowsingrdquo vs ldquosurfingrdquo

Internet amp WWW basics

bull Location bar name of file viewedndash URL Uniform Resource Locator

httpwwwadbooknetteach022indexhtmclassesprotocol domain folder(directory) file fragment

bull Hypertext Transfer Protocol (http) communication standard for sending web pages

bull Hypertext Markup Language (html)most common language for creating web pages

bull Website file displayed in the browser

Internet amp WWW basics

bull Common browsers Netscape Navigator MS Internet Explorer

bull Home page Organizationrsquos main page

bull Portal Point of entry for the WWW

bull ldquoPushrdquo technology Server automatically delivers content to browser user does nothing to get it

Internet amp WWW basics

bull Common browsers Netscape Navigator MS Internet Explorer

bull Home page Organizationrsquos main page

bull Portal Point of entry for the WWW

bull ldquoPushrdquo technology Server automatically delivers content to browser user does nothing to get it

Searching the WWW

bull search engines look through their own databases of web pages

bull index a list of web pages either directory-style or searchable

bull keywords important words in a web page

bull spiders programs that wander the web collecting information

Common Search Engines

bull Yahoo

bull Excite

bull Hotbot

bull Ask Jeeves

bull Altavista

bull Lycos

bull Google

bull Your browser

Searching the WWW Better results

bull Use phrases in quotes

ndash ldquoSaint Louis restaurantsrdquo not Saint Louis restaurants

bull Use Boolean operators

ndash AND OR NOT

bull look at ldquoAdvanced Searchrdquo tips on search sites

bull Donrsquot know what itrsquos called

ndash Yahoo ndash wander through categories

Why Learn About Webpage Design

bull It will increase your understanding of design concepts in general

bull It will increase awareness of customer needs

bull It will help you understand webpage navigation

images courtesy of httpwwwdreamweavercom

Website design considerations

bull Ease of navigationndash no dead links no dead endsndash logical layout

bull Proper labelingndash bottom of each page

bull Page size consider the default screen size of 640x480

bull Speedy downloadingndash ldquofatrdquo page = unvisited pagendash image considerations

Hypertext Markup Languagelthtmlgtltheadgtlttitlegtjust a wee little pagelttitlegtltheadgtltbodygtThis is a web pageltIgtThis is italicsltIgtltBgt bold faceltBgtltUgtand underlinedltUgt

ltA HREF=ldquo1-28pptgtReturn from whence you cameltAgt

ltbodygtlthtmlgt Show it

HTML elements

Header page elements that are not in the body Title shown in the blue bar at the top of the windowMetatags keywords language settings etc

Body what appears in the main window of the browser

Tags pairs of markers that surround elements for formatting

Hyperlink reference to a different file or fragment ltA HREF=httpwwwyahoocomgt

IMG hyperlink reference to an image file

Resources on the Web

bull Webpagesthatsuckcomldquolearn good design from looking at bad designrdquo

bull NCSArsquos tutorial on HTML

bull Guide to Creating a Successful Website

Resources on the Web

bull Webpagesthatsuckcomldquolearn good design from looking at bad designrdquo

bull NCSArsquos tutorial on HTML

bull Guide to Creating a Successful Website

Homework 1 Building a Website

bull Homework detailsndash web page on a subject of your choicendash Should include (at least) 1 page 4 pictures and 4

links to other web pagesndash Should follow guidelines for good designndash Should be posted on a web site that advertises ldquofree

website hostingrdquo such as GeoCities Xoomcom Angelfire Tripod Homestead

How to use GeoCities

bull With a browser access httpwwwgeocitiescom

bull Click on ldquoFree web site ndash Sign up nowrdquo

bull Set up an account with Yahoo if you dont have one already Record your name amp password

bull Build your webpage using whatever program you choose

bull Use the GeoCities FTP manager to upload all your files Record the URL for your convenience

Tools for Making Webpages

bull Microsoft Word

bull Netscape Composer (part of Communicator)

bull DreamWeaver (30-day trial downloadable from Macromediacom)

bull Microsoft FrontPage

bull Lots and lots of other programshellip

Homework 1 Building a Website

bull Homework detailsndash web page on a subject of your choice (donrsquot be crude)ndash Should include (at least) 1 page 4 pictures and 4

links to other web pagesndash Should follow guidelines for good designndash See other details on the homework pagendash Should be posted on a web site that advertises ldquofree

website hostingrdquo such as GeoCities Xoomcom Angelfire Tripod Homestead

Homework 1 Building a Website

bull Homework detailsndash web page on a subject of your choice (donrsquot be crude)ndash Should include (at least) 1 page 4 pictures and 4

links to other web pagesndash Should follow guidelines for good designndash See other details on the homework pagendash Should be posted on a web site that advertises ldquofree

website hostingrdquo such as GeoCities Xoomcom Angelfire Tripod Homestead