Week 1 Ð WWW BasicÐ WWW Basics 



CS 50.11A 
HTML and CSS 1 



What is the Internet? 



Thousands of computer networks 
connected together around the world 

The World Wide Web is a subset of the 
Internet Ð GUI 

Started in 1960s by US government Ð 
decentralized for security 

Hardware Needed 



Computer - IBM-compatible (PC), Macintosh, 
or UNIX 

Modem - exchanges information between your 
computer and the computer that connects you 
to the Internet 

Modem speed: 

Dial-up Ð pretty slow 

DSL (digital subscriber line) Ð a lot faster! 

Cable Ð should be even faster than DSL 

Satellite - variable, usually slower than DSL 

Software Needed 


Browser Ð Safari, Opera, Firefox, Chrome, 
Microsoft Internet Explorer 

E-mail program Ð Outlook, Outlook Express, 
Thunderbird, or web-based (Hotmail, 
Yahoo, gmail, etc.) 

Text editor Ð Notepad for PC, or TextEdit 
(or SimpleText) for Mac 

More laterÉ 

Service Provider 



Company that gives access to the Internet for 
a fee 

Big Commercial On-line Services 

AOL - America Online 

MSN - The Microsoft Network 

Good for beginners 

Internet Service Provider (ISP) 

Local or statewide/nationwide - Comcast, Sonic É 

Usually better for web page developers 

Uniform Resource Locator 
or URL 


Pronounced youareel 

The unique address of a web page 

Web page can be stored anywhere in 
the world 

Use of upper- and lower-case letters 
must be exact 

The URL has 3 parts 

http://www.actwin.com/fish/species.html 



The first is the protocol - set of rules 
the computer follows 

http:// means hypertext transfer 
protocol, the method a browser uses to 
read pages on the Internet 
 
Almost all browsers will read the URL 
without typing in the protocol 

http://www.actwin.com/fish/species.html 




The second part is the domain name 
 
The domain name is the Internet 
address of the computer where the 
web page is located 

You can buy your own domain name 

Do search for "domain name" 

Try http://www.register.com to see what's 
available 

http://www.actwin.com/actwin.com/fish/species.html 



The third (optional) part of the URL is 
the file specification 

The file specification includes the 
filename of the web page (species.html) 
and possibly a directory or folder name 
(fish) 

index.html is default filename (used 
when no file is specified) 

Last few characters indicate... 



com commercial (billg@microsoft.com) 

gov government (president@whitehouse.gov) 

net network (smith@sbcglobal.net) 

edu education (cmassell@santarosa.edu) 

mil military (webmaster@nrl.navy.mil) 

org organization (information@sierraclub.org) 

others -.biz, .name, .info, .us, .ca, etc. 



Terminology 


Internet / World Wide Web 

Web Page / Web Site 

Domain Name 

Home Page 

The first page you see when you start your web 
browser 

The first page of a web site 
 
Individual's personal web page 

More Terminology 
Web author 

Webmaster 

Browser 

Search Engine 

Spider / Crawler 

Critical Terminology 



SGML Ð Standard Generalized Markup 
Language 

HTML Ð HyperText Markup Language 

XML Ð Extensible Markup Language 

XHTML Ð combines HTML and XML 

DHTML Ð Dynamic HTML 

Class Resources 



Your instructor Ð for help 

Web site Ð for all class materials 

http://www.santarosa.edu/~cmassell/online_htmla/index.html 

Note: when you see a space in an underlined URL, it usually isn't a 
space! There is an underscore there instead Ð online_htmla 

Book Ð for content and direction 

Online lectures Ð lecture and demos 

Handouts Ð for extra information 

Your classmates Ð for help and support 

Printing a Web Page 


ALWAYS go to File>Print instead of 
clicking on the Print button 

Most browsers will allow you to decide 
how many pages to print 

You can also print only selected text 

On some Web pages only part of what 
you see will print (frames pages) 
¥ 
No printing web pages in SRJC lab 

What is plagiarism? 

The act of using ideas, words, or 
images of someone else as your own. 

The use of someone else's work is 
referred to as copyright infringement. 

This is VERY easy to do with the WWW 
at our fingertips. 

If you use someone else's code, words, 
or images, cite your sources Ð always! 

Copying Text from the Web 


Highlight the text you want 

Click on Edit>Copy 

Open a word processing program 

Place your cursor where you want the text to 
show up and click Edit>Paste 

The spacing may be a little funky, but at least 
you have your information! 

And remember to give credit to the author!! 

Copying an Image from the Web an Image from the Web 


Note: use this technique for word 
processing, not for creating web pages 

Move your cursor over the image and right-
click (PC), hold mouse button (Mac) 

Select the Copy option from the context 
sensitive menu 

Open a word processing document 

Place your cursor where you want the image 
to show up and click Edit>Paste 

And remember to give credit to the author!! 

Saving an Image from the Web an Image from the Web 


Note: necessary for use in a web page 
 
Move your cursor over the picture and right-
click (PC), hold mouse button (Mac) 

Select the Save Image/Picture asÉ option 
from the context sensitive menu 

Decide where you are going to save the 
picture and give it a new name, if necessary 

ALWAYS keep the three-letter extension as it 
first shows up in the Save As dialog box 

And remember to give credit to the author!! 

Viewing Web Page Source Code 


Move your cursor over a non-picture 
part of page and right-click (PC) or hold 
(Mac) mouse button 

Select View Source or View Page Source 
from the context-sensitive menu 

From here you can view, print, and/or 
save the code 

Go forth and have fun!