+ All Categories
Home > Documents > CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide...

CS 101 Sect 6 – the World Wide Web Introduction: history and essential standards of the World Wide...

Date post: 13-Jan-2016
Category:
Upload: mary-davidson
View: 213 times
Download: 0 times
Share this document with a friend
Popular Tags:
21
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. 1 [email protected]
Transcript
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.

[email protected]

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.

[email protected]

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.

[email protected]

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.

[email protected]

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.

[email protected]

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.

[email protected]

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.

[email protected]

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.

[email protected]

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 9: 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.

[email protected]

9

Files on the Web

Page 11: 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.

[email protected]

11

Web server and web browser are different

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.

12

[email protected]

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 13: 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.

13

[email protected]

Test solution

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.

14

[email protected]

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.

15

[email protected]

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.

16

[email protected]

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 17: 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.

17

[email protected]

Fare clic sull'icona per inserire un'immagine

Page 18: 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.

18

[email protected]

Fare clic sull'icona per inserire un'immagine

Page 19: 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.

19

[email protected]

Fare clic sull'icona per inserire un'immagine

Page 20: 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.

20

[email protected]

Fare clic sull'icona per inserire un'immagine

Page 21: 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.

21

[email protected]

Fare clic sull'icona per inserire un'immagine


Recommended