× Introduction HTML Editors Web Components Headings Paragraph Attributes Entities Images Comments Formatting Links File Paths Book Marks Image Links Unordered Lists Ordered Lists Tables Forms Other Form Elements Semantic tags Media Div and Span Examples Projects eBooks





☰







HTML5 Introduction

In this tutorial you will learn HTML document structure.

HTML stands for HyperText Markup Language. HTML is the basic building block of World Wide Web. HTML is the standard markup language for creating Web pages.HTML describes the structure of a Web page.

HTML is the set of mark-up symbols or codes placed in a file that is intended for display on a webpage. These mark-up symbols and codes identify structural elements such as paragraphs, headings,and lists. HTML can also be used to place media (such as graphics, video, and audio) on a web pageand describe fill-in forms.

The browser interprets the mark-up code and renders the page. HTML permits the platform -independent display of information across a network. No matter what type of computer a web page was created on, any browser running on any operating system can display the page.

HyperTextMarkup Language (HTML) is a modern standard markup language that uses common abbreviations called "tags".

HTML was first devised in 1989 by British physicist Tim Berners-Lee at CERN in Switzerland (the European organization for nuclear research) to share all computer-stored information between the CERN physicists. Berners-Leecreated a text browser to transfer information over the internet using hypertext to provide point-and-click navigation. In May 1990 this system was named the World Wide Web and was enhanced in 1993 when college student Marc Andreessen added an image tag. Now that HTML could display both text and images, the World Wide Web quickly became highly popular.

Mark-up languages consist of sets of directions that tell the browser software (and other user agents such as mobile phones) how to display and manage a web document.

Each individual mark-up code is referred to as an element or tag. Each tag has a purpose. Tags are enclosed in angle brackets, the < and > symbols. Most tags come in pairs: an opening tag and a closing tag. These tags act as containers and are sometimes referred to as container tags. For example, the text that is between the < title > and </title > tags on a web page would display in the titlebar on the browser window.

Some tags are used alone and are not part of a pair. For example, a <hr> tag that displays ahorizontal line on a web page is a stand-alone or self-contained tag and does not have a closing tag.

A Simple HTML Document:   Try It

    
 <!doctype html>
 <html>
   <head>
     <meta charset="utf-8">
     <title>A Simple HTML Document </title>
   </head>
   <body>    
    <h1>Heading</h1>
   </body>
 </html>

Result:

Heading


Example Explained

  • The declaration defines that this document is an HTML5 document.
  • The <html> element is the root element of an HTML page.
  • The <head> element contains meta information about the HTML page.
  • The <title> element specifies a title for the HTML page (which is shown in the browser's title bar or in the page's tab)
  • The <body> element defines the document's body, and is a container for all the visible contents, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.
  • The <h1> element defines a large heading.
  • The <p> element defines a paragraph.
  • The <img> element defines a image.

What You Can Do with HTML

There are lot more things you can do with HTML.
  • You can publish documents online with text, images, lists, tables, etc.
  • You can access web resources such as images, videos or other HTML document via hyperlinks.
  • You can create forms to collect user inputs like name, e-mail address, comments, etc.
  • You can include images, videos, sound clips, flash movies, applications and other HTML documents directly inside an HTML document.
  • You can create offline version of your website that work without internet.
  • You can store data in the user's web browser and access later on.
  • The list does not end here, there are many other interesting things that you can do with HTML. You will learn about all of them in detail in upcoming chapters.

Elements and Tags

HTML uses predefined tags and elements which tell the browser how to properly display the content. Remember to include closing tags. If omitted, the browser applies the effect of the opening tag until the end of the page.

The HTML element is everything from the start tag to the end tag:

<tagname>Content goes here...</tagname>

Examples of some HTML elements:

<h1>My First Heading</h1>

<p>My first paragraph.</p>

HTML Tags: Tags are the starting and ending parts of an HTML element. They begin with < symbol and end with > symbol. Whatever written inside < and > are called tags.

Example: <p></p>

HTML elements: Elements enclose the contents in between the tags. It generally consists of a start tag, content and an end tag.

Example: <p>This ia a paragraph</p>

HTML Attributes: It is used to define the character of an HTML element. It always placed in the opening tag of an element. It generally provides additional styling (attribute) to the element.

Example: <p align="center">This ia a paragraph</p>

What do I need to create HTML?

You don't need any special equipment or software to create HTML. In fact, you probably already have everything you need. Here is what you need:

  • Computer: Computer is used to run your applications.
  • HTML Editor: It is an application that helps you create HTML pages. It also used to create and modify web pages. Notepad is an example for HTML editor.
  • Web Browser: A web browser is a software that runs on your personal computer and enables you to view web pages. Google chrome is an example of web browser.

Do I need Internet to create HTML pages?

No, You do not need Internet to create web pages. You can create web pages on your local machine.
You need Internet, when you want to publish your web pages to web.