JSFoo 2013

HTML5 para todos, acercando el futuro al presente

Christian Heilmann  · 

Presentación

HTML (pincha para descargar)

Vídeo

Transcripción

Extracto de la transcripción automática del vídeo realizada por YouTube.

it is my absolute great pleasure to introduce our next speaker Christian Heilmann known to everybody as code poet big round of applause I have a little bio here so chris iseman has dedicated a lot of his time to making the better as we know originally he came

from a radio journalism background and he built his first website from scratch around 97 and discovered JavaScript at the time and girls that spent the following years working on lots of large international websites he spent a few years in yahoo building products

x yahoo and explaining and training people and is now at mozilla he wrote and contributed to four books on web development and he's right written he's written hundreds of articles and hundreds of blog posts for Ajax Ian Jack's Ian Smashing Magazine

yahoo Mozilla script junkie and many many more ah he's you know what I mean he's basically going to give a talk on html5 and how it's changing the world and how it makes the world a better place Christian all yours man thank you all right it's

back to be it's fun to be back in India and I think the last day or last four days everybody asked me why I never come back to India or why it's so off not so often that you see me over here and the main reason that I talk to people about was that

it's conrad aha to get a visa here because I have to have my passport in England for a whole week normally and I'm never in England for a whole week so it's rather tricky to get the visa but that's actually a partly a lie because it's a

more emotional thing I lived in Mumbai in 2003 and i met this incredible woman back then and we broke up and sadly enough you never saw each other again and she was she was amazing she had weird eating habits but I guess you could use to that but I still remember

her but she never emails she never calls it was really it was as if I didn't exist any longer it's just really really annoying but yeah this is what I looked like young and long hair still it's good but back back to what we have here wasn't

yesterday absolutely amazing I mean I was like I did not know what to expect 40s who are the organizers are great guys and I was like I was expecting us to be in some hotel lobby with 400 people in it and the protector that didn't quite work and everybody

would be like saying like Oh google said this so we have to do this now microsoft said this and everybody here at something great to tell everybody had some great demos and it was new materials as well it was nothing that i heard before and i'm at conferences

every week so there's cool new stuff that people talk about here which i don't see much at other conferences because i see people repeating their talks or giving talking about the same things or instead of giving people information it just show tools

from one and a half hours and tell them like if you use this then your professional otherwise you're gonna be out of a job tomorrow and here was just like okay this stuff is interesting look at that look at that and I was originally planning to do a lot

of HTML demos like really cool stuff and then I saw yesterday and I may I don't have to do it anymore you know we saw like 3d sound we so like Gaddafi starting sending drones out with with nodejs and it was all in all a very exciting experience and it's

good to see that these stuff works and I find it interesting that when you when you been following html5 and jas conferences for a while like I have you you end up with the same stuff all the time like oh this works if you turn on this this extra thing in

the browser and this is a nightly browser that only I have on my computer and you cannot do something with it and it's getting better that's what I like about it we don't have to have these special build browsers any longer stuff is already in

the shipped browsers nowadays in most of them of course so my life is actually explaining html5 and I get the same things from everybody I get these same prejudices all the time that like oh yeah it's never going to work and native is gonna be better and

like oh yeah facebook said it's not gonna work what do we do now so I talked to developers I talked to designers I talk to journalists I talked to vc people everybody has a different idea of what html5 is about and in my case it's kind of interesting

because it's these massive extremes I either get the people saying like html5 can't do that and we'll never be able to do that you know people that are afraid of that there's different browsers out there like oh if only there were one browser

the government gave us and we have to use that one that would be great like that would mean the government can spy on us oh wait anyways people keep telling me that they that's not possible that's not possible that's not possible because it's

not across all browsers and I think we have to stop doing that we have to stop thinking and as a web developer and somebody who loves the web to bits I always said you have to support everybody there's no way you can block people out of the internet just

around here looking what people are using what kind of horrible devices and you're like okay our DNS handshake here being more like a DNS walk in the park finding the other house and then doing a handshake we have to think about everybody out there and

we cannot say that this is the browser that you have to use this the environment that you have to use but that does not mean we have to support everybody the same way like when I talk to a journalist and he says like well this doesn't work in Internet

Explorer so it's not ready yet that's not true we have if statements we can ask the browser can you do this and if it can do that then we apply it if it doesn't if it cannot do that and it might not miss it we give it an interface that still works

there's nothing wrong with the search box and a button that actually said something to a server and comes back with a list of results of course it's cool if it's got a spinning thing and rotating in 3d and unicorns dancing in the background but

you don't necessarily need it like I found it here in the hotel when the connection was really bad I cannot use facebook account use Google+ cause without a Travis script fully loading and being fast he interfaces not even responsive yet whereas Twitter

falls back to a normal normal input field I can still send things off or it has an API that i can write this thing myself in a few lines of code and sent my things off that way so support means not the same across all devices that's the worst thing to

do that's like sending a JPEG on the web but then calling it a website and even that wouldn't be same cause the color differences between browsers and between displays are different so you cannot say it's the same everywhere the other one of course

is that people that get very excited and say that html5 can do absolutely everything these are the people that send you like 23 Mac websites with 570 resources being loaded that screw it when you scroll do all kind of cool things reinvent flash a lot we do

the same things we didn't flash back then we were like these computers is far computer as fast do something about this let's animate a lot of stuff let's do background music at nobody needs let's do some opacity on on top of other things let's

make sure we have got everything I love that they're like they're selling tattoos lemonade and dog biscuits that's its entrepreneurship this is the kind of stuff that you go and actually go to VCS with we're going to do that biscuits calm and

when I see people getting excited about loading animations only you see this like showcases of 600 CSS animations to show a loading animation you've done a mistake when there's a long loading animation if somebody has to wait for a minute for your

website you steal their life you're killing them with a little knife continuously like I don't want to wait for stuff I want to have it and if it doesn't look perfect up front but I can't use it that's the most important bit not be like

oh please 15 minutes please wait 15 minutes we have something cool for you yes you got excited about this your designers are excited about it i just wanted to buy a ticket and I don't restaurants on my favorite there you go restaurant websites you like

what I want I want to know the menu maybe but i mostly want the telephone number and where the heck the restaurant is that's all I want to know will the telephone number have a tail domain so I can click it on my mobile phone most likely not will the address

be somewhere about this big in the footer and the buff I've got like a panorama of how great the thing looks or what the what the food is supposed to look like and then you go there and you eat it you're like it's not what you're from the website

might be England or maybe don't have food so I think this test is lots and lots of in between these two about getting overly excited about html5 and also saying like it doesn't work because it's a technology we'll never work a hundred percent

everybody who tells you that flash was easy because everybody had flash installed never worked with flash because flash had so many different versions and different differences between mac and Windows and Linux not at all so it was the same problem there and

this is a country where all these things are very flexible I mean I saw this the other day an opposed to hear that you have these cutters being sold and it says maximum occupancy is like two people normally like man and wife but then you see them in the streets

and dust like the kid and the other kid and then like now the kid an heir and a cow and a monkey and basically whatever can fit on these things it's absolutely amazing when you go into road you're like no okay and i love it when whenever especially

when they have to get there with like heaven on that the kid fits into the helmet our people don't put a strap on their hammered on yeah that's gonna help you in a full-frontal that's great I saw guys with hard hats that's another really cool

thing like it's like oh look I'm safe yeah from bricks falling on your head but not from cars crashing into you but at least we've done something about it but this flexibility i want you to apply to everything now html5 what we call html5 has a

lot of disappointments a lot of times I I want to do something and I cannot do it and there's many reasons for that or a bunch sometimes I just want to use it because I want to use it but because it makes sense I or sometimes something is like prefixed

in one browser and be like why does not ever browser do that because prefixes are they have to try things out prefixes and they have to be not there to be trusted if something says WebKit dash at the front of it don't use it just as the only thing let

it fall back to something without the web kit or something useful like a background image background gradients was the big thing chrome opera had to move to the new rendering engine because half the mobile web was broken on Opera because people said WebKit

linear gradient background dis and dat and then he had like white bubbles with white text cuz it wasn't a webkit browser like if they had said background green and then back non linear gradient it would be a green button it wouldn't hurt anybody would

still be a beautiful button it wouldn't have a gradient oh my god that maybe makes it faster as well so make sure that you don't think about just prefixes all the time but is him getting better when you look at the standards html5 has been defined

quite some time ago now and it's still not finished but that was another stupid question but like when is html5 finished and 0 in 2022 would you like you just pulled that out of somewhere and said like oh yeah give them a date and then the journal it shuts

up not understanding that journalists put these things are in headlines but the standards sometimes have interesting bits in them were you like how.what did that come to be now video this is how I embed video in a page everybody's like oh yeah html5 video

is ready it because there's like these browsers that are special and different from others like Isaac's and we got to do something about that so normally people say like okay who's html5 and then we fall back to flash or we fall back to silverlight

not so much before back to flash and I think it's not needed it's really not that necessary anymore because a you just encode the thing and have flash in there and all kind of things it shouldn't be up to use the developer to do these kind of things

so now you have a video with controls that gives you the controls a poster which is a preview of the video in case it is fast enough and then you have two sources you've got your mp4 which should still be the first close the first iPhones had a problem

if that wasn't the first then you have your web M for all the other browsers and we have oak video if you really want to go to old browsers and still support them browsers that already support the video tag and then I just fall back to an image and say

like here's an image of a bunny yeah Bonnie and it links to the mp4 click to watch the video like why should that not be why should I have to simulate another player in there if the user could click on an emotion in VLC or mplayer or whatever they use

on their computer to watch videos with of course providers would be like audibly could download my video you can download the video anyways stop being so defensive about that so but the problem is if you don't do that what happens then like mp4 is not

supported in all browsers cause it's a proprietary file format it's not an open file format so in Firefox we cannot put an mp4 decoder into the browser because it's not free software we would be pirates if we did that yar be cool but it would be

also illegal so we can't do this unless mp4 becomes completely open that's why we do wear them huh okay so the logical person in me says like okay this is a video element if the thing cannot be played it should fall back to this right because something

went wrong if I have an image in the page that cannot be loaded the alternative text is being displayed which is the same fallback mechanism not so much this is what you get in Firefox and this is not a good experience somehow like especially that liked no

videos would support a format a mime type found amount of people would look at the like what's a mime types like a clown or is it like like one of those guys it goes like hey I have no idea what you're talking about here so the fallback is only for

browsers that don't support the video element at all which is a dwindling mass of like small browsers and things that should have died years ago and I find that hard to believe that we have to know how do i do a fall back then how do I make sure that I

know the browser played the thing of course as a JavaScript developer is probably an event handler take a look at it okay document query select a video get the first video in the page add event listener error tell me where it hurts tell me what's wrong

please tell me what the error is that should work right every time error on error on Windows tells me whatever something happens no silence nothing coming in and you're like okay what do I do and what do you do when something like that fails you tried

everything in your in your arsenal maybe reading the specifications is a good idea that's always the last option right now let's make it work on all browsers and then see how w3c thought about doing it and this is how you have to do it so you select

[ ... ]

Nota: se han omitido las otras 7.929 palabras de la transcripción completa para cumplir con las normas de «uso razonable» de YouTube.