The World Wide Web
The World Wide Web often referred to as WWW a software
program which allow people to find documents on the Internet much
more easily.
The World Wide Web (WWW) is a network of online content that is
formatted in HTML and accessed via HTTP. The term refers to all the
interlinked HTML pages that can be accessed over the Internet. The
World Wide Web was originally designed in 1991 by Tim Berners-Lee
while he was a contractor at CERN.
What Is the Internet?
The internet is the network of networks that provides the basis for the
web. As NBC News explains, some form of internet technology dates back
to 1969, and a U.S. government program by the Department of Defense
Advanced Research Projects Agency. Known as ARPANET, this mainframe
computer network eventually became the basis for all types of digital data
transfer.
Web Browser
A browser is a software program which interprets the HTML
documents and displays it on the user’s screen. Internet explorer,
Chrome, Mozilla Firefox are examples of browsers commonly used
today.
It is an application software that allows us to view and explore
information on the web. User can request for any web page by just
entering a URL into address bar. Web browser can show text, audio,
video, animation and more. It is the responsibility of a web browser
to interpret text and commands contained in the web page. Earlier
the web browsers were text-based while now a days graphical-
based or voice-based web browsers are also available.
Following are the most common web browser available today:
BROWSER VENDOR
Internet Explorer Microsoft
Google Chrome Google
Mozilla Firefox Mozilla
Netscape Navigator Netscape Communications Corp.
Opera Opera Software
Safari Apple
Sea Monkey Mozilla Foundation
K - meleon K- meleon
Search Engines
A search engine is a coordinated set of programs that searches for
and identifies items in a database that match specified criteria.
Search engines are used to access information on the World Wide
Web.
• The text gives you the basic information for using search engines
and directories.
You need to understand and remember that the various search
engines use different methods of helping you find information on
the Web.
• Examples of Search- Engines include Google, Bing, Baidu, Yahoo,
Yandex, YouTube, Amazon
Creating a basic Webpage
• HTML stands for Hyper Text Markup Language. It is a set of rules
(instructions) that acts as a formal language for creating websites
using tags
• When you connect to a web page your browser interprets the html
and displays the resulting web page (text/graphics/links etc).
•
What you need to begin designing your homepage
• You should set up a folder or directory to hold only your HTML files
(also called documents) for the web pages you are designing.
• A web browser is also needed. Internet Explorer and Mozilla Firefox
are among today's most popular browsers for viewing web pages
and for surfing the internet.
• You also need a simple word processor such as NotePad or
WordPad.
Start --> Programs --> Accessories --> NotePad
• When you want to save your web page for the first time, you need
to give it a name. You not only have to give it a name but you also
need to add an extension to the name.
Web page syntax
• The contents of a web page do not appear the same as how they
appear in you source code. We use “tags” to define the formatting
of the contents of the web document. Paragraphing, boldness,
italics, headings and breaks to mention a few are supposed to be
defined. All the tags are denoted by angle brackets like;
• <p></p>
• Each tag is opened and closed after the text that is supposed to be
formatted e.g.
• <p> This is my paragraph</p>
• This tag creates a paragraph of the enclosed text.
• The following example is a simple HTML web document.
• <html>
• <head>
• <title>This is my first web page</title>
• </head>
• <body>
• <p> I like web programming. It is fantastic. </p>
• </body>
• </html>
The process of web designing consists of the
following basic steps:
• create your web page in a text editor such as NotePad (typing in all
the text and tags)
• save your web page as an HTML file using any appropriate name e.g
homepage.html ( leave no spaces in between )
• load the HTML file into the browser to see how your web page looks
and works
• switch back to NotePad to make any corrections, changes, etc.
Create the web page in your text editor and save it.
<html>
<title>Creating a Basic Web Page</title>
</head>
<body>
<h1>This is a header text.</h1>
<p>This is a paragraph.</p>
<h2>This is a h2 header text.</h2>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
<p>Paragraph elements are defined by the p tag.</p>
</body>
</html>
HTML ELEMENTS
<HTML> and </HTML> tags
The first line in the coding reads <HTML>. It tells the browser that what
follows is an HTML document. It is called the opening HTML tag. The last
line in our coding reads </HTML>. It tells the browser that the HTML
document is finished. It is called the closing HTML tag.
<HEAD> and </HEAD> tags
• The HEAD element follows . The HEAD part provides information
about the document. You do not see this information displayed in
your browser.
• The HEAD tag must not contain any text or normal markup tags.
<TITLE> and </TITLE> tags
• One of the statements that must be included between the <HEAD>
and </HEAD> tags is the TITLE of your web page. The TITLE of your
web page must occur between the <TITLE> and </TITLE> tags.
Notice that this title is placed by the browser at the very top of the
screen.
• Because we do not want the title to be displayed on the browser
screen, the <TITLE> and </TITLE> tags must be placed between
the <HEAD> and </HEAD> tags.
<BODY> and </BODY> tags
• After the title comes the main body of your Web page. It contains all
the text and tags. It is the part that will be displayed on the browser
screen.
• Of course the tags will not be displayed on the browser screen. The
tags only tell the browser how to display the information.
Create the web page in your text editor and save it.
<HTML>
<HEAD>
<TITLE>WEB PAGE DESIGN - BASIC TAGS</TITLE>
</HEAD>
<BODY>
Line 1: Hi, my name is Eddie.<BR>
Line 2: This is my first attempt at a Web page.<HR>
Line 3: Here we are in web designing.<BR>
Line 4: Web programming is funny?<HR>
Line 5: Will be a webmaster soon.<BR><BR><HR>
</BODY>
</HTML>
Paragraph Tag
• <p> tag is the paragraph tag. It is used so separate text within a
web page. It provides line breaks.
Break Tag
• <br/> tag, is used for a line break. It breaks the line to the next
line. If we use double line breaks, they will leave a blank line.
<p>
Contact<br />
1257<br />
Hugh Gundry<br />
Bindura
</p>
Define Headers
Headers are defined from heading 1 to 6 with the aid of tags <h1> to
<h6>. <h1> defines the largest header. <h6> defines the smallest
header. Example
<h1>This is header 1</h1>
<h2>This is header 2</h2>
<h3>This is header 3</h3>
<h4>This is header 4</h4>
<h5>This is header 5</h5>
<h6>This is header 6</h6>
Exercises
<html>
<head>
<!--set the title of the page to the current date-->
<title>January 9th, 2009</title>
</head>
<body>
<!--print a message-->
When was this webpage created?
Check page's title for the answer.
</body>
</html>