Dreamweaver 101 - Dr Matthew J Koehler

Download Report

Transcript Dreamweaver 101 - Dr Matthew J Koehler

HTML & Dreamweaver 101
Aman Yadav
Definitions
HTTP – The Web uses a protocol called HTTP (Hyper Text
Transport Protocol) to communicate between the Web browser and
the Web server.
The browser (client) initiates all
the communication with the
server. The server has no control
over what URLs the browser
requests or the order they are
requested in. In addition the
general, the server can not force
the browser to change pages.
DNS (Domain Name System) is a way of addressing a group of
computers on the Internet using a name. The name consists of
at least two parts. The top level domain, such as .com, .edu,
.org, and one or more subdomains
Examples:
msu.edu
educ.msu.edu
Every computer on the Internet has a unique IP address. An IP
address is consists of four parts, each with an 8-bit number,
ranging from 0 to 255, separated by dots.
Ex: 35.8.234.239
A host name is the name of a particular computer in a domain. It
can be used with the domain name to refer to a particular
computer across the internet, rather than using the IP address.
Examples:
educ.msu.edu
One computer usually only has one IP address, but one
computer could have multiple domain names.
Example:
aman.educ.msu.edu
matt.educ.msu.edu
Could all be the same computer.
Anatomy of a URL
Everything on the Web is found through a URL
(Uniform Resource Locator). URLs are typed into a
Web browser to go to a location or are placed in
HTML files to reference other pages
Protocol
The protocol is how the client wants to communicate
with the server. For the Web this is normally "http".
Parts of a URL
http://hostanddomain/path
http://www.msu.edu/students
Other protocols – ftp, telnet, https etc.
What is HTML?
HTML stands for Hyper Text Markup Language
An HTML file is a text file containing small markup tags
The markup tags tell the Web browser how to display the page
An HTML file must have an .htm or .html file extension
An HTML file can be created using a simple text editor line Notepad. There
other editors like FrontPage.
An example:
<html>
<head>
<title>Title of my Page </title>
</head>
<body>CEP 800 Home Page
<b>bold</b>
<i>italic</i>
</body>
</html>
http://www.w3schools.com/
Dreamweaver
Some men see things as they are and ask why.
Others dream things that never were and ask why not.
-George Bernard Shaw
Dreamweaver site
Select Site > New Site. The
Site Definition dialog box
appears.
Name your site and click Next
On the next Screen, Do you
want to work with a server
technology such as Cold
Fusion, ASP…? Check No, I do
not want to use a server
technology. Click Next
Check “Edit local sopies on my
machine, then upload to server
when ready” and Select the
Folder on your computer where
you want to store your files.
Dreamweaver site contd..
On the Next Screen it asks How
you want to connect to your
remote server?
Select FTP from the drop down
list. Type in the name of the
server that will host the website.
Type the folder where the files
will be put on the server. (The
folder should already exist on the
server). Type in your FTP Login
info.
Click Next after you have put in
all the information to access the
server
You do not want want to enable
check in and check out. Check
No and click Next to continue
You are DONE
Add a HTML new file
On the File menu of the site (not
other File menu). Click on New
File
The default name of the file is
“untitled.htm”. Name the file that
you want e.g “cep800.htm”
Save your document by doing
one of the following:
–
Select File > Save.
–
Press Control+S (Windows)
or Command+S (Macintosh)
To Preview your current page
that you are working in a browser
Press F12. The webpage will be
displayed in a browser.
Uploading your files to remote server
Upload your file to the remote
folder
–
Select the file that you want
to upload
–
Click on the Put file button as
shown below
Test your final site by opening the
site in the browser.
Inserting a link
Type in the text in
the document
window
Select the text
that you want to
link
In the Properties
window, type the
link in the Link
box as shown
below
Inserting a link contd..
To link to a file currently in the working folder to the text use the “Point to File” button.
Simply select the text as you did earlier and click on the “Point to File” button and drag it
to the file that you need linked to the text as shown in the image below.