Skip to main content

Whats new in HTML5?

I started reading up on html5 tags on my favorite w3schools.com ..

Here are the ones I find very interesting and useful to know.
Note: some of them are not supported yet in major browsers.

New Features :

Offline storage support ditching cookies.

New Tags

Elements :

menu- Not yet supported. But a step towards making web sites like desktop apps
nav - Gives a navigation header of links
meter - Provides a progress bar like control to denote process completion
progress - Similar to meter above
time - represent time as machine parsable
wbr - Mark places that are suitable for word breaking. useful in formatting paragraphs
media :

audio - Self explanatory play audio
figcaption/figure- caption for an image and an image or chart itself.
video - Most expected feature that is touted to rid of all the flash woes. 

track - Support for closed captions etc.
graphics:
canvas - Basically treat browser window area as a drawable canvas element using js. 
form related:
datalist - Sort of like a text box with an auto complete list. People can use this to implement all the auto complete list, just have a ajax call to keep appending to this element.
keygen - This helps authentication by enabling form submissions with RSA keys.
output - Nothing too big. Just explictly mark a field as an output of a computation, so you can refer to it directly without selecting with a id/class
New Attributes:

input tag :
accept - limit your input to certain MIME types like images, videos etc. Actually this old. But felt worth pointing out again
autocomplete - Enabled autocomplete for the input type. Something all browsers were doing anyways. now built into the standard.
autofocus - makes the input element have the focus on by default on page load.
formaction/formenctype/formmethod/formnovalidate - This is cool to override form level settings for these, specifically for each input element.Note that this support has been added to other tags like button, textarea as well.
pattern - this is ultra cool. Specify a regex and have your input validated at the client side directly. No more repetitive javascript testing.
multiple - Support for choosing more than one value. say, multiple files
step - Specifies the valid step increments for the new input type supported like number etc.
max, min - specifies the max and min values for new input types supported.
height, width - self explanatory
required - specifies this input field as required. More cool client side input validation.
placeholder - Text like "enter your email here" to prompt for what to type in a field. Neat in that it saves a lot of real estate on the form usually taken up by labels.
area tag, new attributes 
This is basically used to map different regions of an image say.

fieldset tag, new attributes
Standard attributes added. used to subgroup controls inside a form.

iframe tags 
Support to make internal frames appear seamlessly integrated into parent doc


New Attribute Values:

input tag, type attribute
        color picker , calendar controls, email field, spinner for numbers,  slider for numbers,  fields specifically for search/url/telephonenumbers.



Comments

Popular posts from this blog

Learning Spark Streaming #1

I have been doing a lot of Spark in the past few months, and of late, have taken a keen interest in Spark Streaming . In a series of posts, I intend to cover a lot of details about Spark streaming and even other stream processing systems in general, either presenting technical arguments/critiques, with any micro benchmarks as needed. Some high level description of Spark Streaming (as of 1.4),  most of which you can find in the programming guide .  At a high level, Spark streaming is simply a spark job run on very small increments of input data (i.e micro batch), every 't' seconds, where t can be as low as 1 second. As with any stream processing system, there are three big aspects to the framework itself. Ingesting the data streams : This is accomplished via DStreams, which you can think of effectively as a thin wrapper around an input source such as Kafka/HDFS which knows how to read the next N entries from the input. The receiver based approach is a little compl

Setting up Hadoop/YARN/Spark/Hive on Mac OSX El Capitan

If you are like me, who loves to have everything you are developing against working locally in a mini-integration environment, read on Here, we attempt to get some pretty heavy-weight stuff working locally on your mac, namely Hadoop (Hadoop2/HDFS) YARN (So you can submit MR jobs) Spark (We will illustrate with Spark Shell, but should work on YARN mode as well) Hive (So we can create some tables and play with it)  We will use the latest stable Cloudera distribution, and work off the jars. Most of the methodology is borrowed from here , we just link the four pieces together nicely in this blog.  Download Stuff First off all, make sure you have Java 7/8 installed, with JAVA_HOME variable setup to point to the correct location. You have to download the CDH tarballs for Hadoop, Zookeeper, Hive from the tarball page (CDH 5.4.x page ) and untar them under a folder (refered to as CDH_HOME going forward) as hadoop, zookeeper $ ls $HOME /bin/cdh/5.4.7 hadoop

Enabling SSL in MAMP

Open /Applications/MAMP/conf/apache/httpd.conf, Add the line LoadModule ssl_module modules/mod_ssl.so          or uncomment this out if already in the conf file Also add lines to listen on 80, if not there already Listen 80   ServerName localhost:80 Open /Applications/MAMP/conf/apache/ssl.conf. Remove all lines as well as . Find the line defining SSLCertificateFile and SSLCertificateKeyFile, set it to SSLCertificateFile /Applications/MAMP/conf/apache/ssl/server.crt SSLCertificateKeyFile /Applications/MAMP/conf/apache/ssl/server.key Create a new folder /Applications/MAMP/conf/apache/ssl. Drop into the terminal and navigate to the new folder cd /Applications/MAMP/conf/apache/ssl Create a private key, giving a password openssl genrsa -des3 -out server.key 1024 Remove the password cp server.key server-pw.key openssl rsa -in server-pw.key -out server.key Create a certificate signing request, pressing return for defa