HTML5 is the fifth major version of HyperText Markup Language (HTML), the standard markup language used to structure and present content on the web. HTML5 was finalized by the World Wide Web Consortium (W3C) in October 2014, though its features were implemented by browsers progressively during the preceding years. HTML5 represents a major evolution from HTML4, introducing semantic elements, native multimedia support, new form input types, powerful JavaScript APIs, and improved support for mobile and offline web applications.
Prior to HTML5, web developers relied heavily on third-party plugins โ primarily Adobe Flash โ for video playback, audio, interactive graphics, and rich web applications. HTML5 built these capabilities directly into the browser, making it possible to deliver multimedia experiences, interactive graphics (via Canvas and SVG), and complex web applications without plugins. This shift was enormously consequential: Flash was officially discontinued in 2020, and HTML5-based approaches now handle all web multimedia and interactivity that Flash once provided.
HTML5 is not a single technology but a suite of related technologies including HTML markup, CSS3, and JavaScript APIs that together define the modern web platform. When developers say 'HTML5,' they often mean this full suite of capabilities โ semantic HTML elements, CSS transitions and animations, the Canvas and WebGL graphics APIs, the Geolocation API, Web Storage, WebSockets, and more. All major browsers (Chrome, Firefox, Safari, Edge) support HTML5 fully, and mobile browsers on iOS and Android provide equally robust support.
One of HTML5's most important contributions is its set of semantic structural elements โ elements that describe the meaning and role of content, not just its visual appearance. Before HTML5, developers relied heavily on generic <div> and <span> elements for layout. HTML5 introduced named structural elements that convey meaning to browsers, search engines, screen readers, and other tools, improving accessibility and SEO.
<nav> โ use it for major navigation blocks only.<main> element. Content that appears across pages (headers, footers, sidebars) should not be inside <main>.<article> should make sense on its own, removed from the rest of the page.<section> when the content is thematically related but not independently meaningful enough to warrant <article>.<aside> should be related to the surrounding content but not essential to understanding it.HTML5 also refined and added text-level semantic elements: <time> marks up dates and times in machine-readable format; <mark> highlights text for reference; <figure> and <figcaption> associate captions with images, diagrams, and code samples; <details> and <summary> create a native expand/collapse disclosure widget without JavaScript; and <dialog> represents a dialog or popup box.
HTML5 significantly expanded the capabilities of web forms by introducing new input types, form validation attributes, and data list elements. These features reduce the need for JavaScript-based form validation and provide better mobile keyboard experiences when input types match the expected data.
HTML5 added more than a dozen new <input type> values beyond the original text, password, checkbox, radio, submit, and file types:
HTML5 introduced built-in form validation through attributes that eliminate the need for JavaScript validation of common cases: required prevents form submission when the field is empty; pattern validates input against a regular expression; min and max constrain numeric and date inputs; minlength and maxlength constrain text length; and multiple allows multiple values in file and email inputs. The novalidate attribute on a <form> element disables built-in validation for forms that implement custom JavaScript validation.
The <datalist> element provides autocomplete suggestions for an <input> field without restricting the user to the suggested values. This is different from <select> (which requires the user to choose from a fixed list) โ <datalist> displays suggestions while allowing free-text input. It is connected to an input via the input's list attribute matching the datalist's id.
HTML5's most visible consumer-facing change was bringing native audio, video, and interactive graphics directly into browsers without plugins. These capabilities transformed web content delivery and made mobile-friendly, cross-platform multimedia the default.
The <video> element embeds video content directly in HTML with native browser controls. The element supports multiple source formats via nested <source> elements โ the browser selects the first format it supports. Key attributes include controls (display browser controls), autoplay (start playing immediately, usually muted), muted (required for autoplay in most browsers), loop (replay automatically), poster (image displayed before playback), and preload (hint to the browser about preloading). Video formats: MP4 (H.264) has universal support; WebM offers better compression; HLS and DASH are used for adaptive streaming.
The <audio> element embeds audio content similarly. It supports the same source-multiple-format pattern as video. Common formats: MP3 for broad compatibility, AAC for better quality at lower bitrates, OGG for open-source deployments. The Web Audio API (a JavaScript API) extends beyond simple audio playback to enable audio processing, synthesis, and spatial audio for games and music applications.
The <canvas> element provides a scriptable bitmap drawing surface that JavaScript renders to via the Canvas 2D API or WebGL. Canvas 2D supports drawing shapes, paths, text, images, and pixel manipulation โ commonly used for data visualizations, games, image editing tools, and dynamic graphics. WebGL (Web Graphics Library) exposes hardware-accelerated 3D graphics through the canvas element, enabling complex 3D rendering directly in the browser without plugins. WebGPU, the next-generation graphics API, is now being standardized for higher-performance GPU access.
Beyond markup elements, HTML5 encompasses a suite of JavaScript APIs that give web applications access to device features and client-side storage previously only available to native applications.
The Web Storage API provides client-side key-value storage with two mechanisms: localStorage persists data indefinitely (until explicitly cleared or the user clears browser data); sessionStorage persists data only for the duration of the browser tab session. Both provide a simple API: setItem(key, value), getItem(key), removeItem(key), and clear(). Web Storage replaced cookies for many client-side storage needs โ it stores up to 5โ10 MB per origin (vs. 4KB for cookies), does not send data to the server with every request, and has a simpler API.
The Geolocation API allows web applications to request the user's physical location (with explicit user permission). navigator.geolocation.getCurrentPosition() returns latitude, longitude, accuracy, and optionally altitude and heading. The watchPosition() method provides continuous location updates for tracking applications. Geolocation requires HTTPS in modern browsers and user permission prompts on every origin. Location data is used for maps, local search, weather, navigation, and proximity-based services.
Service Workers are JavaScript scripts that run in the background, separate from the main browser thread, acting as a proxy between web applications, the browser, and the network. Service Workers enable offline functionality (by intercepting network requests and serving cached responses), background sync, and push notifications. Web applications that use Service Workers, a web manifest, and HTTPS qualify as Progressive Web Apps (PWAs) โ they can be installed on mobile and desktop, launch from the home screen, work offline, and receive push notifications like native apps.
The WebSocket API provides full-duplex communication channels over a single TCP connection, enabling real-time bidirectional communication between browsers and servers. Unlike HTTP (which is request-response only), WebSockets allow the server to push data to clients at any time. WebSockets power real-time features including live chat, collaborative editing, live sports scores, financial data feeds, and multiplayer games.