Introduction to HTML

Introduction to Web Design Part 1: HTML

If You Know Nothing About HTML, This is Where You Begin.

HTML Issues for Organisations ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Advantages of knowing HTML Code ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

What is HTML? ,[object Object],[object Object],[object Object],[object Object],[object Object]

What is Hypertext? ,[object Object],[object Object],[object Object],[object Object],T

Hypertext in History ,[object Object]

Hypertext through History ,[object Object],A page from Dr. Samuel Johnson’s Dictionary with references to the usage of the words in literature.

Hypertext in Academe ,[object Object]

Hypertext in Literature ,[object Object]

Macintosh in the 80s ,[object Object],[object Object]

Now, what is a mark-up language? ,[object Object],Before HTML After HTML

Do you recognise this? ,[object Object]

A marked-up page (or proof) ,[object Object]

The library science & archives students should recognise this model of a markup language?

The MIM, library science & archives students should recognise this?

The Encode Archival Description used in Archives’ Finding Aids. ,[object Object],[object Object],[object Object]

Recognise these old text formatters?

What do text-formatters do? ,[object Object],[object Object]

A very brief History of HTML ,[object Object],[object Object],[object Object],[object Object]

The W3C: A www Consortium ,[object Object]

internet vs. www ,[object Object],[object Object],[object Object],[object Object]

HTML is no different from any other formatting language. ,[object Object],[object Object],[object Object]

HTML uses Tags to markup the text ,[object Object],[object Object],[object Object]

Getting Started ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Everything from here on is provided in the practical exercises webpage at http://itbn362.10gbfreewebhost.com , but I will explain if we have time.

Basic Document Structure ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Elements ,[object Object],[object Object],[object Object],[object Object]

Start Tags ,[object Object],[object Object],[object Object],[object Object]

End Tags ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Empty Elements ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Content ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Nesting ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Nesting, continued ,[object Object],[object Object],[object Object],[object Object],[object Object]

Required Elements ,[object Object],[object Object],[object Object],[object Object],[object Object]

<html> ,[object Object],[object Object],[object Object],[object Object],[object Object]

<head> ,[object Object],[object Object],[object Object],[object Object]

<title> ,[object Object],[object Object],[object Object]

<body> ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Put It All Together ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Beginning to Write ,[object Object],Note: Better not to use underline as it may be confused as a link. Underline Underline U Underline Italic Italic I Italic Bold Bold B Bold What it Does Code Used Code Effect

Tags cont. ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Single Tags ,[object Object],This stands for P aragraph. It does the exact same thing as the above except this tag skips a line. BR just jumps to the next line, P skips a line before starting the text again. This BR eaks the text and starts it again on the next line. Remember you saved your document as TEXT so where you hit ENTER to jump to the next line was not saved. In an HTML document, you need to denote where you want every carriage return with a . This command gives you a line across the page. ( HR stands for Horizontal Reference.) <hr> What It Does Tag

Writing Your First Page Looks like this This… Example:

Manipulating Text ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Font Size ,[object Object],[object Object],[object Object],[object Object],[object Object]

Font Color and Face ,[object Object],[object Object],[object Object],[object Object],[object Object]

Text Alignment ,[object Object],[object Object],[object Object],[object Object],[object Object]

Remember! ,[object Object],[object Object],[object Object]

The End ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Introduction to HTML

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (17)

Similar to Introduction to HTML

Similar to Introduction to HTML (20)

Recently uploaded

Recently uploaded (20)

Introduction to HTML