Syeda Maira Saad's blog

[1] HTML for Beginners

Photo by Sigmund on Unsplash

[1] HTML for Beginners

DOCTYPE , HTML tag and Head tag in HTML

Syeda Maira Saad's photo
Syeda Maira Saad
·

3 min read

Table of contents

HTML is a building block of web development. It provides structure to your website. To be a web developer it is necessary to learn HTML . As a beginner developer I recommend you to learn HTML 50% and than go forward with CSS and javascript. Learning HTML 50% involve some basic and necessary elements that a website needs.

  1. Doctype
  2. Html tag
  3. Head tag
  4. Body tag
  5. Heading tags
  6. Paragraph tag
  7. Image tag
  8. Div tag
  9. Span tag
  10. Button tag
  11. Table

In todays article I will discuss DOCTYPE , HTML and HEAD

DOCTYPE

HTML document type decalartion represented as DOCTYPE. It is the first line of HTML. It provide instruction to web browser about the version of HTML the page is written in. It helps the browser to load and handle your webpage.

<!DOCTYPE html>

Tricks : If yor are using visual code you can use Shift+1 and enter for auto populate Doctype.

HTML

HTML tag is the container of all other HTML elements. It is basically the root element of your HTML page. 

<!DOCTYPE html>
<html>

</html>

HEAD

The head element comes under html tag before body tag. It is used to define meta-data of your page. This meta data does not displayed on user web body. It define title , style, script and other meta informations. 

<!DOCTYPE html>
<html>
    <head>
    </head>
</html>

Following elements go inside head element.

  1. Title
  2. Base
  3. Meta
  4. Script
  5. Noscript
  6. Link
  7. Style

Title

Title element define title of web page. 

<!DOCTYPE html>
<html>
    <head>
          <title>My First. Page</title>
    </head>
</html>

Base

Base element is used to define base URL of your website , it specifies the target for all relative URLs in a website. The base tag must have href and/or target attribute. There could be only one base element In a document. 

<!DOCTYPE html>
<html>
    <head>
          <title>My First. Page</title>
         <base href="https://mairasaad.hashnode.dev" target="_blank" >
    </head>
</html>

Meta

tag is used to define metadata about an HTML document. Metadata is data/information about data.

Metadata is used to define charset , keywords of your website, description author, refresh your page after given time interval, setting the view port to make your website look good on all devices.

Script

Script tag is used to embed executable code example javascript.

<!DOCTYPE html>
<html>
    <head>
          <title>My First. Page</title>
          <script type = "text/JavaScript" src="myJS. js" >
         </script>
    </head>
</html>

There is no restriction of using script tag in head or some where in body. You can also directly write your executable inside script tag.

NoScript

The noscript tag is used to display an alternative content when user disable script or using browser with no support of script

<!DOCTYPE html>
<html>
    <head>
          <title>My First. Page</title>
          <noscript> your browser doesnot support javascript
         </noscript>
    </head>
</html>
#html #beginner