Archive for the ‘HTML5’ Category
There is no doubt that the most intriguing new HTML5 tag is the canvas tag. Despite all controversial web discussions concerning this element it is obvious that canvas symbolizes the “semantic” web concept. Its aim is to simplify the process of rendering the 2D shapes and bitmap images. You may have seen a few “canvas” demos that already became viral on the web. As the result many developers and web designers have noticed that using the canvas tag is really effective and it saves much time.
Recent big news from the Google I/O conference showed us that the main market players admit HTML5 as a main perspective for the further development. Actually we hope that it will disctact us from all these media wars and that the social media world will expand a more useful information about new and interesting achievements of HTML5.
Today we have compiled some interesting applications and sketching tools that are build with the help of Java scripts and the “canvas” tag. These examples are only experiments but they’re definitely worth checking out. (Don’t forget that it would be better to browse all these application via Chrome or the latest versions of Opera and Firefox).
Spirograph is a geometric drawing toy that produces mathematical curves of the variety technically known as the hypotrochoids and epitrochoids (via WikiPedia). This example allows you to play with all kinds of parameters including size of mobile circle, static circle and so on.
* * *
Inspiring tool that will make you feel like a real artist even if you are not. Great painting application with original patterns and interesting options.
* * *
Google’s third annual I/O conference has brought plenty of controversial news and we are sure that Internet audience will buzz about all this info for a very long time to come. Against the background all that high-flown announcements about new video codec, Google Wave open-sourcing, Chrome app store, Android 2.2 release, the presentation of the HTML5 add-on for the Dreamweaver CS5 has been kind of lost in the media sphere. And no one calls this extension revolutionary or controversial. Furthermore Dreamweaver is one of the best pieces of software that is popular among the developers from all over the world and it is hard to find other program that will beat it by its features and reputation. So we really think that the release of this pack will bring more fans to this software.
To tell you the truth this great news proves that Adobe looks out for a new way to resolve the problem that becomes really annoying for many web users – how to convince their clients (and Apple of course) that they produce stuff that is open for all formats (remember that someone called their Flash “closed system”?). It seems that HTML5 Extension for Dreamweaver CS5 is a nice move from the Adobe team to bring the “epic battle” to the new level by scoring points from the web developer audience by releasing this HTML5 pack.
What’s inside the box?
HTML5 extension to Dreamweaver CS5 will enable developers to “more easily create, deliver and optimize compelling content” across a wide range of platforms. The main features are:
- code hinting for HTML5 and CSS3, so now users can easily use the new HTML5 tags;
- developing content on a large a number of screens – from smartphones, to desktop computers;
- new CSS3 capabilities – users can also more easily design the multi-screen Web pages;
- WebKit improvements for Design View and Live View rendering;
- audio and video tags that allow to play media content directly via web browser (without any external plug-in or player) but this requires QuickTime installation;;
- HTML5 pack is totally free and you can easily download it right now at the AdobeLabs official website;
Jorge Taylor, Principal Scientist with the Design and Web group at Adobe, on Dreamweaver CS5 HTML5 Pack Extension.
They know what they’re doing and doing it right
Yes, as we have said before it is all about developers – and Adobe showed us that even if their dearest son – the Flash – will get lost in the desert of choices and intrigues from evil rivals, they won’t lose the war because developers will use their software to create websites and web design products with the help of their software. Evolution is a great way to keep your business on track and Adobe demonstrates us that there are many original solutions that will amaze your enemies and surprise your clients. Way to go!
Recently we have stumbled across a very interesting article My Thoughts on the Future of Flash by Flash developer Grant Skinner (that’s really a great atricle by the way, Grant you totally rock!). So anyways Mr. Skinner gave what we thinks is a rather unusual in its clarity and very cogent point of view concerning the situation with Flash technology and its rivals. You know, those are all simple things but after reading it all you really see that there’s actually no war between Flash and HTML5, currently there’s just not enough things we know to judge what’s better. The best thing Mr. Skinner mentioned was that each technology will get what it deserves – that’s where we as a community step in. If Technology A is better than Technology B, the community will abandon what’s worse and stick with what they consider to be the best choice.
But anyways, all this huge discussion about pros and cons of the two rather different technologies (Flash and HTML5) has both positive and negative sides. Due to the “hyper’ effect of social media this topic has achieved a status of a massive technology trend but it is clear that this PR campaign has some hidden peculiarities and targeted character (especially for the fans of the ‘iRandom-Macros’ products). The current situation shows that Flash has too many advantages which makes it hard to beat despite all those noble achievements of HTML5. So let’s now stop guessing and for a moment take a look at what really is going on out there, because reality is now which makes it stronger than any predictions.
The Flash market share is the most important argument (again, you can’t argue the reality of numbers). According to the Millward Brown survey conducted in December 2009 Flash content reaches 99% of Internet viewers (while HTML5 is only being supported by some 44% of browsers – not to mention the actual meager reach of Internet audience – basically there’s almost no HTML5 content so far).
The Apple of Discord – Codec for the New HTML5 <video> tag
Do you remember those good old times when we haven’t heard anything about the “Flash killers” and playing the web video with Flash player was the option and everyone was pretty much happy with that option? Yep, those days are long gone and things are totally different today – although it is hard to tell whether it’s good or bad. HTML5 strikes the web industry with new standards and unusual solutions that will someday get a status of “revolutionary”. The latest version of hyper text markup language raises its hand against many standards and of course one of the most controversial things about HTML5 is the <video> tag debates. The problem is that the folks from W3C group haven’t decided yet on what exact codec will be used for the new HTML5 <video> tag. And therefore what we have today are the two possible candidates to do this big job – Ogg Theora and H.264 codecs.
In the red corner of the ring is the Ogg Theora – the open source video codec project from Xiph.org which in turn is being funded by Mozilla Foundation. It is not bounded by some patents and fees so it is very convenient for the users and strongly recommended by the open source software community. Non-profit status of this software is a great thing but we can’t say that this codec can give you high performance video. It means that main trump of this codec is the free distributing but the quality of the video provided by Ogg Theora codec will surely make W3C think twice about it.
In the blue corner is the H.264 codec brought by the ISO Moving Picture Experts Group (aka MPEG). This codec’s mission is to deliver the high quality video with the assumption of low bitrate. An additional goal is to allow the standard to be applied to a wide variety of applications in various networks and systems. So far sounds awesome, doesn’t it? Well take this, W3C: the main problem is that if you want to use this software you will have to pay the licensing fees to MPEG LA.
Another Battle of the Browsers War?
We are sure that you’ll agree that HTML is one of the best web inventions of all times. The hyper text markup language is actually the cornerstone of modern web that appears to be a unique and self-sufficient phenomenon.
When HTML5 was being developed its developers have faced the few important issues that were to be solved with the help of HTML5. And one of these problems was creating a really explicit and extensible semantics. Now the tricky part is that the old versions of HTML were also being designed with the versatility in mind – with loads of various tags that were considered absolutely essential but have eventually proved themselves to be totally useless. The approach in the HTML5 has been changed according to the needs of today’s Internet.
HTML5 New Tags
The task that had to be accomplished by the developers was to create the richer and meaningful semantics for HTML5 version – plus the fact that new solution was supposed to be flexible, strongly efficient and of course to correspond to all modern web standards. Now here comes the list of the new tags that will available in HTML5.
- <article> tag defines an article
- <aside> tag defines content aside from the page content
- <audio> tag defines sound content
- <canvas> tag defines graphics
- <command> tag defines a command button
- <datalist> tag defines a dropdown list
- <details> tag defines details of an element
- <dialog> tag defines a dialog (conversation)
- <embed> tag defines external interactive content or plugin
- <figure> tag defines a group of media content, and their caption
- <footer> tag defines a footer for a section or page
- <header> tag defines a header for a section or page
- <hgroup> tag defines information about a section in a document
- <keygen> tag defines a generated key in a form
- <mark> tag defines marked text
- <meter> tag defines measurement within a predefined range
- <nav> tag defines navigation links
- <output> tag defines some types of output
- <progress> tag defines progress of a task of any kind
- <rp> tag is used in ruby annotations to define what to show browsers that do not support the ruby element.
- <rt> tag defines explanation to ruby annotations.
- <ruby> tag defines ruby annotations.
- <section> tag defines a section
- <source> tag defines media resources
- <time> tag defines a date/time
- <video> tag defines a video
Let’s just hope all of these will really be “alive” and useful tags, not just something we think is awesome today.
The Healing by HTML5 – Old Tags, Long Gone…
Now do you remember those old times when HTML3 was a sort of a miracle that could only be seen in Netscape? Yeah, it was the dawn of the Internet era. Of course we must never forget our history but it is a normal thing when we have to say good bye to some good old things (especially when they’re not that good and no one really cares about them anymore).
Read the rest of this entry »
“Battle for developers” is a short and sharp description of the situation that has emerged recently in the environment that we all live in – the Internet. The Web audience can’t stop buzzing about the “Epic Battle” between Flash and HTML 5. Here are some facts of this confrontation. The cornerstone of this struggle lies in a rivalry between Apple and Adobe. But now it is not a simple fight between two of the world’s leading IT companies – it is more of a struggle for the future of the web itself. Internet never stops evolving and HTML 5 is the evident results of this process – along with Adobe Flash.
The Video Episode
It is not a secret that most of the web standards are very much tied to Flash technology and when such media giants as YouTube and Vimeo have started playing their content with the help of HMTL 5 in addition to the good old Flash and it was a huge surprise for some companies. Here are examples of two players that are avaliable on YouTube. The designs are almost identical but there are several details that are worth being mentioned. HTML5 player has original feature that allows to choose the connection speed – you can see this panel in the bottom left corner. Plus, since it’s HTML 5 the player is so far supported by just a few browsers – but that’s more like a problem of a browser, not the player. What’s also important is that the HTML 5 player is faster than the Flash player.
HTML5 – Things We All Totally Love About It!
In our opinion HTML 5 is a great web standard that does have a lot of brilliant features that neither HTML 4 nor Flash have.
- First and foremost HTML 5 greatly simplifies the creation of websites and web products.
- Video elements. We’ve already mentioned that video elements thing and this is one of the best HTML 5 features because you can embed video without having to use any kinds of third party services.
- HTML 5 facilitates your work with various web applications and this is really cool feature because it allows you to implement different apps even without having an Internet connection.
- Another great feature is the new approach to the “canvas” element. According to the developers this element will allow you to design it all “on-the-fly”. Here’s a great example of using this tag – below you’ll find a great model called Cloth Simulation. This model was created by Andrew Hoyer with the help of the canvas tag and some jQuery scripts.