LEARN WITH CLASSMATE: HTML

Saturday, 28 November 2015

TUTORIAL 2

USING TAGS

Include the following in the page

<!DOCTYPE html>

<html>

<body>

WELCOME TO MY PAGE

</body>

</html>

<!DOCTYPE html>

specifies the type of webpage is html

it instructs the web browser which version of html is being used, html indicates HTML5
if document type declaration is not specified, browser may behave in a peculiar way

<html> the opening tag, denotes the beginning of the html document

</html> the closing tag, denotes the end of html document

whatever is written between will be considered as html document

<body> denotes the beginig of the body of the html page

</body> denotes the end of the body

So whatever you have typed now within the <body> and </body>, is the body

WELCOME TO MY PAGE is the body here, and displayed in the browser window

</html> </body> - closes the respective elements

All the tag do not have the closing tags. there are certain tags which do not have the closing tags

Tags which do hold any contents will close themselves. So they do not need a separate closing tag

eg : <br> - denotes the line break

it doesnt wrap any content

this might also be written like <br/>

it is a self closing tag. that mean, closing by itself.

generally used in xhtml coding

xhtml is another version of html based on another markup lanuage xml

Any tag which has content must be closed

Syntax : opening tag -> content -> closing tag

This makes the code easier to understand

TUTORIAL 1

WHAT IS HTML?

HTML - Hyper Text Markup Language

It is the standard markup language used to create web pages.

A markup language is a set of markup tags

HTML documents are described by HTML tags

Each HTML tag describes different document content

It is used by most websites to create visually engaging webpages, user interfaces for web applications, and user interfaces for many mobile applications

HTML markup consists of several key components, including those called tags (and their attributes), character-based data types, character references and entity references.

We are here to learn HTML.

WHAT WE NEED TO START WITH HTML?

Notepad is a common text editor on Windows-based computers (usually found under the Programs > Accessories menu)

Mac OSX computers come bundled with TextEdit

But any program that lets you fiddle with text will do.

LETS BEGIN !

Type this in to your text editor:

My First HTML Page Welcome here

Now create a folder called “html” wherever you like to save files on your computer and save the file as “myfirstpage.html”.

It is important that the extension “.html” is specified
Some text editors, such as Notepad, will automatically save it as “.txt” otherwise.

You also need to ensure that your file is being saved as plain text.

Make sure you check the “Plain text” format option before creating a new file.

Open a web browser and type in the location of the file, you just saved (e.g : “C:\html\myfirstpage.html”), in the address bar and hit return.

Alternatively, go to the File menu of the browser, select Open, and browse for the file.

Here we have created a very simple webpage of our own. Its that easy....

You may be tempted to use a dedicated software program such as Adobe Dreamweaver.

You should be very careful when using these programs, especially if you are a beginner

Software programs such as these will never give you the same control over a web page as coding by hand.

If you do decide to use specialized code-editing software, we recommend one in which you are still coding by hand.