Incorporating Incorporating Multimedia into a Multimedia into a Web Site (Case Web Site (Case Study) Study) Unit G Unit G
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Incorporating Incorporating Multimedia into a Web Multimedia into a Web
Site (Case Study) Site (Case Study) Unit GUnit G
2
ObjectivesObjectives
Explore HTMLExplore HTML
Plan the Web sitePlan the Web site
Create home pageCreate home page
Create child pageCreate child page
Create additional Create additional pagespages
Use text linksUse text links
3
ObjectivesObjectives
Use graphics linksUse graphics links
Add animationAdd animation
Add sound and Add sound and videovideo
Create external Create external linkslinks
Add JavaScriptAdd JavaScript
Enhance a Web Enhance a Web pagepage
4
Case ScenarioCase Scenario
Travel Travel
NorthwestNorthwest
5
Working with HTMLWorking with HTML
HyperText Markup LanguageHyperText Markup Language
Tells browser how to display and Tells browser how to display and link web pageslink web pages
Can work with HTML usingCan work with HTML using
A Web authoring programA Web authoring programDreamweaverDreamweaver
A text editorA text editorNotepadNotepad
An office applicationAn office applicationMS WordMS Word
6
HTML FeaturesHTML Features
Container tags; used in pairsContainer tags; used in pairs
Opening/closing tagsOpening/closing tags
Tags not case sensitive; be Tags not case sensitive; be consistentconsistent
Indent tags for readabilityIndent tags for readability
<center>My Web Page</center><center>My Web Page</center><center>My Web Page</center><center>My Web Page</center>
7
Basic HTML TagsBasic HTML Tags
8
HTML SectionsHTML Sections
HeadHead– Information used to display page Information used to display page
in browserin browser– Search engine informationSearch engine information– Specify web page title (used in Specify web page title (used in
Favorites)Favorites)– Write scriptsWrite scripts
BodyBody– Contents of Web page visible to Contents of Web page visible to
useruser
<head>..</head><body>...</body>
9
Using a Text EditorUsing a Text Editor
Save document Save document oftenoften
Save as .htm fileSave as .htm file
Open two windows:Open two windows:– Text editorText editor– Browser windowBrowser window
10
Directory StructureDirectory Structure
Web Site includes .htm Web Site includes .htm pages, graphics files, pages, graphics files, audio files and video filesaudio files and video files
Large sites use multiple Large sites use multiple foldersfolders
File structure hierarchyFile structure hierarchy– Parent pageParent page– Child pageChild page
11
Planning the Site Planning the Site for Travel Northwestfor Travel Northwest
ConceptConcept
GoalGoal
Target AudienceTarget Audience
TreatmentTreatment
SpecificationsSpecifications
StoryboardStoryboard
NavigationNavigation
12
ConceptConcept
Status:Status: owns B&Bs, inns and resorts owns B&Bs, inns and resortsStatus:Status: owns B&Bs, inns and resorts owns B&Bs, inns and resorts
Location:Location: pacific northwest pacific northwestLocation:Location: pacific northwest pacific northwest
Mission:Mission: provide a unique vacation experience provide a unique vacation experienceMission:Mission: provide a unique vacation experience provide a unique vacation experience
13
GoalGoal
Increase occupancy rate viaIncrease occupancy rate via– Increased potential client awareness of Increased potential client awareness of
each B&B, inn and resorteach B&B, inn and resort– Show uniqueness of individual facilitiesShow uniqueness of individual facilities
14
Target AudienceTarget Audience
Middle- and upper-income Middle- and upper-income couplescouples
Clients who want more Clients who want more personalized experiencepersonalized experience
15
TreatmentTreatment
SimplicitySimplicity
Ease of useEase of use
Photographic-quality imagesPhotographic-quality images
Animation for important pointsAnimation for important points
Sound and video to enhance Sound and video to enhance experienceexperience
16
Target Playback SystemTarget Playback System
Win95 or later and Pentium or Win95 or later and Pentium or Mac G3 and OS7Mac G3 and OS756K modem56K modemIE 3.0/Netscape 3.0 or laterIE 3.0/Netscape 3.0 or laterGraphics (hi res 16-bit JPEG)Graphics (hi res 16-bit JPEG)Animated GIFSAnimated GIFSTimes New Roman fontTimes New Roman fontSound card (WAV files with controls)Sound card (WAV files with controls)Video (AVI clips with controls)Video (AVI clips with controls)
17
Storyboard and NavigationStoryboard and NavigationAll (but home page) have Home buttonsAll (but home page) have Home buttons
18
SetupSetup
Set resolution to 800 Set resolution to 800 x 600x 600
Set colors to 16 bitSet colors to 16 bit
Browser is IE 5Browser is IE 5
Create Create mysitemysite folder folder
Copy publisher files Copy publisher files to to mysitemysite folder folder
#1#1
19
Create Home PageCreate Home Page#2#2
Save as Save as index.htm index.htm
View in IE as View in IE as you createyou create
20
Create Child PageCreate Child Page#3#3
Save as B&Bpage.htmSave as B&Bpage.htm
21
Create Additional PagesCreate Additional Pages#4#4Save as RHpage.htmSave as RHpage.htm
22
create a text link in Index.htmcreate a text link in Index.htm
Text LinksText Links#5#5
create text links in B&Bpage.htmcreate text links in B&Bpage.htmcreate text lines in Rhpage.htmcreate text lines in Rhpage.htm
23
Graphic LinksGraphic Links#6#6
24
Adding AnimationAdding Animation
Marquee (scrolling text)Marquee (scrolling text)– Text may only display in quotes in Text may only display in quotes in
NetscapeNetscape
#7#7
25
Adding GIF AnimationAdding GIF Animation#7#7
26
Adding Sound/VideoAdding Sound/Video#8#8
<a href=“whale-snd.wav”>whales</a>
27
External (URL) LinksExternal (URL) Links
First part is the scheme or protocolFirst part is the scheme or protocol– HTTP (HyperText Transfer Protocol)HTTP (HyperText Transfer Protocol)
Second part is server location Second part is server location where file iswhere file is
Make sure you check them often Make sure you check them often
28
External LinksExternal Links#9#9
29
JavaScript Can:JavaScript Can:
Check for a Check for a passwordpasswordDisplay a visit Display a visit countercounterDisplay a graphic Display a graphic rolloverrolloverCreate an animated Create an animated buttonbutton
30
JavaScript RolloverJavaScript Rollover
Image changes from Roche Image changes from Roche Harbor graphic to a balcony view Harbor graphic to a balcony view when mouse rolls over itwhen mouse rolls over it
#10#10
31
JavaScript RolloverJavaScript Rollover#10#10
32
Enhancing Web PageEnhancing Web Page#11#11
33
Additional HTML TagsAdditional HTML Tags
Incorporating Incorporating Multimedia Into a Web Multimedia Into a Web
Site (Case Study)Site (Case Study)EndEnd
Related Documents
