21
Building a Web Page 26 August 2010

How a computer works The Internet Browsers Web Pages

Embed Size (px)

Citation preview

Page 1: How a computer works  The Internet  Browsers  Web Pages

Building a Web Page26 August 2010

Page 2: How a computer works  The Internet  Browsers  Web Pages

Agenda

How a computer works The Internet Browsers Web Pages

Page 3: How a computer works  The Internet  Browsers  Web Pages

How a Computer Works

Question: What film character is a good analogy to a computer?

Answer It is actually a very simple machine:

It executes exactly what it is told to do

Page 4: How a computer works  The Internet  Browsers  Web Pages

Simplified Computer Model

processor

instructions data

1. Get the instruction2. Get the data3. Do what it says

Page 5: How a computer works  The Internet  Browsers  Web Pages

Storing Information:Binary System

Everyone knows that computers store bits, right?

What does it mean?› All data is stored as a series of zeroes and

ones Why?

10

=

Page 6: How a computer works  The Internet  Browsers  Web Pages

Representing Numbers

Additive system› ||||| |||||› Every item represents 1› Examples of additive systems?

Positional system› Value = face * place› 37 = 3*10 + 7*1

||||

Page 7: How a computer works  The Internet  Browsers  Web Pages

Positional System

Base = number of different values in a position› Base 10 = 10 values: 0-9› Base 2 = 2 values: 0-1

Value of each position = power of base› b4 b3 b2 b1 b0

› Binary: 24 23 22 21 20

› 128 64 32 16 8 4 2 1 Where do you see these numbers?

Page 8: How a computer works  The Internet  Browsers  Web Pages

What is the Internet?

The machines The connections The content

Page 9: How a computer works  The Internet  Browsers  Web Pages

The Internet in 1980

Page 10: How a computer works  The Internet  Browsers  Web Pages

The Internet Circa 1998

Page 11: How a computer works  The Internet  Browsers  Web Pages

Two Types of Computers

Servers: contain information to share Clients: machine with a web browser

to access that information

Server Client

Web Server

PagesBrowse

r

Page 12: How a computer works  The Internet  Browsers  Web Pages

The Browser

BROWSER software on your

machine (client)WEB PAGE instructions stored

on a serverBrowser retrieves

web page from server and then follows instructions

BROWSER:Web page processor(software program)

InstructionsText

Page 13: How a computer works  The Internet  Browsers  Web Pages

Anatomy of a URL

Protocol: server-name/file-to-display HOW WHERE WHAT

Protocol: usually http Have you ever seen others? https? telnet? ftp?

Server-name The computer’s name

Usually begins with www Usually ends with 3 characters that define the kind of site

However, there are no rules: as long as its registered, you can get there

File-to-display Can be a whole path (just like Windows)

Page 14: How a computer works  The Internet  Browsers  Web Pages

Identifying Servers

Every machine has an address (IP address)› nn.nn.nn.nn, numbers from 0 to 127

What is your address?› http://www.lawrencegoetz.com/programs/ipinfo/

BUT numbers are too hard to remember› DNS (Domain name servers) map them for us› Look under Network Connections

Page 15: How a computer works  The Internet  Browsers  Web Pages

Web Pages

Text file that says what to display› Web pages use HTML (HyperText Markup

Language) a little history

Two types of information› Instructions on how or what to display› Text (the data)

Instructions are in the form of tags› < command >

Do NOT need any special tools to build› BUT tools can make it easier

Page 16: How a computer works  The Internet  Browsers  Web Pages

Choosing Tools

Very fancy tools exist› Ease of building vs. Control› Cost

We will use an editors that help you get it right

We will NOT use tools that hide what you are doing

We will use Komodo Editor

Page 17: How a computer works  The Internet  Browsers  Web Pages

Why Learn HTML?

Mainly, to demystify But more than that -- even if using a package Sometimes you …

› can’t figure out how to make it do what you want

› can’t figure out what is wrong› just want to make some minor changes

If you understand how it works, YOU are in control

Page 18: How a computer works  The Internet  Browsers  Web Pages

General Structure: HTML Page

<html>

<! --- most important item in head is the title --- ><head>

<meta content="text/html“><title>Put your title here</title>

</head>

<! --- body is where the “good stuff” is --- ><body>What will appear on the page<br>Here … and there</body>

</html>

WARNING: This is not a complete page.

Page 19: How a computer works  The Internet  Browsers  Web Pages

Sharing Web Pages

Using Komodo Editor creates a web page on your machine› You can use the browser to look at it

But who else can see it?› NOBODY

Want it to be on a SERVER› UNC provides: ISIS

Page 20: How a computer works  The Internet  Browsers  Web Pages

UNC Site

UNC website› Everything that is going to be available on the

web must be in your public_html folder› Treats index.html as your home page› Default is “This page is blank”

Creating WWW Pages at UNC-CH› http://help.unc.edu/?id=108

Page 21: How a computer works  The Internet  Browsers  Web Pages

How to Transfer

UNC discusses sftp (Windows) and fetch (Mac)

We will use Filezilla Why?

› Simpler interface› Cross platform