Introduction to HTML 5

[@Ribby00]

One of the best tech videos I've ever seen. Great explanations and examples. I wish every tutorial video could be this complete!

[@nongthombamthambalsana8390]

One of the best videos l've ever seen great explanations and examples. I wish every tutorial

[@JavaLu]

HOLY COW. How can a such informative media (Video, audio, text) that actually exists! GOOD JOB!!

[@SallyGreenaway]

Would be really helpful if you had a table of contents/overview and associated min/sec into this movie (given how long it is). Also, can html 5 players have markers and interactivity - that if I wanted to click on an option in the contents at the start, it can jump to that marker in the film? Just wondering that's all...

[@blender3dartist]

Amazing. I just watched this video without flash via KZbin's HTML5 beta. The video quality suffered, however I can still watch the video a lot faster than I ever could with Adobe Flash. (I'm on a Mac using Google Chrome version 4.0.249.49 (35163) beta)

[@sprockkets]

Apple's quicktime container is what h.264/mp4 video uses. Yes, they didn't make the format, but they do contribute to it due to the fact they are part of the MPEG group, as many others are.

[@sacamigo1]

Wow this was genius I did not know all that had been integrated into HTML 5. The database part scares me just a bit, but I understand. And I hope that one day the video tag beats using flash player for showing videos. This video definitely got raised my interest in HTML 5 as a web designer. Thanks!

[@Restrictted]

Didn't finish video about like 15% left because I'm not a web designer but it changes what I think about flash this just seems so much better wow

[@YouKilledAlan]

WTF?? I joined the HTML5 beta test and this 40 minuted video just fully buffered in literally one second. Awesome.

[@gorantisridhar]

First of all Thanks for coming with this wonderful presentation HTML 5 Thanks & Regards, Sridhar Goranti USA

[@sprockkets]

The file container used in mpeg4-AVC aka h.264 is Apple's quicktime container. Codec wise no.

[@joeovip]

Great overview! Thanks Brad! It is a more extended explanation that the one given at google i/o 2009!

[@ComradeSlice]

They're working really hard on it, and I'm glad they are trying. The problem is OGG vs H.264. Google wants both. Mozilla and Opera Software want OGG, and Apple wants H.264. IE has none. I like it so far :).

[@nixkuroi]

@Givicencio You can attach styles to svg as well, He was just using a simple example.

[@moizr123]

Excellent introduction to HTML5. Very well done!

[@importedinventions]

For anyone expecting a tutorial,.. THIS IS AN INTRODUCTION. He goes on a very fast pace moving from topic to concepts. If you're looking for a video on HOW TO... you're wasting your 40 minutes here.

[@akgammer]

Very nice presentation. Clear, good examples and friendly.

[@parahumanoid]

Quite comprehensive and well done. I guess it's a tad long for one clip and should probably be split into parts. Great material, thank you.

[@rbrtchng]

This is really awesome, is there anywhere else on the web that gives good tutorials and references without having to read the entire documentation?

[@OCHackerz]

We're big fans of HTML5!! Huge potential!

[@eeyk1993]

@DragonAge2k because firefox 3.6 and internet explorer 8 doesn't know the html elements. only firefox knows some elements. but now IE9 and FF4 you can play video tags.

[@inDASHcorrect]

YES!! I LOVE HTML 5 and I am actually viewing this video in HTML 5!! :D But this IS the first time...I have opted into the HTML 5 trial countless times, and I don't know why I keep having to opt in... I want my KZbin preferences to STAY in HTML5 ...and hopefully KZbin and everything else will phase out Flash Plug In.

[@sbabu12345]

Very good intro .. Thanks. What about web sockets ? would have been great if that was part of presentation.

[@ChunkyChest]

Although the web and HTML5 have grown since this intro video, it's simplicity is in some ways clearer than today's cluttered and over saturated library based web. Very useful, thanks:) BTW found the slides for this: www.slideshare.net/jobfan/google-html5-tutorial

[@vvs1991]

Very good demonstration. Thanks! I have more fun watching your video than reading the spec.

[@jadedchron]

@domainholdings probably because the spec changes a lot and there's no point in updating the validator if HTML5 development is priority.

[@rasmasyean]

What's the difference between the "OnMouseover" playing video in HTML 5 and the one in Bing Video results?

[@benjaminshinobi]

Your voice is mad soothing dude. You've got to write a self-help book and then do the audio book for it.

[@hergs]

Great presentation. Truly game-changing stuff coming along.

[@itradelive]

ya it work for me with the 3.5.3 hmm its really strange that it doesn't work for you. Firefox is usually very similar. You have a PC or Mac?

[@unrewritable]

The future of the web is beautiful!

[@LOLvict]

Your browser does not currently recognize any of the video formats available. Click here to visit our frequently asked questions about HTML5 video. im using firefox 3.6 isnt that meant to work?

[@Jeorney]

Has the javascript shim that enables html5 features been altered for IE9? its probably not needed anymore, unless it been changed to enable the few remaining html5 features not supported. If there is no change, how would you alter the javascript to detect an older version of IE than 9? Or perhaps detect if it not IE9? Whatever will process faster.

[@rethab]

thanks brad, for this amazing introduction to html5. i finally know what it's all about :D

[@1javierescobar]

I really appreciate the way that you share this valuable knowledge .. thanks a lot

[@GeneralMcFishy]

Cool! I've been waiting for this a for long time for the web just as I waited for WPF for desktop application and finally it arrived. Life is getting better every day. Now that I understand why iPad doesn't support Flash.

[@Funnyframework]

DUUUUUUDE!!!!! What?!!! Yeah!!!! I'm loving this video! My background is in visual communications. This rocks and seems much easier than writing action script paired with swf for interactive content. I am absolutely going to learn this! SEO friendly animation?! Not sure yet.

[@jul13579]

Nice HTML 5 Introduction brad ! It's quite informative

[@gibsonsg3444]

how come you changed it to wide-widescreen?

[@fnyklr]

So is there going to be two official web video codecs, Ogg and h264, that are installed on all web devices? Hasn't some of the problem up to now been that you put and avi file up on the web and you can only play it if you have a specific codec, and that is a major hassle just to view a video. So instead people just use KZbin since you don't need any codec except that flash codec.

[@Retnuh1974]

I am on a Mac. I will have to try it on my PC when I start it up later. What about you?

[@BigdogWitBigdog]

@ChristianNorge HTML5 is a hell of a lot faster than flash. What are you talking about?

[@qabandiman]

Question: can you stream using the video tag? like from a camera, im thinking camera data will be sent to the server and the server storing it in a mp4 while the video tag keep downloading, I dont know :S

[@iRemainNameless]

This is pretty cool. I'm not too sure what exactly html5 does - but I have seen some really neat demos and web pages.

[@RusiMarinov]

very good presentations about the trends of web browsers developing

[@LoganSnyder]

@GoogleDevelopers I don't know if you still make videos because this video was made in 2009 and it is currently 2011 but, I made my site using just HTML. Does this mean I have to completly recode my site with HTML5? Please reply! :)

[@Bluecewe]

Its 2012 now; though HTML5, CSS3 and WebGL still lack wide-spread adoption, with key security flaws and performance gaps. I'm totally for HTML5 and all it's supporting standards and technologies, but right now it's safer and easier to just make an RIA in Flash, as if you tried to do so in HTML5, you'd end up having to include Flash at some point as a fallback, or even for behind the scenes processing such as socket transfer. Stage3D also appears more stable and compatible than WebGL currently.

[@Dragonathan]

but you still have to code it instead of just drawing with your mouse right?

[@Matthill121]

Wow. I tested it. It loaded this whole video in 3 seconds. Took flash a whole 10 minutes with a great connection. Flash sucks :3

[@MarkAdams87]

Great video! Any way to get the powerpoint??

[@vinczgorad]

cant wait to see all this in action everywhere..

[@rasmasyean]

How to you handle the problem of someone using a video tag to display your video on their web site. Because video streaming can costs some money because it's data intensive. Then they can like use your video without permission and load your server and you don't get anything out of it.

[@Vahagnll]

The SVG rectangle example doesn't show anything in my Firefox 3.5.3 (I'm on Mac OS X.)

[@go2au]

Last time I checked Safari was not open source and IE (which is still the de facto standard web browser in the World) was not mentioned very often with HTML5 compatibility.

[@xealit]

currently the flash lags horribly on my Ubuntu (..well maybe rebooting computer would help, but who does this kind of things with Ubuntu?) And HTML5 looks like an awesome among awesomeness!

[@mmikram]

Really excellent and highly informative video for starters.

[@s9729126c]

@DocIdo yes it does do something. With the HTML5 thing, you load videos more efficiently, and there is no need to install crap like flash, silverlight, etc and the new video players are cool

[@meuandthelot]

I must be an exception, flash has been mostly stable, and doesn't hinder my multi-task abilities. html5 used 22% more resources on my dual core system[Vista & Chrome]?

[@mumptastic]

The only thing about flash going away is at this point, Canvass is not accessible, but a solution is in the works according to the W3C. Flash is accessible only on internet explorer unfortunately.

[@bennymcfarlane]

THe SVG logo example clarified nothing for me. How was that image created with HTML?

[@ganeshatkale6477]

Its one of feature of playing audio, VDO in object tag, which i like most!

[@FengWeiguo]

Really a great introduction to html 5

[@哈利寿]

Agree. HTML5 really needs further development

[@rpashoukos]

Wow, that was great! My head is spinning but at least I can now see the ball, Thanks.

[@inconformant]

what's the purpose for some of this stuff like motion detecting and vector graphic manipulation for the normal websites?? quite unecessary imo. there is however a cool factor but that's about it.

[@Retnuh1974]

I went and just tried KZbin's HTML5 Demo and it fails with FireFox 3.5.3, but passes with Safari 4.0.0 (newest updates), anyone know why? It says on FireFox that HTML5 is supported.

[@Mandrag0ras]

I can't understand why one of my videos loads as HTML5 even though I have HTML5 disabled. All other videos load as flash. Is there an option that makes it force load as HTML5? Unfortunately Firefox does not support H.264 so HTML5 H.264 videos are not available for Firefox.

[@reachwill]

is it possible to offer html5 embed code and not rely on Flash at all? The embed code offered by the youtube beta is still an object tag pointing to a Flash swf. The swf is a single object allowing all the functionality to be combined into a single reusable object. How can this be achieved with HTML5?

[@Givicencio]

isn't "rect fill=blue...>" going one step back in all this separation of structure and presentation?

[@dmitshur]

Why is CPU usage so much higher with youtube html5 beta enabled than with Flash? It's not practical until it's equal or vice versa.

[@RusiMarinov]

very good presentations for new browsers developing

[@chanxrz]

Hello! i just wanna ask coz i am really new to HTML5 and i have an assignment... i need to develop a dictionary application... i'm already finish with the design and some functions, my problem now is that how can i link the word inputted on the the textarea to google dictionary when you click the word to show what the word means... BIG BIG HELP HERE!!!!! my deadline is coming...

[@zone8612]

can anyone tell me why my box has thicker corners on the bottom and right side, and thinner corners on the top and left side?

[@Zaku186]

Uh so why aren't most of the KZbin vids i used to be able to watch not working now? it just says that my browser doesn't support HTML5. i even have the newest firefox

[@kelekokerupuk]

Your Video Is Very Useful Sharing Brad Neuberg has put together an educational Introduction to HTML 5 video that goes over many of the major aspects of this new standard, including:

[@MustNotRead]

@dtfageet i mean proper access to graphic data structures. this new technology will enable much more powerful visual applications, generative realtime visuals, which were only possible before using external frameworks such as Java applets, flash, etc. with HTML5, pixel access can be done.

[@luketechco]

where can I find the source code that was used in the video?

[@MustNotRead]

@MustNotRead the [img] tag only allows the display of static bitmaps. which is not even comparable.

[@sagar.ganatra]

Really nice video. I would like to look at the code that you have used. Can you please share the files.

[@buggedcomputers]

html5 is future of web. Thanks for class.

[@DariusDaGreat86]

As a web developer, I would get exited about this if not for the fact that alot of people still use IE and SHOCKINGLY IE6...I'm sick and tired of cross browser compatibility issues and this is just gonna add to that

[@LinkinParkLPKid]

How come Html5 videos load only on certain videos for me?

[@tiennguyenvantt]

HTML 5 will be the most popular WEB Language in the near future .

[@whoisleipo]

Can someone tell me how i search youtube by day, week or year on an iphone. I can't find those search criteria options anywhere. Thank you.

[@kodamin6723]

What does he mean by fidelity?

[@SSSavio]

Why do you want to convert html5 to flash?

[@lunch77]

@MustNotRead Wouldn't it be cool if there was a super quick instant Flash to Html5 converter that worked instantly on your computer?

[@flowewritharoma]

My question so far is what HTML5 and HTML4 is different?

[@nikhilthakur123]

Awsome demo, very neat and consice. thanks dude.

[@Solunidos]

Este es un video viejito, más sin embargo bastante informativo para nosotros los desarrolladores

[@Brady2k10]

do you know html 5 then? like how to code with it?

[@ShamimKeshani]

Thank you for this great video! I'm a beginner and i just learned a lot! :)

[@TreyRust]

@planetdarwin and sense flash is a plugin, its non-standard, and if it where to be made standard, a lot of developers would not be able to develop for websites anymore, because they would have to buy CS4

[@despai]

Really amazing, im going to begin with HTML5 in ipad dev :)

[@boukevanderbijl]

GREAT presentation, but I hard a hard time reading the slides..

[@yoyoretro]

thanks for the transcriptions :) (english is not my native language so this is very helpful!) and great video - cheers!

[@rasmasyean]

@truthIsStranger In college they usually focus on things that teach theory so you have a "core" understanding of the science behind it. Videos like these are besically summaries and tocuh the surface of the topic without going into the underlying principles of programming and CS. They are normally made for ppl who are already experienced developers.

[@NorskTorsk]

will there be flying cars?

[@rubber4soul]

when html 5 will be launched?