Saturday, 25 March 2017

HTML Concepts

Page Number : 1 2 3 4 5 7 8 9 10 11 12 13 Menu                                          CSS Tutorial

This blog is basically for the concepts of HTML. If anybody wants to learn this HyperTextMarkup Language from the scratch, please follow my all links.



HTML stands for Hypertext Markup Language, and it is the most widely used language to write Web Pages. As its name suggests, HTML is a markup language.


  • Hypertext (Text over text) refers to the way in which Web pages (HTML documents) are linked together. When you click a link in a Web page, you are using hypertext.
  • Markup Language describes how HTML works. With a markup language, you simply "mark up" a text document with tags that tell a Web browser how to structure it to display.


Actually, HTML was developed with the intention  of defining the structure of documents like headings, paragraphs, lists, and so forth to facilitate the sharing of scientific information between researchers. So the HTML is  made up of 4 different words and if we elaborate them :-

Hyper is the opposite of linear as we know the computer programs had to move in a linear or sequential fashion. But HTML does not hold to that pattern and allows the person to view the World Wide Web page to go anywhere, anytime they want.
Text is what we use to explain any concept like Real and honest English letters.
Mark up is what we will do. As we will write in plain English and then mark up what you wrote.
Language is a communication mode which can easily communicate what we want to do and Hypertext Markup Louie didn't flow correctly. Because it's a language, not really a computer language -- but the language is plain English.


HTML TAGS
HTML markup language means that there is a mark for starting the text and end the text like when we want to highlight some text, we put it in double quotes "" but in HTML we markup our text in the tags which are usually called HTML tags. They are usually of two types :- Empty and Container tags. All the container tags have the following properties :-
  • HTML tags are keywords (tag names) surrounded by angle brackets like <html>
  • HTML tags normally come in pairs like <b> and </b>
  • The first tag in a pair is the start tag, the second tag is the end tag
  • The end tag is written like the start tag, with a forward slash before the tag name
  • Start and end tags are also called opening tags and closing tags
      For Example :- <tagname>content</tagname>
                               <b> Welcome to the World of Web</b>

But HTML also have some empty tags ( or self closing tags) which have only the opening tag not the closing tag.

Creation of HTML Documnet in Notepad :-  As we have a lots of tools for the coding of HTML like Dreamweaer etc. But if we want to do all the formatting and coding ourself, we have to code it in a notpad document and then publish it. so for this we have to do as follows :-
To begin coding HTML in notepad you need only two things: a simple-text editor and a web browser. Notepad is the most basic of simple-text editors and you will probably code a fair amount of HTML with it. Here are the simple steps to create a basic HTML document:


  • Open Notepad or another text  editor.
  • At the top of the page type <html>.
  • On the next line, indent five spaces and now add the opening header tag: <head>.
  • On the next line, indent ten spaces and type <title> </title>.
  • Go to the next line, indent five spaces from the margin and insert the closing header tag: </head> 
  •  Five spaces in from the margin on the next line, type<body>.
  • Now drop down another line and type the closing tag right below its mate: </body>.
  • Finally, go to the next line and type </html>.
  • In the File menu, choose Save As.
  • In the Save as Type option box, choose All Files.
  • Name the file template.htm.
  • Click Save. Basic structure of HTML document is :-
      <html>
           <head>
                <title>

               </title>
          </head>
         <body>


        </body>
    </html>
But now our browsers are very intelligent so we can eliminate the format.


HTML is Forgiving?


A very good quality associated with all the browsers is that they would not give any error if you have not put any HTML tag or attribute properly. They will just ignore that tag or attribute and will apply only correct tags and attributes before displaying the result.


We can not say, HTML is forgiving because this is just a markup language and required to format documents. If there is an mistake it shows it on your page only.



HTML Basic Tags


The basic structure for all HTML documents is simple and should include the following minimum elements or tags:

  • <html>- The main container for HTML pages
  • <head>- The container for page header information
  • <title>- The title of the page
  •  <body>- The main body of the page


The <html> Element:


The <html> element is the containing element for the whole HTML document. Each HTML document should have one <html> and each document should end with a closing </html> tag.


Following two elements appear as direct children of an <html> element:

              <head>
              <body>



The <head> Element:  is container for all other header elements. It should be the first thing to appear after the opening <html> tag.Each <head> element should contain a <title> element indicating the title of the document, although it may also contain any combination of the following elements, in any order:

  • The <base> tag is used to areate a "base" url for all links on the page. The <object> tag is designed to include images, JavaScript objects, Flash animations, MP3 files, QuickTime movies and other components of a page.
  • The <link> tag is used to link to an external file, such as a style sheet or JavaScript file.
  • The <style> tag is used to include CSS rules inside the document.
  • The <script> tag is used to include JAVAScript or VBScript inside the document.
  • The <meta> tag includes information about the document such as keywords and a description, which are particularly helpful for search applications.

Example: Following is the example of head tag.

<head>

<title>HTML Basic tags</title>

<meta name="Keywords" content="HTML, Web Pages" /> <meta name="description" content="HTML Basic Tags" /> <base href="http://www.google.com" />
<link rel="stylesheet" type="text/css" href="tp.css" />
<script type="text/javascript">
</script>
</head>

The <title> Element:


You should specify a title for every page that you write inside the <title> element. This element is a child of the <head> element). It is used in several ways:
  • It displays at the very top of a browser window.
  • It is used as the default name for a bookmark in browsers such as IE and Netscape.
  • It is used by search engines that use its content to help index pages.

Therefore it is important to use a title that really describes the content of your site. The <title> element should contain only the text for the title and it may not contain any other elements.


Example:


Here is the example of using title tag.
<head> <title>HTML Basic tags</title> </head>

The <body> Element:


The <body> element appears after the <head> element and contains the part of the Web page that you actually see in the main browser window, which is sometimes referred to as body content.


A <body> element may contain anything from a couple of paragraphs under a heading to more complicated layouts containing forms and tables.


Example:


Here is the example of using body tag.

<body>

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












Page Number : 1 2 3 4 5 6 7 8 9 10 11 12 13 Menu                                         CSS Tutorial



1 comment: