Welcome {IP},

As you are not registered you should Register as we have many Great Futures. We are currently hiring in many groups. We are planning on growing in to a fine active and vast community. So please Register today!

Regards,

~Krazy-Programming Staff~

the tempory basic guide to HTML

 :: Tutorials :: Tutorials

View previous topic View next topic Go down

the tempory basic guide to HTML

Post by Tommo on Mon Mar 23, 2009 12:05 pm

HTML
HTML is the fundamental language of the world wide web. Learning HTML will serve as a good and simple introduction to web page building.


INTRO

What you should already know
Before studying HTML, you do not necessarily need to have an understanding of any other computer languages. HTML is relatively easy to learn and does not build on previous technical knowledge or experience, therefore it is OK if you are beginning HTML without those things. However, you should be familiar with using a computer and accessing the internet. Specifically, you should know what a web browser is (hint: it's the program you're using right now to read this webpage) and how to use a basic text editor (like notepad in Windows) and save files with it.

What is HTML?
HTML is a web language used to write webpages. While there are many other web languages such as Javascript, VBScript, and PHP, HTML is different - it is the core language of the world wide web, the fundamental building block of web pages. With HTML, you decide what text and graphics will appear on a webpage as well as other elements found on webpages such as forms and links. HTML is designed to specify the logical organization of a webpage.

What HTML is not
One feature of HTML that some people do not know about is that HTML is a static language. This means that the content you create with HTML does not change, it is not dynamic. HTML is used to create and place various elements on a webpage, it is not used to create things like calculators and other things which would require dynamic data.

Dynamic content can be created with languages such as as Javascript, VBScript, and PHP.

Another thing about HTML that should be mentioned is that HTML is not used for styling. For example, with HTML you set what text appears on the page, not its color, font style, and font size. Not just with text, any elements on a webpage such as form elements (textboxes, drop downs, submit buttons, etc.) or links are displayed with HTML but the styles for these elements (layout on the page, text color, background color, size, etc.) are NOT set with HTML.

NOTE: HTML is used to set the logical organization of a webpage and what elements will appear on it, but not the styles of these elements. To style the elements of a webpage, another language called CSS is used.


HTML dissected
HTML stands for Hyper Text Markup Language. When you are viewing a webpage, you do not have to look at it in a linear fashion. Instead, you can look at any part of the page anytime you want. Hyper being the opposite of linear is the way HTML operates, allowing you to view any part of a webpage at any time. HTML is a markup language - a language that has code which indicates layout and styling. Some other markup languages include XML and SGML.

The world wide web
HTML is used to create web pages on the world wide web, but what is the world wide web?

When it comes to the world wide web, a common misconception exists that the world wide web and the internet are synonomous. The world wide web is only a small subset of the internet. The world wide web is the medium by which webpages and other resources such as sounds and images are transferred from various web sites, and users send requests for these resources as well as data to web servers. The word 'internet' is an abbreviation for 'internetwork' and it is the global communications system which links together various computer networks around the world allowing for intercommunication between devices and people on these networks. The global communications system which is the internet employs various different protocols to allow for intercommunication between devices and people on different networks. One of these protocols is the HTTP protocol.

The HTTP protocol
HTTP stands for Hyper Text Transfter Protocol. It is this protocol that is used to transfer data across the world wide web. Every time you enter a websites URL in your web browser (ex. www.yahoo.com), your web browser is making use of the HTTP protocol to send your request for a webpage (or any other web resource such as an image) and then transfers the data to you. The data for a website is stored on a computer called a web server.

The HTTPS protocol
While HTTP is used to transfer data across the world wide web, there is another protocol which works just as HTTP does, but adds a layer of security. This protocol is the HTTPS protocol. HTTPS stands for Hyper Text Transfer Protocol Secure. HTTPS is used to encrypt communication between a web browser and a web server. HTTPS is often used on websites that need to provide private communication such as online stores and membership sites. Next time you are making a purchase from an online store look at your web browsers address bar, the beginning part of it should say HTTPS.

NOW LETS GET STARTED

HTML file extensions
HTML documents have a file extension of .htm or .html

In the past, the .htm extension was used because of older operating systems which limited file extensions to three letters. Noawadays however, the .html extension is mostly used and using this extension is better convention.

What is a tag?
The tag is the most fundamental concept in HTML.

Tags are sorrounded by < and > symbols (called angle brackets)
Most tags in HTML have an end tag, some do not
Tags are NOT case sensitive, so whether you use upper case or lower case tags is up to you


Example:

<i>this text will be italic</i>

Output:

This text will be italic
The above example is of the <i> tag - a tag which produces italic text. In this example, the <i> tag is used with its end tag </i>. The text sorrounded by these two tags will become italic.

When using a tag that has an end tag, its end tag will be the same but with a / symbol in front of the first angle bracket.

Example:

<b>bold text</b>
One tag in HTML that does not have an end tag is the <hr> tag. The <hr> tag is used to create a horizontal line across a webpage.

Example:

<hr width="40%" />
Output:

--------------------------------------------------------------------------------

You probably noticed the extra data in the <hr> tag from the above example - specificially the width="40%" part. This is called an attribute.

NOTE: When using a tag that does not have an end tag, use the / symbol before the closing angle bracket as in the example above.
What is an attribute?
An attribute is a piece of data within a tag which sets the value for a certain property of the tag.

NOTE: Attributes provide details about the elements on pages and are located in start tags only, not in end tags.
Example:

<font size="6" color="blue" face="Times New Roman">
Some text
</font>



The tag from the above example is the <font> tag. This tag is used for working with text and is covered in detail in the next lesson.

NOTE: The <font> tag is deprecated in HTML 4.01 and above
What is an element?
An element in HTML is anything that appears on a webpage. An element consists of the grouping of a start tag, the data that comes after it, and an end tag.

Example:

<b>bold text</b>

The above element prints the text bold text on a webpage. It begins with the start tag <b>, contains the content bold text, and ends with the end tag </b>.

Including comments
Comments:

are declared so that code would be easier to understand and navigate
are not seen on a webpage, only within the source code
can be placed anywhere within HTML source code
can span as many lines as necessary
declared with a starting <!-- and an ending -->
Syntax for creating comments:

<!--

comment(s) here

Example:

<!--

This comment will span five lines
here is the second line of the comment
here is the third line of the comment
this comment will not be seen on a webpage,
but only within the source code of a webpage.

-->
The beginning of an HTML document
An HTML document begins with the <html> tag.

The head section of an HTML document
The head section of an HTML document contains important information about a webpage such as the pages title and meta tags. The head section of an HTML document begins with the <head> tag and ends with the </head> tag.

Example:

<head>
<title>Page 1</title>
</head>
In the above example, we introduce the <title> tag. This tag declares the title for a webpage. In this example, the title is set to Page 1. The title of a webpage can be seen in the top left corner of the web browser. If you look at the top left corner of your web browser window right now, you will see the title HTML basics, as that is the title of this page.

The body section of an HTML document
The body section of an HTML document is where all the content is placed that will actually be seen on a webpage. The body section of an HTML document begins with the <body> tag and ends with the </body> tag.

Example:

<body>
<h1>Here is some text in a big heading size</h1>
<br />
Here is an image of a swan:
<br /><br />
<img src="swan.jpg">
</body>
The above example will create a webpage which contains two lines of text and an image. The first line of text will be in a big heading size followed by a line break. The second line of text will be in a regular text size followed by two line breaks. An image will be displayed under the second line of text.

The end of an HTML document
An HTML document ends with the </html> tag.

A complete HTML document
An example of a complete HTML document:

<html>
<head>
<title>An HTML document</title>
</head>
<body>
<--
The text below
will appear on a webpage
-->
This is an HTML document
</body>
</html>
The title of the document created by this code will be An HTML document. The text This is an HTML document will be printed to the screen.

_________________

MOD COLOUR | The coder "want codes just ask" | No Request By PM also go to kreativeflow.net (best gfx forum ever btw from now on this si where afil of the month goes)
avatar
Tommo
Administrator
Administrator

Warning Level : Warning Level
Male Number of posts : 139
Age : 26
Country :
Registration date : 2009-03-08
Krazy Points : 6829
Reputation : -1

View user profile

Back to top Go down

Re: the tempory basic guide to HTML

Post by Skilled-Programmer on Mon Mar 23, 2009 12:24 pm

Nice Very Happy

_________________

Rules | FAQ | Search | "Want Codes Just Ask" | No Requests By PM
avatar
Skilled-Programmer
Administrator
Administrator

Warning Level : Warning Level
Male Number of posts : 287
Age : 21
Location : Arizona, USA
Country :
Registration date : 2009-02-12
Krazy Points : 2147489914
Reputation : -1

View user profile http://krazy-programming.darkbb.com

Back to top Go down

Re: the tempory basic guide to HTML

Post by Guest on Sun Apr 19, 2009 10:54 am

very nice tommo 9/10

Guest
Guest


Back to top Go down

Re: the tempory basic guide to HTML

Post by Sponsored content


Sponsored content


Back to top Go down

View previous topic View next topic Back to top

- Similar topics

 :: Tutorials :: Tutorials

 
Permissions in this forum:
You cannot reply to topics in this forum