It’s time to get little lifted, Now the HTML 5.1 is in market, there is gonna be updated browsers, but the good news firefox and Opera are supporting Html 5.1, Also latest updated chrome will support html 5.1.
HTML 5.1 was released on 1st nov 2016, It’s more than a week, but the developers and new product companies have started using new tags.
What’s new in html 5.1
It’s not a massive update like HTML 5 But there our few new tags which has been introduced
1. Picture tag <picture>
Picture tag is not a replacement for <img> tag, It’s usually a container with multiple <img> tag. Also along with picture tag other attribute as srcset.
Consider a Eg. If you want to add different images for different viewport, As a developer we try to do by adding background image and using media query for different viewports.
But these is not the case.
You have to do exactly like below, All these is taken care at HTML level, no css is needed
<picture> <source srcset="image1.png" media="(min-width: 1000px)"> <source srcset="image2.png" media="(min-width: 600px)"> <img src="image.png" alt="Image"> </picture>
Expected output:(Note: If you don’t see any change in below output,Please update your browsers. Best result view in updated firefox.)
So,If your browser doesn’t support HTML 5.1 it will by default load plain img src with no responsive image. In above case it will load “image.jpg”
You can find the details more details here https://www.w3.org/TR/html51/semantics-embedded-content.html#the-picture-element
2. Dialog tag <dialog>
Dialog tag is same as modal popup which we used as fancy box.
You can see the output here
3 & 4. summary and details ( <summary> & <details> )
Primary focus as per w3c standard remains the same.
The Working Group aims to produce an HTML 5.2 Recommendation in late 2017 you can find details here https://www.w3.org/TR/html52/