HTML tutorials

Introduction of HTML


                  HTML stands for HyperText Markup Language. It is used to design web pages using a markup language. HTML is a combination of Hypertext and Markup language. Hypertext defines the link between web pages. A markup language is used to define the text document within the tag which defines the structure of web pages. This language is used to annotate (make notes for the computer) text so that a machine can understand it and manipulate text accordingly. Most markup languages (e.g. HTML) are human-readable. The language uses tags to define what manipulation has to be done on the text. 

    


HTML is a markup language used by the browser to manipulate text, images, and other content, in order to display it in the required format. HTML was created by Tim Berners-Lee in 1991. The first-ever version of HTML was HTML 1.0, but the first standard version was HTML 2.0, published in 1995. 


What is HTML

    HTML stands for Hyper Text Markup Language.

 HTML is the standard markup language for creating Web pages.
 HTML describes the structure of a Web page.
 HTML consists of a series of elements.
 HTML elements tell the browser how to display the content.
       
πŸ‘

Basic HTML tags:

                  <!DOCTYPE>: It defines the document type or it instruct the browser about the version of HTML.
<html > :This tag informs the browser that it is an HTML document. Text between html tag describes the web document. It is a container for all other elements of HTML except <!DOCTYPE><head>: It should be the first element inside the <html> element, which contains the metadata(information about the document). It must be closed before the body tag opens.

πŸ’§<title>: As its name suggested, it is used to add title of that HTML page which appears at the top of the browser window. It must be placed inside the head tag and should close immediately. (Optional)

πŸ’§<body> : Text between body tag describes the body content of the page that is visible to the end user. This tag contains the main content of the HTML document
<h1> : Text between <h1> tag describes the first level heading of the webpage.

πŸ’§<p> : Text between <p> tag describes the paragraph of the webpage.


¹

HTML Tags – A to Z List

To start learning HTML you need to start with HTML tags, there are various tags that we must consider and know about while starting to code in HTML.

HTML Tags: HTML tags are the keywords that are used to produce web pages in various formats. Opening tags and closing tags are found in the majority of tags. The concluding tags contain a forward slash (/), while the language of the beginning tags is the same. Certain tags don’t need to be closed



A to Z HTML Tags: The complete list of HTML tags is given below

Unclosed HTML Tags

Some HTML tags are not closed, for example br and hr.

<br> Tag: br stands for break line, it breaks the line of the code.

<hr> Tag: hr stands for Horizontal Rule. This tag is used to put a line across the webpage.


HTML Meta Tags

DOCTYPE, title, link, meta and style


HTML Text Tags

<p>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <strong>, <em>, <abbr>, <acronym>, <address>, <bdo>, <blockquote>, <cite>, <q>, <code>, <ins>, <del>, <dfn>, <kbd>, <pre>, <samp>, <var> and <br>


HTML Link Tags

<a> and <base>


HTML Image and Object Tags

<img>, <area>, <map>, <param> and <object>


HTML List Tags

<ul>, <ol>, <li>, <dl>, <dt> and <dd>


HTML Table Tags

table, tr, td, th, tbody, thead, tfoot, col, colgroup and caption


HTML Form Tags

form, input, textarea, select, option, optgroup, button, label, fieldset and legend

        

1.first paragraph 


<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>

Output:

                  

My First Heading

My first paragraph.

2.Heading

<!DOCTYPE html>
<html>
<body>

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

</body>
</html>

Output

Heading 1

  Heading 2

       Heading 3

            Heading 4

               Heading 5 

                   Heading 6

3. Heading


<!DOCTYPE html>
<html>
<head>
  <title>My First HTML</title>
  <meta charset="UTF-8">
</head>
<body>

<p>The HTML head element contains meta data.</p>
<p>Meta data is data about the HTML document.</p>

</body>
</html>

Output:

      The HTML head element contains meta data.

Meta data is data about the HTML document.


HTML  advantages:        

  HTML is Browser friendly: HTML upholds a heap of programs like Google Chrome, Mozilla Firefox, Opera, and so on This makes HTML very program amicable because of its quality among the top current programs.


  ❤Allowed to utilize: Since HTML is open-source, it’s allowed to utilize. It’s an incredible benefit for organizations and people the same as there is no compelling reason to buy the additional products for composing HTML code as it were.

❤Simple to learn: HTML is the fundamental reinforcement of web advancement. It is so natural to discover that school understudies can likewise utilize HTML to make their own fundamental site with pictures and tones.

  ❤Basic design: HTML is a basic language and has a proper construction with predefined labels and traits. Along these lines, in the event that you practice routinely, you’ll become accustomed to the straightforward HTML structure and will actually want to compose HTML code without any problem.
Lightweight and quick: HTML is a lightweight markup language. It saves time for the clients by decreasing stacking time.

  ❤Utilization of formats: HTML permits the utilization of formats for developers. In this way, it makes the errand of the web engineers significantly simpler by diminishing the time taken to compose the plan codes.

  ❤Information stockpiling: HTML upholds Data Storage. HTML web stockpiling gives two items to put away information. They are as per the following: window.sessionStorage – This stores the information for one meeting. window.localStorage – This stores the information with no termination date

Disadvantages:

    ❤Static language: HTML is a static language. This implies that the HTML website pages will continue as before until somebody transforms them physically. Likewise, it doesn’t uphold dynamic results.

      ❤Invests in some opportunity to design: For engineers, now is the ideal time consuming to keep up with the shading plan of pages and configuration tables, records, and structures utilizing HTML as it were.

    ❤Restricted security: Security is the need for everybody. Yet, on account of HTML, there’s one significant downside ie. it offers restricted security highlights.

  ❤Extensive code: In any event, for basic website pages, a great deal of code should be composed. Likewise, extensive code produces intricacy for the improvement group. To beat this issue, we can involve layouts for fundamental pages.

    ❤ Reliance issue: The developer isn’t the creator of HTML. Along these lines, there exists a reliance on the creator of the language, for this situation, it is HTML. In this way, they need to change and adhere to the language structure and labels, in any event, when they try to avoid that specific show of composing.
T

Application of HTML :  

Web Pages Development

      πŸ‘‰Different websites we see on the internet regularly are in some form written in HTML code. As mentioned earlier HTML is used to structure the web page in various ways. We could include different sections, insert tables, and split the web page. With the introduction of Semantic HTML elements in HTML5, HTML has made hassle free even for the developer to understand and modify his/her code better

Apart from the elements, we can style different types of web pages like the landing page, parallax pages, grid orientation pages, etc. Styling and manipulation of HTML elements are comparatively easier and more effective with CSS and JavaScript.   

Navigating the Internet

         πŸ‘‰HTML is an essential element in navigating between web pages. Navigation is possible using the hypertext concept. The linking is also simpler. From the internet user’s point of view, they click on a text which takes them to the next page. HTML facilitates navigation by hyperlinking with the help of an anchor tag.
                 Navigation can increase visitors to a website. It increases user activity on the website. It also helps the web user to look at the content structure and organization.
   

Data Entry Support


         πŸ‘‰ With many other features that we have been discussing, here’s another important one to be taken into account which is data entry. For so long we have stored data in dedicated files for this purpose. HTML5 paves way for data entry online, that is to obtain the data to store, from the user via forms. In this case, we have HTML tags like <form>. 

Other elements include input which may be a drop-down box, list, text box, password box, etc. On the whole, HTML makes the process of data entry easy and effective which also includes validations with the help of Javascript.

  

Features of HTML:

     πŸ‘‰ The learning curve is very easy (easy to modify)
     πŸ‘‰Creating effective presentations
Adding Links wherein we can add references 
     πŸ‘‰ Can display documents on platforms like Mac, Windows, Linux, etc
      πŸ‘‰Adding videos, graphics, and audios making it more attractive
      πŸ‘‰Case insensitive language

HTML editors 

 Simple editor: Notepad
Notepad++
Atom
Best editor: Sublime Text

Comments

Post a Comment

Popular posts from this blog

Square value added

Date of birth calculator