The potential of HTML5

Posted:
in Mac Software edited January 2014
Even though HTML5 is currently a work in progress. Here are some examples of its potential and how great it will be. Here are animation and graphics that people keep saying cannot be done in HTML5. Its all mostly done in Canvas and CSS - no Flash involved. Some of these sites are only compatible with Safari 4.





Star Wars Crawl



CSS Clock



Use your pointer to manipulate the patterns

HTML5 Canvas Experiment



Use your pointer to blow up the video.

Blowing up HTML5 video and mapping it into 3D space

Comments

  • Reply 1 of 12
    Ustream workson the iPhone/iPad also. I don't know if it's html5 or not, but watching various concerts (Jimmy Buffett at the moment) streaming live over 3G is keeping me entertained. No Flash required.
  • Reply 2 of 12
    tenobelltenobell Posts: 7,014member
    That is HTTP Live Streaming . For the moment it is a Quicktime X specific technology and not apart of HTML5. Apple submitted proposal for it to be a standard last year.
  • Reply 3 of 12
    frank777frank777 Posts: 5,839member
    While I'm sure that HTML5 is great for coders, does it get us anywhere closer to putting web publishing on par with desktop publishing?



    To create a document with InDesign or Quark (or even Word or Pages) I don't need to write any code or learn any programming languages. Why is it any different with the web?



    At what point will complex web design have truly compelling WYSIWYG tools?
  • Reply 4 of 12
    tenobelltenobell Posts: 7,014member
    I've never heard of that as a particular goal. Over time more sophisticated functionality will become WYSIWIG. But the most advanced functionality will always continue to move on.



    In very simple terms there are WYSIWIG tools for web publishing. But complex cutting edge animation and graphic design will always involve coding.





    Quote:
    Originally Posted by Frank777 View Post


    While I'm sure that HTML5 is great for coders, does it get us anywhere closer to putting web publishing on par with desktop publishing?



    To create a document with InDesign or Quark (or even Word or Pages) I don't need to write any code or learn any programming languages. Why is it any different with the web?



    At what point will complex web design have truly compelling WYSIWYG tools?



  • Reply 5 of 12
    tenobelltenobell Posts: 7,014member
    The fellows at PocketNow tested a Nexus One running Android 2.2 against an iPhone 3GS and Opera Mobile 10 on an HTC HD2. Load times on the Nexus One were far behind the iPhone's and closer to, but mostly still behind, the HD2. And when Flash elements were on a page, such as a banner ad, scrolling up and down became really choppy and slow. Overall, it just looks like a worse browsing experience unless you're looking to view/use Flash content specifically.



    Gizmodo
  • Reply 6 of 12
    frank777frank777 Posts: 5,839member
    Quote:
    Originally Posted by TenoBell View Post


    In very simple terms there are WYSIWIG tools for web publishing.



    I could be wrong, but I think the basic problem with WYSIWYG web design lies with fonts.



    Fonts reside on the user's computer, meaning that a designer is never 100% sure that visitors are seeing the site the way it was intended to be seen, even on modern browsers.



    It will take a Steve Jobs-like personality to demand a way for fonts to be stored and accessed on the websites themselves. Then WYSIWYG web design will get really interesting.
  • Reply 7 of 12
    tenobelltenobell Posts: 7,014member
    Web Fonts are built into HTML5.



    Scribd is using HTML5 web fonts.



    Quote:
    Originally Posted by Frank777 View Post


    I could be wrong, but I think the basic problem with WYSIWYG web design lies with fonts.



  • Reply 8 of 12
    frank777frank777 Posts: 5,839member
    Quote:
    Originally Posted by TenoBell View Post


    Web Fonts are built into HTML5.



    That's great. The more I hear about HTML5, the more I like it.
  • Reply 9 of 12
    tenobelltenobell Posts: 7,014member
    More awesome examples of HTML5 in action.



    Press Space to fire, the ← and → arrow keys to turn, and the ↑ arrow key to thrust.

    HTML 5 Asteroids



    Arrow keys to move, ?Space? to toggle magnify mode. Mouse click on an image to view on Flickr. You need to ?right arrow? on the right wall to get more photos loaded in.

    Snow Stack
  • Reply 10 of 12
    Quote:
    Originally Posted by TenoBell View Post


    More awesome examples of HTML5 in action.



    Press Space to fire, the ← and → arrow keys to turn, and the ↑ arrow key to thrust. Arrow keys to move, ?Space? to toggle magnify mode. Mouse click on an image to view on Flickr. You need to ?right arrow? on the right wall to get more photos loaded in.



    Well I like the first one too much. Its just looks like a small game that are running on HTML5. It doesn't mean that the second one is not good its also good and fine but its too much small in size and we can't see it clear. But that one also looking like that painted.
  • Reply 11 of 12
    tenobelltenobell Posts: 7,014member
    In the second one. Are you speaking of Snow Stack? Initially you have to give some time for the pictures to load. You keep pushing the right arrow button to load more pictures and it becomes an infinitely long floating array of pictures that you can navigate.



    Quote:
    Originally Posted by Joneswilliamsc View Post


    Well I like the first one too much. Its just looks like a small game that are running on HTML5. It doesn't mean that the second one is not good its also good and fine but its too much small in size and we can't see it clear. But that one also looking like that painted.



  • Reply 12 of 12
    tenobelltenobell Posts: 7,014member
    Ball Pool
    1. Drag A Ball

    2. Click The Background

    3. Shake your browser window

    4. Play

    Google Gravity

    Google Home page elements can be grabbed and thrown around
Sign In or Register to comment.