HTML5 Syntax

Introduction to HTML5 Syntax

  • HTML5 provides a “custom” HTML syntax which is compatible with the HTML4 and XHTML1 documents published on the web but not compatible with SGML features of HTML4.
  • HTML5 does not have the same syntax rules as XHTML where we need the lower case tag names, quoting attributes, an attribute which has a value and close all the empty elements.
  • HTML5 comes with a lot of flexibility and supports, such as :
    • 1. Uppercase tag names are allowed.
    2. Quotes are optional for attributes.
    3. The attribute values are optional.
    4. Closing the empty elements is optional.

HTML5 Structure

The DOCTYPE
The DOCTYPE used in the older version of HTML were longer as the HTML language was SGML based and therefore they required a reference to a DTD. In the newer versions of HTML 5, it is simple.

Syntax:
<!DOCTYPE html>
The syntax is case-insensitive.

Character Encoding
A simple syntax can be used as follows for character encoding:
<meta charset = “UTF-8”>
The syntax is case-insensitive.

The <script> tag
One of the most common practices that was followed while writing an HTML code was that of adding a type attribute with a value of “text/javascript” to the script element as follows:

<script type= “type/javascript” src=“scriptfile.js”></script>

The extra information is eliminated in HTML5 and the syntax can be as follows:
<script src=“scriptfile.js”></script>

The <link> tag
The syntax used for link so far was as follows:

<link rel =“stylesheet” type=“text/css” href=“stylefile.css”>

The extra information is eliminated in HTML5 and the syntax can be as follows:
<link rel =“stylesheet” href=“stylefile.css”>

HTML5 Elements

  • The HTML5 elements are marked up by using the start and end tags.
  • These tags are deliminated by using the angle brackets with the tag name in between.
  • The only difference is that the end tag has a slash (/) before the tag name.
    • Example:
    <b>........</b>
  • The tags in HTML5 are case insensitive and can be written in uppercase or lowercase or mixed. However, the most common way of writing is the lowercase.
  • Most of the elements contain content but there are some elements like br, hr, link and meta which are forbidden from having any content.

HTML5 Attributes

  • Elements contain attributes which are used for setting various properties of an element.
  • Attributes can be defined globally that can be used by any element or they can be defined for specific element only.

    • Example:
    Illustrating how to markup a div element with an attribute
    <div class = “student”> ….......</div>

  • Attributes are specified only in the starting tags and not in the ending tags.
▲