I know we didn’t even started profoundly with HTML5.

This is just a visualization for advanced and more semantic HTML. I imagined that version in some near future, quite funny but not impossible. May be few years later, we may see this.
image source - iconfinder.com
1. Updated <img> tag

Traditional images need to zoom out without help of any java script or so. So the img tag will have “zoom” attribute. Which will have value in Boolean as “true” or “false”. If selected “true”, the image will be clickable and will zoom out like in light box effect. By default we can upload a single large image. Syntax can be like…
<img zoom=”true” />

Similarly, we can have “swap” image attribute in this.
<img src=”” swap=”another image URL which will be used in swapping” />

2. New IMGGRP tag for slideshow effects

Most of the websites have slide-shows (flash/jQuery) on landing page. Future <img> tag should have it in inbuilt attributes as “EFFECT” which will consists of some basic values as “fade in”, “fade out” or “glide”

This new tag image group is similar to <img /> tag. But it will contain multiple images option for creating slideshow. Like, as we have <select><option> pair, we will have <IMGGRP><img /> pair. List all the images for a slideshow in <imggrp> tag.
<imggrp effect=”fadein”>
    <img src=””  selected=”selected” />
    <img src=”” />
    <img src=”” />

3. Social media icons

As we know this is the era of social networking. We always place social media icons on the sites. In next few years, we can have integrated code for this basic icons like below in our HTML markup itself. How easy would it be, we don’t have to download/crop images for each social media icon:)

    <facebook width=”” height=”” href=”external URL”>
    <twitter width=”” height”” href=””>
This will automatically display standard social icons in our HTML pages with links and icon image size, may be in form of fonts?

4. New tag “LOGO”

As simple as that, we always require logo in our site, there should be an individual tag like image for displaying logo.
<logo src=”image file url” width=”” height=”” href=”index page link” />

If these things (and many more!) will be updated in upcoming version of HTML then we will also have updates in dreamweaver/css  and other editor tools!.
For ex – we will have automatic commented markup while creating a new HTML page.

Furthermore, it may have advanced form tags and attributes. Hope for best:)

Happy to Hear...

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s