Updated date:

What Is HTML5?

Joshua is a graduate student at the USF. He has interests in business technology, analytics, finance, and lean six sigma.

HTML5 is the most current version of the HTML standard used today.

HTML5 is the most current version of the HTML standard used today.

HTML5: The Most Recent Version of HTML

The term HTML5 stands for "hyper text markup language version 5" and is the most recent specification of the HTML language. This fifth version of HTML has become known to be a significant break from the markup practices used in older versions. Changes that were made to the language were created to standardize its use with respect to developers since they were finding many new uses for the language. This newest version is the current best practices of web development.

Changes Implemented for HTML5

Most changes made to the HTML practices for HTML5 are primarily due to the new objectives for the language that were planned over a period of years. The objectives include:

  • Decreasing JavaScript, CSS, and HTML overlap
  • Creating a barrier between design and content
  • Encouraging semantic markup
  • The Elimination of Plugins with the support of Rich media experiences
  • Instigating design and accessibility responsiveness

Leaning HTML5 can often be described as figuring out which CSS features replace HTML features. This is a misconception because to truly learn HTML5, you must understand how these new objectives affected the development of the language.

The version history of HTML.

The version history of HTML.

Decreasing the JavaScript, CSS, and HTML Overlap

There are three languages that define front-end website development. These languages are JavaScript, CSS, and HTML. Each of these languages has evolved over time to create their advanced useful forms. Their evolutions did not occur separately. These evaluations occurred in parallel to each other and have caused an overlap of scope and functionality.

While functionality may overlap, each of these languages does gravitate toward its own purpose. Each is described below:

  • JavaScript → Interactivity
  • CSS → Design
  • HTML → Content

There has been a focus on either limiting or expanding on specific purposes of each of these languages. Understanding what these specific languages are meant to do can help to know how to use them to effectively close or the gap of language overlap. Since CSS is mainly used for design, you may think that this is the language that you would use to change color. This is true, but you may want to change color as a result of a user input with JavaScript.

CSS, HTML, and JavaScript Overlap

CSS, HTML, and JavaScript Overlap

Creating the Barrier Between Design and Content

The HTML5 specification discourages non-meaningful markup. Non-meaningful markup can be described as markup that is meant to inform the browser how to display content. Non-meaningful markup may include:

  • The declaration of text colors and fonts
  • Text alignment setting & justification
  • Table settings like borders
  • Defining text wrapping for images

Most of the features of HTML that support these functions have been depreciated completely. There are some that are still available, but these come with a warning that their use is not a recommended practice.

The separation is supported by two valid reasons:

  • The process of redesign and maintaining a site is easier when style declarations are confined strictly to CSS.
  • Users view content on laptops, desktops, RSS readers, and more. Design and style decisions may make sense in one environment but may not in another. It’s better to provide semantic information to allow content to adapt to any context.

Encouraging Semantic Markup

Semantic markup can be described as markup with meaning. For instance, the tag <h1> gives you the impression that content is a headline or title of the document. Without the use of the <h1> tag, you could just make the text large with bold. All previous versions of HTML had some form of semantic markup available. Such markup could be related to document metadata, headings tags, and the link rel attribute.

In previous versions of the language there are elements that are part of a common structure. This includes navigation menus, headers and more. These were all indicated with the <div> tag in HTML. Newer semantic elements give a page its basic structure. These basic structure elements can be seen below:

  • <header>
  • <nav>
  • <main>
  • <article>
  • <aside>
  • <section>
  • <footer>

New to the HTML world is that of text-level (inline) elements. Two text-level elements that have been introduced recently are <address> and <time>. With these elements, services and search engines can easily find this type of information on a webpage. Some of the existing text-level elements like italic, bold, and underline have been redefined to better specify a semantic meaning.

Promoting Accessibility and Design Responsiveness

People view the internet in an abundance of ways. Devices range from and are not limited to phones, tablets, and desktops. The internet is viewed on these devices in a variety of screen variations. Having these variations in screen size, resolution, and the like is enough to encourage responsive and semantic design practices.

These days, people can browse the internet even with visual impairments. Assistive technologies allow for screen reading, translation, magnification, braille interpretation, and keyboard navigation. All of these technologies allow those with disabilities to better interact with websites.

These technologies are hindered by markup language that aims to a hard-code styling and design into page content.

The Elimination of Plugins With the Support of Rich Media Experiences

Now that internet speeds are faster than ever media use on the internet has exploded. HTML was not originally designed for this type of platform. Its original purpose was to support hyper-text documents with some images with the exclusion of video and audio.

Originally, for video and audio to be experienced, users needed to add plugins to their browsers. These plugins did not perform well for users. When updates were required, content could not be viewed. There were also limited options and often security concerns. For developers, the requirement to write webpage functionally in Java and flash was not efficient.

The addition of HTML5 provides media support with the following elements:

  • <video>
  • <audio>
  • <canvas>

The advent of these elements add their own special solution. The <video> and <audio> elements specifically get us away from using plugins while the <canvas> elements allow for JavaScript-created graphics and drawings. A combination of HTML, CSS, and JavaScript together have added to the success of eliminating plugins while creating full-scale web applications.

HTML5 Will Remain the Standard for the Foreseeable Future

Until new challenges are faced in webpage building or improvements are needed to support technology advancements, HTML5 remains the HTML living standard to follow for webpage development.

This content is accurate and true to the best of the author’s knowledge and is not meant to substitute for formal and individualized advice from a qualified professional.

© 2021 Joshua Crowder

Related Articles