{"id":1570,"date":"2016-06-25T04:52:16","date_gmt":"2016-06-25T04:52:16","guid":{"rendered":"http:\/\/www.capitalnumbers.com\/blog\/?p=1570"},"modified":"2026-05-12T07:04:18","modified_gmt":"2026-05-12T07:04:18","slug":"whats-new-in-html5-1","status":"publish","type":"post","link":"https:\/\/www.capitalnumbers.com\/blog\/whats-new-in-html5-1\/","title":{"rendered":"What\u2019s new in HTML5.1?"},"content":{"rendered":"<p><!--<img class=\"aligncenter size-full wp-image-1576\" src=\"http:\/\/www.capitalnumbers.com\/blog\/wp-content\/uploads\/2016\/06\/CN_Blog_HTML5_25-06-16.jpg\" alt=\"CN_Blog_HTML5_25-06-16\" width=\"1000\" height=\"600\" srcset=\"https:\/\/www.capitalnumbers.com\/blog\/wp-content\/uploads\/2016\/06\/CN_Blog_HTML5_25-06-16.jpg 1000w, https:\/\/www.capitalnumbers.com\/blog\/wp-content\/uploads\/2016\/06\/CN_Blog_HTML5_25-06-16-300x180.jpg 300w, https:\/\/www.capitalnumbers.com\/blog\/wp-content\/uploads\/2016\/06\/CN_Blog_HTML5_25-06-16-768x461.jpg 768w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/>--><\/p>\n<p><span style=\"font-weight: 400;\">HTML5 buttresses interactive and responsive technologies that would have been very difficult to achieve when using either XHTML or earlier versions of HTML. With HTML5 specifications now considered \u201cfeature-complete,\u201d the World Wide Web Consortium (W3C)\u2014a body that standardized HTML5 and previous versions of HTML\u2014has been pondering additions of new features to make the development of web applications even better.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">The web development industry is evolving very fast. Really fast! Therefore, a new version of HTML5\u2014commonly known as HTML5.1\u2014has been proposed to make the development of responsive and interactive websites faster. The development of HTML5.1 heralds the emergence of new frontiers for web developers to improve on video captioning, better forms, and spell checking. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">It\u2019s essential to note that HTML5.1 development is still work-in-progress and therefore, the standard is yet to be officialized. Having said that, let\u2019s dive in and explore some of the new features in HTML5.1<\/span><\/p>\n<h6><b>New features introduced in HTML5.1<\/b><\/h6>\n<p><span style=\"font-weight: 400;\">Here are the new features that have been introduced in HTML5.1:<\/span><\/p>\n<h6><span style=\"color: #003366;\"><b>#1: Improved video experience<\/b><\/span><\/h6>\n<p><span style=\"font-weight: 400;\">The &lt;video&gt; element has been enhanced to capture all the required video and audio-related data. The src, preload, mediagroup, autoplay, loop and controls attributes have been incorporated in the element to capture all the characteristics of the video file being played on a browser. However, a new attribute: the \u201cposter\u201d has been added to HTML5.1. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">The primary function of the poster attribute will be to provide the address of the image file which the user agent can show if no video data is displayed. If the attribute is available, then it must contain a valid non-empty URL which gives the address of the image file for the video file. Also, the video element in HTML5.1 can represent the text track cues where the text track cue can be set active while the track is being played. <\/span><\/p>\n<div id=\"om-b7tfondceubrbvku-holder\"><\/div>\n<p><script>\/\/ <![CDATA[\nvar b7tfondceubrbvku,b7tfondceubrbvku_poll=function(){var r=0;return function(n,l){clearInterval(r),r=setInterval(n,l)}}();!function(e,t,n){if(e.getElementById(n)){b7tfondceubrbvku_poll(function(){if(window['om_loaded']){if(!b7tfondceubrbvku){b7tfondceubrbvku=new OptinMonsterApp();return b7tfondceubrbvku.init({u:\"18402.328170\",staging:0,dev:0,beta:0});}}},25);return;}var d=false,o=e.createElement(t);o.id=n,o.src=\"\/\/a.optnmnstr.com\/app\/js\/api.min.js\",o.onload=o.onreadystatechange=function(){if(!d){if(!this.readyState||this.readyState===\"loaded\"||this.readyState===\"complete\"){try{d=om_loaded=true;b7tfondceubrbvku=new OptinMonsterApp();b7tfondceubrbvku.init({u:\"18402.328170\",staging:0,dev:0,beta:0});o.onload=o.onreadystatechange=null;}catch(t){}}}};(document.getElementsByTagName(\"head\")[0]||document.documentElement).appendChild(o)}(document,\"script\",\"omapi-script\");\/\/ ]]><\/script><!-- \/ OptinMonster --><\/p>\n<h6><span style=\"color: #003366;\"><b>#2: Improved capabilities of web forms<\/b><\/span><\/h6>\n<p><span style=\"font-weight: 400;\">One thing\u2019s for sure with the coming up of HTML5.1\u2014improved capabilities and user experiences when working with web forms. New and fancier form attributes have been introduced in HTML5.1. Some of these attributes include:<\/span><\/p>\n<ul>\n<li>URL. It specifies a URL input.<\/li>\n<li>Tel. It specifies the telephone number input type.<\/li>\n<li>Search. It specifies the search box on a web page.<\/li>\n<li>Disabled. When used on a form, the content is grayed out and the browser prevents web users from focusing on the disabled form control.<\/li>\n<li>Multiple. This attribute has been included to allow multiple controls such as email and file be used concurrently on a form.<\/li>\n<\/ul>\n<h6><span style=\"color: #003366;\"><b>#3: Spell checking<\/b><\/span><\/h6>\n<p><span style=\"font-weight: 400;\">If you want a language specification that has improved capabilities for spelling and grammatical mistakes checking, then HTML5.1 is one of them. The spellcheck attribute has been enhanced in HTML5.1 to specify whether the HTML element should be checked for spelling and grammatical mistakes or not. <\/span><\/p>\n<h6><span style=\"color: #003366;\"><b>#4: Improved image accessibility features<\/b><\/span><\/h6>\n<p><span style=\"font-weight: 400;\">With HTML5.1, you\u2019ll no longer need CSS or even JavaScript code to handle images in responsive websites. As a result of this feature, you\u2019ll benefit from the natively-optimized image loading if the internet bandwidth is low. HTML5.1 has introduced the following concerning image accessibility:<\/span><\/p>\n<ul>\n<li>Art direction-based selection. This feature allows you to specify how you\u2019d like your image to be viewed. You can load an image that\u2019s optimized for specified screen dimensions in HTML5.1.<\/li>\n<li>Device-pixel-ratio-based selection. The device-pixel-ratio based selection will allow you to specify whether you want to view the image on a high DPI display or not.<\/li>\n<li>Image format-based selection. If the browser can\u2019t support additional image file types that, then the image format-based selection will provide better and improved performances for smaller file sizes.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>HTML5 buttresses interactive and responsive technologies that would have been very difficult to achieve when using either XHTML or earlier versions of HTML. With HTML5 specifications now considered \u201cfeature-complete,\u201d the World Wide Web Consortium (W3C)\u2014a body that standardized HTML5 and previous versions of HTML\u2014has been pondering additions of new features to make the development of &#8230;<\/p>\n","protected":false},"author":12,"featured_media":1576,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false},"categories":[723,743],"tags":[1055],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.capitalnumbers.com\/blog\/wp-json\/wp\/v2\/posts\/1570"}],"collection":[{"href":"https:\/\/www.capitalnumbers.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.capitalnumbers.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.capitalnumbers.com\/blog\/wp-json\/wp\/v2\/users\/12"}],"replies":[{"embeddable":true,"href":"https:\/\/www.capitalnumbers.com\/blog\/wp-json\/wp\/v2\/comments?post=1570"}],"version-history":[{"count":4,"href":"https:\/\/www.capitalnumbers.com\/blog\/wp-json\/wp\/v2\/posts\/1570\/revisions"}],"predecessor-version":[{"id":16305,"href":"https:\/\/www.capitalnumbers.com\/blog\/wp-json\/wp\/v2\/posts\/1570\/revisions\/16305"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.capitalnumbers.com\/blog\/wp-json\/wp\/v2\/media\/1576"}],"wp:attachment":[{"href":"https:\/\/www.capitalnumbers.com\/blog\/wp-json\/wp\/v2\/media?parent=1570"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.capitalnumbers.com\/blog\/wp-json\/wp\/v2\/categories?post=1570"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.capitalnumbers.com\/blog\/wp-json\/wp\/v2\/tags?post=1570"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}