introduction to html. what is a web site? a collection of "pages" or files linked together...

9
Introduction to HTML

Upload: bertram-smith

Post on 24-Dec-2015

214 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Introduction to HTML. What is a Web site? A collection of "pages" or files linked together and available on the World Wide Web What do you need to create

Introduction to HTML

Page 2: Introduction to HTML. What is a Web site? A collection of "pages" or files linked together and available on the World Wide Web What do you need to create

What is a Web site? A collection of "pages" or files linked together and available on the World Wide Web

What do you need to create a Web site?1. Hardware

2. Software (any web-authoring software - Macromedia Dreamweaver, Adobe GoLive, Netscape Composer, etc)

3. Know-how (HTML)

Web site essentials

Computer Web Server

(FTP) connection

Page 3: Introduction to HTML. What is a Web site? A collection of "pages" or files linked together and available on the World Wide Web What do you need to create

Stands for:HyperText Markup Language

Defined as:A simple programming language used for creating and controlling how Web pages appear

Invented by:Tim Berners-Lee around 1989-1990

Reviewed and improved by:World Wide Web Consortium (W3C) - www.w3.org/MarkUp/

What is HTML?

Page 4: Introduction to HTML. What is a Web site? A collection of "pages" or files linked together and available on the World Wide Web What do you need to create

TAGS<element attribute value> Web page content </element>

Elements:Little labels that create the parts of a Web page: paragraph, table, fonts, images, etc

Attributes:Properties of the elements: alignment, width, height, style

Values:Properties of the attributes

An example:<table width=“800” align=“center”> Table content </table>

HTML Syntax

element attribute value attribute value

Page 5: Introduction to HTML. What is a Web site? A collection of "pages" or files linked together and available on the World Wide Web What do you need to create

Type of document:<HTML> Your whole Web page goes here </HTML>

Head:<HEAD> Some Web page settings such as Title, Author, Page description </HEAD>

Body:<BODY> The entire visible content of your Web page </BODY>

Think of it like a person ->

A typical Web page

Page 6: Introduction to HTML. What is a Web site? A collection of "pages" or files linked together and available on the World Wide Web What do you need to create

No Web page layout without a TABLE:<TABLE>

<TR><TD>This is row 1, column 1</TD><TD>This is row 2, column 2</TD></TR>

<TR><TD> This is row 2, column 1 </TD><TD> This is row 2, column 2 </TD></TR>

</TABLE>

Essential HTML elements - TABLE

R1C1 R1C2

R2C1 R2C2

Page 7: Introduction to HTML. What is a Web site? A collection of "pages" or files linked together and available on the World Wide Web What do you need to create

Arrange text in PARAGRAPHS:

<P>

Use the <p> tags to start a paragraph. Don’t forget to close each paragraph with a </p>. Using this tag creates an empty one-line space between your paragraphs.<BR>When I don’t want a one-line space before my sentence, then I use the <BR> tag instead. This command makes my text to start on a new line, but without the spaces created by the paragraph tag.

</P>

Essential HTML elements –PARAGRAPHS & LINES

Page 8: Introduction to HTML. What is a Web site? A collection of "pages" or files linked together and available on the World Wide Web What do you need to create

Go to another Web site:

<A HREF=“http://www.web-site-address.com”> The word or image you want people to click to go to this new location </A>

Go to another page in your site:

<A HREF=“name-of-your-file.htm”> The word or image you want people to click to go to this new page </A>

Send me an e-mail:

<A HREF=“mailto:[email protected]”> The word or image you want people to click to open up e-mail software </A>

Essential HTML elements – HYPERLINKS

Page 9: Introduction to HTML. What is a Web site? A collection of "pages" or files linked together and available on the World Wide Web What do you need to create

Basic rules:

• HTML is abbreviated English: tags are logical and have meaning.

• A Web page is a combination of pieces (text, picture, multimedia) kept together by HTML tags.

• Keep the pieces small – large file size results in slow browsing.

• No capital letters, spaces or other special characters in your file names.

• Keep all files in the same folder!!!

Where to find HTML tags:• HTML Cheat sheet:

http://webmonkey.wired.com/webmonkey/reference/html_cheatsheet/index.html

In summary