Dreamweaver Robby Seitz 121 Powers Hall 9157822 rseitzolemissedu Basic Web Design What is the easiest way to build or update a Web page Get someone else do it for you What can you give someone to help them build a good Web page for you ID: 749536
Download Presentation The PPT/PDF document "Basic Web Design Using" is the property of its rightful owner. Permission is granted to download and print the materials on this web site for personal, non-commercial use only, and to display it on your personal computer provided you do not modify the materials and that you retain all copyright notices contained in the materials. By downloading content from our website, you accept the terms of this agreement.
Slide1
Basic Web Design Using Dreamweaver
Robby
Seitz
121 Powers Hall
915-7822
rseitz@olemiss.eduSlide2
Basic Web DesignWhat is the easiest way to build or update a Web page?Get someone else do it for you.
What can you give someone to help them build a good Web page for you?
Money.Slide3
Methods Compared
.
Method
Builder Skills
Required
Management
Issues
MS Word
&
Publisher
Not intended for
Web pages
Creates
illegible code
Almost impossible to update
Non-standard HTML
FrontPage
Strong use of templates
FrontPage original files required to maintain
Non-standard HTML
Massive file sizes
Google Sites,
FaceBook
, etc.
No skills
needed
Limited flexibility
Locked
into domain name
Easy to update – Difficult to mess up!
WordPress
Skills depend on level of interaction
needed: Ranges from easy to very difficult
Easy for everyday tasks
Not so easy for major changes
Dreamweaver
Serious HTML knowledge
Lots of assistance provided
Clear and
standard
HTML is written and may be edited by any capable
program/person
Text editor
In-depth HTML knowledge
Ditto aboveSlide4
HTML BasicsH
yper-
T
ext
M
arkup
L
anguage
Don’t worry, there is a cheatsheet!(Source: http://rebs.ms/htmlcheats /)Slide5
HTML BasicsMarkup Tags - NestingOpen, surround, close
<tag attribute=“value”…>stuff</tag>
<a href=“http://www.olemiss.edu”>Link</a>
<p>This is my very short paragraph.</p>
Empty or self-closing
<img src=“mypic.jpg” />
<br />Slide6
HTML BasicsSpacing doesn’t matter (much), but indentation helps show nesting.
<html>
<head>
<title>Robby’s Page</title>
</head>
<body>
This is a picture of my cat, Lou.<
br
/>
<
img
src
=“mycat.jpg” />
</body>
</html>Slide7
HTML BasicsSlide8
Web ConceptsExpect viewers to see things differently.
Obstacles to consistent page rendering
include:
Different browser versions
Different screen resolutions
Different accessibility needs
Different mobile devicesSlide9
Web ConceptsKeep layout and content as separate as possible.
Content – Information and its contextual meaning.
Layout – The format and arrangement of information.Slide10
Basic DreamweaverParts of the screenTop menu: File, Edit, View…
Top toolbar: Common, Layout, Forms…Slide11
Basic DreamweaverParts of the screen
Tabs: Document names
Code/Design views
File Transfer, ValidationSlide12
Basic DreamweaverParts of the screen
Tag Selector
Properties window:
Format, Style, Align…Slide13
Basic DreamweaverParts of the screen
Windows on right
side: Files, CSS…Slide14
Basic Web Design Using Dreamweaver
www.dreamweaver.com
Robby Seitz
121 Powers Hall
915-7822
rseitz@olemiss.edu