The Language of The Web. Web Server To make Web pages, you create files written in HTML and place...
19
HTML: HyperText Markup Language The Language of The Web
-
Upload
brianna-pearson -
Category
Documents
-
view
214 -
download
0
Transcript of The Language of The Web. Web Server To make Web pages, you create files written in HTML and place...
HTML:HyperText Markup LanguageThe Language of The Web
TheWebHasBecomeThe Universalform ofCommunication!
How Does the Web Work?
Web Server
To make Web pages, you create files written in HTML and place them on a Web server
The HTML in your web page tells the web browser how to display the page
Once you put your file on a Web server, any browser can retrieve it over the internet
What does the Web server do?
The server is just a computer connected to the Internet waiting for requests from browsers
Each server stores HTML files
“I need the HTML file
“Starbuz”
Found it,
here
ya go
What you write (HTML)<html>
<head><title>Funville Dance</title>
</head><body> <h1>Welcome to Funville Dance
Club</h1><p>
Join us any evening for a night of fun, conversation, and maybe a game or two of <em>Dance Dance Revolution</em> Wireless access is always provided </p></body></html>
Tags
An HTML document defines content and layout with tags < >
Tags – comprised of elements inside angle brackets < >
Indicate – The start and end of a set of instruction
Spaces – there should be no spaces in a tag
Tags affect the text they enclose
<p>Join us any evening for a night of fun, conversation, and maybe a game or two of <em>Dance Revolution</em>.
Wireless access is always provided
</p> The <p> tag begins a paragraph The </p> ends the paragraph The <em> and </em> Emphasizes the words
in between
4 main document tags:
<html> - tells the browser that what’s to follow is HTML
<head> - title, information not displayed in the browser
<title> - displayed in the title bar of the browser window – should be descriptive
<body> the web content (text, graphics etc.)
For Every Opening tag, there is an Ending tag
<html> </html> <head></head> <title></title> <body></body>
The / indicates the end of an instruction
What program do you use for HTML?
A Text Editor – Such as Note Pad TO DO: Start Button Accessories▪ Note Pad
Viewing your web page?
You need to check what your web page looks like after you apply the tags
You do this Through a Web Browser TO DO Navigate to your saved file in your
folder, Rt click on the file Select Open With
Lets See What we can do!
Open Notepad and type the following:
Starbuzz Coffee Beverages
House Blend, $1.49 A smooth, mild blend of coffees from Mexico, Bolivia and
Guatemala
Mocha Café Latte, $2.35 Espresso, steamed mild and chocolate syrup
Cappuccino, $1.89 A mixture of espresso, steamed milk and foam.
Chai Tea, $1.85 A spicy drink made with black tea, spices, milk and honey
Saving your work…..
File Save AS…. First create a “starbuzz” folder for all your
Starbuzz related files Click on the newly created “starbuz”
folder Now your are going to save your
document IMPORTANT!!!! Save as index.html In the “Save as Type” select All Files▪ ALWAYS SAVE THE FIRST PAGE OF YOUR WEB
SITE AS INDEX.HTML
Taking your page for a Test drive…
Open your file in the Browser WindowTO DO:1. Navigate to the Starbuzz folder 2. Click on the file with the IE symbol Success!!!
Although the results are a little…uh..unsatisfying.
That is because all you’ve done so far is go through the mechanics of creating a page and typing only content of the web page
WHAT DO WE HAVE TO DO?
Markup your text………
You Mark up your text with TAGS!
TAGS Give your page structure Enhance your text
ADD YOU <html> TAGS
<head><title>Strbuzz Coffee</title>
</head><body>
<h1>Starbuzz Coffee Beverage</h1>
<h2>House Blend, $1.49$</h2><p>a smooth, mold blend of
coffees from Mexico, Bolivia and Guatemala.</p>
Continued…
<h2>Mocha Café Latte, $2.35</h2>
<p>Espresso, steamed mild and chocolate syrup.</p>
<h2>Cappuccino, $1.89</h2><p>A mixture of espresso,
steamed mild and foam.</p>
And still continued….
<h2> Chi Tea, $1.85</h2><p>A spicy drink made with
black tea, spices, mild and honey.</p></body>
</html>
What does Starbuzz look like Now?
?
