Apple.com posts cool new HTML5 Showcase

invisibleSHIELD case for iPad“Apple this week posted a new section on its website, showing off the abilities of HTML5 in a standards based browser such as Safari, including interactive videos and photos,” Sam Oliver reports for AppleInsider.

“Using the Safari browser, users can pan around a 360-degree view of the entrance to Apple’s iconic Fifth Avenue store in New York City, watch an embedded trailer for the forthcoming film ‘Tron’ and manipulate scale and perspective, or flip through a gallery of photos,” Oliver reports. “‘Every new Apple mobile device and every new Mac — along with the latest version of Apple’s Safari web browser — supports web standards including HTML5, CSS3, and JavaScript,’ the website reads. ‘These web standards are open, reliable, highly secure, and efficient. They allow web designers and developers to create advanced graphics, typography, animations, and transitions. Standards aren’t add-ons to the web. They are the web. And you can start using them today.'”

Oliver reports, “Seven different sections of content highlight the capabilities of HTML5, CSS3 and JavaScript.”

Full article here.

Apple’s HTML5 Showcase is here.

Also check out: developer.apple.com/safaridemos/

[Thanks to MacDailyNews Readers “Fred Mertz” and “TheMightyFinder” for the heads up.]

66 Comments

  1. Holy crap. I just chcked out the 360 degree viewer of the Apple Store on my iPhone and it works beautifully with the touch screen. No flash needed, sweet.

  2. This worked great..until safari quit on my iphone. I think this is a great proof of concept, but still isn’t fully baked. Hopefully, the Man in Black’s comments/backlash against adobe’s flash will hasten the developers to make it bullet proof. (the VR worked great, but clicking the tron video shut me down)

  3. I am running 10.5.8 on this MacBook Pro and everything except for the 360° worked on it. The 360° worked great on my iPhone 3G. Try my iPad tonight.

  4. The best part about this is, they have sample code, as well as fairly comprehensive instructions that explain how this stuff is created.

    So many photo galleries and slide shows, as well as embedded videos, could now be easily replaced with solutions like there, especially since code is already fully functional.

    Just marvelous!

  5. Of course, if these demos had been built with Flash they would have worked flawlessly and identically in close to 100% of the worlds desktop browsers. As it is, they are Safari only and that says all that needs to be said about the current state of HTML5 browser support.

    Rock on Adobe !! ” width=”19″ height=”19″ alt=”grin” style=”border:0;” />

  6. love it all, but i want to see full screen video on my 27 inch imac. have yet to see a site with it.

    mw word: miss, as in, “did i miss something while searching out full screen vid on html5”?

  7. This is good stuff, however it does not really address producing interactive demos which I have to create all the time.

    Flash may be bloated but it is still the best/easiest solution for a designer to create interactive demos for cd/dvds and self contain files for presentations.

    And I wish this word standards woulds stop being used. There is no “Standard”, if there was whatever you create would work across all platforms and look the same as well.

  8. @ Jersey_Trader

    I’m sure “The Man” would like his interactive stuff to work outside the Apple “hemisphere”. Therefore, Flash is and will be for some time to come, the way to go. You folks can stick your heads in the sand all you want but that doesn’t change the facts of the matter.

  9. @Hordur
    How are the demos Safari only? They are webkit supported. Webkit forms the engine for Mozilla, Chrome, AND all (useable) Mobile Browsers in mobile devices today.

    As you noted — they would have worked in Flash *on the desktop*. While all the current articles and reports coming out of places like D8 are stressing the trends toward mobile computing. That’s all that needs to be said about the current state of computing and the need to focus on workable standards.

    As for Safari, it is true that Safari probably supports MORE of the HTML5 spec than other browsers. That’s because Apple cares about open standards and regularly updates Safari (and webkit) accordingly; and Safari passes the ACID test with higher marks than other browsers. It’s like the UNIX certifications that OS X passes — funny how closed Apple is and how open MS is ” width=”19″ height=”19″ alt=”wink” style=”border:0;” />.

    But yes, this is testament to the state of HTML5 support among browsers at the moment. Funny thing is, all studies show that, for the low market share of Apple mobile devices, they do a major share of the browsing.

    And, I think it is going to be better to have built-in browser support for a standard where each developer can strive for greater and greater compliance at his own rate, than to need a closed plugin relying on one lazy and arrogant company which is proven to be exceedingly poor at supporting two desktop OS’s with all their resources, let the alone *promised* half-a-dozen mobile platforms with their limited resources.

  10. @ John
    I understand where you are coming from. In the meantime I use OS X’s zoom function to zoom the video out to the edge of my screen with my cursor set so I can then just tap the cursor on the edges of the screen for finer alignment. Not ideal, but it works.

    @ Bart
    Thanks for the example you link to. It’s very slick.

    As for the HTML5 examples, they all worked perfectly on my original black MacBook (I’ll try my iPhone later).
    HTML5 does seem to be making positive movements. I would love to say goodbye to Flash.

  11. @ kizedek

    I’m using Chrome. Apple has browser sniffing code on these demos that prevents anything other than Safari from viewing them. That’s how these demos are Safari only.

    Also, someone has allready checked Apple’s coding, CSS and such, and there is a bunch of Apple/Safari specific stuff going on there that will not work in other vendors’ browsers.

    And last I checked, Mozilla was using Gecko, not WebKit.

  12. @the man
    “And I wish this word standards woulds stop being used. There is no “Standard”, if there was whatever you create would work across all platforms and look the same as well.”

    Uhhh, try again. The “standards” are published. It’s up to developers to adhere to them. Of course Adobe Flash pretty much looks the same on all browsers — it’s using ONE company’s proprietary runtime.

    The whole problem with HTML and javascript for example, is that MS refused to comply with the standards. They tried to shut everyone else out of the web by corrupting the standards and making a browser that correctly implemented their own proprietary “standards” (established through monopoly abuse), but did not correctly implement (both intentionally and through ineptness) the agreed-upon universal standards! How difficult is that for people to understand?

    Tags like <div> are supposed to do operate in a particular way, and web developers can code a straightforward page layout with a minimum of fuss, and they will have pretty predictable results in FF and Safari and Opera and other “standards-compliant” browsers. And yet, when it comes to IE, all bets are off? Why can’t a developer define both the height and width of a div without getting a really funky result in IE?

    Why is that, do you think? Because *Standards* don’t work? Pardon, but I submit to you that MS wasn’t interested in complying with the open standards (besides which, they are pretty inept anyway — kind of like Adobe which hasn’t done a thing to progress Macromedia’s code innovations except to add bloat and obfuscation and hoops, a la MS).

    There are a lot of “standards” in this world. How about electrical current for one? You better hope that most of what you do and most of the products you use adhere to some kind of standard or you will find yourself up the creek pretty fast. Do you want some big brother to oversee or manufacture everything, just so that you can be sure there really is a standard for each type of thing? Didn’t think so — that’s what we have Standards Bodies for. Think about what you are posting.

    I wish people would stop being down on standards because of the notable and documented failings of one or two companies who really need to answer for their arrogance.

Reader Feedback

This site uses Akismet to reduce spam. Learn how your comment data is processed.