CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide...
-
Upload
mary-davidson -
Category
Documents
-
view
212 -
download
0
Transcript of CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide...
![Page 1: CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide Web. How the Web works: servers and browsers. Web building.](https://reader035.fdocuments.in/reader035/viewer/2022070410/56649ee05503460f94bf0159/html5/thumbnails/1.jpg)
1
CS 101 Sect 6 – the World Wide Web
Introduction: history and essential standards of the World Wide Web.
How the Web works: servers and browsers. Web building primer. What is hypertext, a basic web page. Introduction to Web design: how to create a web site to
express ideas graphically, writing for the web.Tools for Web design: Web editors, HTML Editors, Web
publishing.Building blocks of a web page, adding colours, images,
links and tables, HTML writing standards and CSS.References online: the W3C tutorial and other reference
material.
![Page 2: CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide Web. How the Web works: servers and browsers. Web building.](https://reader035.fdocuments.in/reader035/viewer/2022070410/56649ee05503460f94bf0159/html5/thumbnails/2.jpg)
2
Your first Web page
Just follow me, do not worry if you do not understand
Open notepadCopy the text from the following slide
![Page 3: CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide Web. How the Web works: servers and browsers. Web building.](https://reader035.fdocuments.in/reader035/viewer/2022070410/56649ee05503460f94bf0159/html5/thumbnails/3.jpg)
3
Text for your first web page
<html><head>
<title>Head First Lounge</title></head><body>
<h1>Welcome to the Head First Lounge</h1><p>Join us any evening for refreshing elixirs, conversation and maybe a game or two of <em>Dance Dance Revolution</em>.Wireless access is always provided; BYOWS (Bring your own web server).</p>
<h2>Directions</h2><p>You’ll find us right in the center of downtown Webville. Come join us!</p>
</body></html>
![Page 4: CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide Web. How the Web works: servers and browsers. Web building.](https://reader035.fdocuments.in/reader035/viewer/2022070410/56649ee05503460f94bf0159/html5/thumbnails/4.jpg)
4
Your first Web page
Save on your desktop as myname1.html (“myname” is supposed to be “your” name, e.g. In my case that would be gazziano1.html, ok ??)
Double click on the file you savedThere is your first web page
![Page 5: CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide Web. How the Web works: servers and browsers. Web building.](https://reader035.fdocuments.in/reader035/viewer/2022070410/56649ee05503460f94bf0159/html5/thumbnails/5.jpg)
5
You’re closer to learning HTML than you think
Surprise: class test now
Take a look at the “tags” (the statements within <>) and see if you can guess what they tell the browser about the content
10 minutes to complete
![Page 6: CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide Web. How the Web works: servers and browsers. Web building.](https://reader035.fdocuments.in/reader035/viewer/2022070410/56649ee05503460f94bf0159/html5/thumbnails/6.jpg)
6
Text for your second web page
<html><head>
<title>Head First Lounge</title></head><body>
<h1>Welcome to the Head First Lounge</h1> <img src=”drinks.gif”> ((WHAT?? WHERE IS THIS??)) (ASK THE
TEACHER)<p>Join us any evening for refreshing elixirs, conversation and maybe a game or two of <em>Dance Dance Revolution</em>.Wireless access is always provided; BYOWS (Bring your own web server).</p>
<h2>Directions</h2><p>You’ll find us right in the center of downtown Webville. Come join us!</p>
</body></html>
![Page 7: CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide Web. How the Web works: servers and browsers. Web building.](https://reader035.fdocuments.in/reader035/viewer/2022070410/56649ee05503460f94bf0159/html5/thumbnails/7.jpg)
7
The Internet
Sometimes called simply “the Net,” the Internet is a worldwide system of computer networks—a network of networks hence Internet, in which users at any one computer can get information from any other computer
The Internet uses a portion of the total resources of the currently existing public telecommunication networks. Technically, what distinguishes the Internet is its use of a set of protocols called TCP/IP (Transmission Control Protocol/Internet Protocol).
![Page 8: CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide Web. How the Web works: servers and browsers. Web building.](https://reader035.fdocuments.in/reader035/viewer/2022070410/56649ee05503460f94bf0159/html5/thumbnails/8.jpg)
8
The World Wide Web
Runs on the Internet, Intranet, Extranet
Uses the Hypertext Protocol (HTTP)
We just call it the Internet, but it is a subset of it
![Page 12: CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide Web. How the Web works: servers and browsers. Web building.](https://reader035.fdocuments.in/reader035/viewer/2022070410/56649ee05503460f94bf0159/html5/thumbnails/12.jpg)
12
Intranet / Internet tools for CS 130
Fare clic sull'icona per inserire un'immagineThe
W3school, world’s largest website for developers is a fundamental source of references and training.
They set the Web standards !!!
![Page 14: CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide Web. How the Web works: servers and browsers. Web building.](https://reader035.fdocuments.in/reader035/viewer/2022070410/56649ee05503460f94bf0159/html5/thumbnails/14.jpg)
14
Find Coffee Cup Html Editor on your pc
Now for some serious stuff
From now on we will use an HTML editor
Let us open our index and mission file with it
Follow my instructions
![Page 15: CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide Web. How the Web works: servers and browsers. Web building.](https://reader035.fdocuments.in/reader035/viewer/2022070410/56649ee05503460f94bf0159/html5/thumbnails/15.jpg)
15
Next stage: rebuild a better LOUNGE
Fare clic sull'icona per inserire un'immagineFind the LOUNGE folder with files on MYJCU shared files
Download the files in your
X:/CS130/LOUNGE/
Folder
Open HTM editor and load all .html
![Page 16: CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide Web. How the Web works: servers and browsers. Web building.](https://reader035.fdocuments.in/reader035/viewer/2022070410/56649ee05503460f94bf0159/html5/thumbnails/16.jpg)
16
Fare clic sull'icona per inserire un'immagineFind the LOUNGE folder with files on MYJCU shared files
Download the files in your
X:/CS130/LOUNGE/
Folder
Open HTM editor and load all .html