HTML Fourth Year

8/3/2019 HTML Fourth Year

http://slidepdf.com/reader/full/html-fourth-year 1/22

TLE 4 (ICT)

FOURTH QUARTER

WEBFUNDAMENTALSAND HTML



Introducing the World WideWeb

Internet – is a structure made up of million of interconnected computerswhose users can communicate with

each other and share information.

Network – computers that are linked

together



World Wide Webalso known as the WWW or the Web

is an organization of files designed around a groupof servers on the Internet programmed to handlerequests from browser software on users’ PC’s.

is the fastest growing , most commercially popular

technology to date.

TIM BERNERS-LEE – a programmer who wrote aprogram called a hypertext editor.

Hypertext document – an electronic file thatcontains elements that you can select, usually byclicking a mouse, to open another document.



Web sites – a representation of acompany’s product or services

available for display via the Web.Webmaster – a person who is skilled inWeb design, Web maintenance and

Web upgrade.Browser – a program designed tosearch for and bring in Internet

resources.Plug-in – specialized program designedto enhance a function.



Web server – is the computer thatstores the web document that users

access.Web browser – is the software programthat accesses the web document and

displays it contents on the user’scomputer

Hypertext Markup Language – the

language of the WebStandard Generalized Markup Language– SGML is one example of a more

general mark up language



Versions of HTML

1. HTML 0.0 – the original version

developed by Tim Berners Lee andother researcher at CERN. It has longbeen supplanted by the succeeding

versions of HTML2. HTML 1.0 (1989-1994)– the first

public version of HTML, which

included support for inline imagesand text controls. Some browsers,most notably the text-based Lynxbrowser used on the UNIX system,operates at the 1.0 level



3. HTML 2.0 (1995) - the version supported by allgraphical browsers including NetscapeNavigator, Mosaic and Internet Explorer. It

supported interactive form elements such asoption buttons and text boxes. A documentwritten to follow 2.0 specification would bereadable by most browser on the Internet.

3. HTML 3.2 (1997) – this version is also referred toas HTML+. It includes more support for creatingand formatting tables and expands the option

for creating interactive elements. It also allowsfor the creation of complex mathematicalequations.



5. HTML 4.01 (1999) - This version added supportfor style sheets and scripting ability formultimedia elements. HTML 4.01 focused on

separating presentation styling information fromthe actual content by the use of style sheets asHTML 3.20 resulted in difficult maintenancebecause presentation styling information wasincluded directly in the webpage. In HTML 4.0 withthe use of style sheets, it is now possible tochange the appearance/look of the website bychanging just the style sheet (s) itself. Incomparison, in the earlier versions of HTML

making the same changes for the entire websitemeant changing the styling information in theindividual pages!

5. HTML 5 (2012) – update of all the versions



HTML editors — tools forcreating HTML documents

The software packages can be groupedinto two main categories:

text-based (or code-based) editors

WYSIWYG (what you see is what you get )

editors



What is HTML?

HTML is a language for describing web pages.

HTML standsfor Hyper Text Markup Language

HTML is not a programming language, it isa markup language

A markup language is a set of markup tags

HTML uses markup tags to describe webpages



HTML Tags

HTML markup tags are usually called HTML tags

HTML tags are keywords surrounded by anglebrackets like <html>

HTML tags normally come in pairs like <b>and </b>

The first tag in a pair is the start tag, thesecond tag is the end tag

Start and end tags are also called openingtags and closing tags



ocumen s = ePages

HTML documents describe web pages

HTML documents contain HTML tags andplain text

HTML documents are also called web

pages

The purpose of a web browser (like Internet

Explorer or Firefox) is to read HTMLdocuments and display them as webpages. The browser does not display theHTML tags, but uses the tags to interpret

the content of the page



HTML STRUCTURE<html>

<head>

<title>First Web</title>

</head>

<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body></html>



Parts of Web Page1. HTML - tags indicate codes is written in

HTML <HTML> </HTML>2. Head – surround information about web

page●

- Info about the document● Info in header not generally rendered

in display window

●

<Head> </Head>3. Title – tags identify title. It usually

appears on the title bar● - name of your Web page

● <Title> </Title>



4. Body – tags surround the portion of the

document that appears in the

browser- Page content

● - Includes text, images, links,

forms, etc.● - Elements include backgrounds,

link colors and font faces

● <Body> </Body>



.HTM or .HTML File

Extension?When you save an HTML file, you can useeither the .htm or the .html file extension.

There is no difference, it is entirely up toyou.



HTML HeadingsHTML headings are defined with the <h1> to

<h6> tags.

Example:

<h1>This is a heading</h1><h2>This is a heading</h2><h3>This is a heading</h3>

<h4>This is a heading</h4>

<h5>This is a heading</h5><h6>This is a heading</h6>



HTML Paragraphs

HTML paragraphs are defined with the <p>tag.

Example:

<p>This is a paragraph.</p>

<p>This is another paragraph.</p>



HTML Links

HTML links are defined with the <a> tag.

Example:

<a href="http://www.w3schools.com">This is alink</a>

Note: The link address is specified in the href attribute.



HTML Images

HTML images are defined with the <img> tag.

Example:

<img src="w3schools.jpg" width="104"height="142" />



HTML Text Formatting Tags

<b> Defines bold text

<big> Defines big text

<em> Defines emphasized text

<i> Defines italic text

<small> Defines small text

<strong> Defines strong text

<sub> Defines subscripted text

<sup> Defines superscriptedtext



The HTML <font> Tag The example below shows how the HTML could

look by using the <font> tag:Example

<p>

<font size="5" face="arial" color="red"> This paragraph is in Arial, size 5, and in red textcolor.</font>

</p>

<p><font size="3" face="verdana" color="blue">

This paragraph is in Verdana size 3 and in blue

Documents

HTML Fourth Year