Help Turn a Flash Guy into an HTML5 Guy
February 4, 2010 8:05 AM Subscribe
I want to design an HTML5 (+JS & CSS), self-study course for myself. I'm a seasoned Flash/Actionscript developer, but I want to keep relevant if Flash dies. (Please spare me from pro/anti-Adobe politics. I don't care which technology wins. I want to be good at them all.)
HTML5 may well win out over Flash, but I'm convinced that won't happen next year. My clients want Browser/OS compatibility, and until everyone gets on board with standards for HTML5/CSS3/etc., Flash is still going to be relevant (in my opinion).
But I want to be able get work three-to-five years from now, when it's certainly possible that Flash's day will be over.
So please note that I'm less interested in today's web technologies than in the ones that will probably be used "tomorrow." I am not in a hurry. I want to be thorough.
Given a real or alternate future in which most web apps are built using HTML5 and its associated technologies, how should I best prepare myself? What are the best books, websites, training videos, tutorials, etc.?
Note: over the years, I have played with HTML, CSS and JS (including Jquery). I'm not a neophyte, but I'm also not an expert on best practices, security concerns, etc.
I've always found CSS the most confusing of the three core languages. I sort of get it, but the browser incompatibilities do my head in -- especially since for each problem, there seems to be 19 different competing solutions. All the tricks using negative positioning also confuse me. So great CSS resources are especially needed!
If there are related issues I should know about, such as what's going on with web fonts and video, please let me know.
Finally, since HTML5 (& co.) is in a state of flux, what are the best blogs to keep abreast of the latest changes and issues?
HTML5 may well win out over Flash, but I'm convinced that won't happen next year. My clients want Browser/OS compatibility, and until everyone gets on board with standards for HTML5/CSS3/etc., Flash is still going to be relevant (in my opinion).
But I want to be able get work three-to-five years from now, when it's certainly possible that Flash's day will be over.
So please note that I'm less interested in today's web technologies than in the ones that will probably be used "tomorrow." I am not in a hurry. I want to be thorough.
Given a real or alternate future in which most web apps are built using HTML5 and its associated technologies, how should I best prepare myself? What are the best books, websites, training videos, tutorials, etc.?
Note: over the years, I have played with HTML, CSS and JS (including Jquery). I'm not a neophyte, but I'm also not an expert on best practices, security concerns, etc.
I've always found CSS the most confusing of the three core languages. I sort of get it, but the browser incompatibilities do my head in -- especially since for each problem, there seems to be 19 different competing solutions. All the tricks using negative positioning also confuse me. So great CSS resources are especially needed!
If there are related issues I should know about, such as what's going on with web fonts and video, please let me know.
Finally, since HTML5 (& co.) is in a state of flux, what are the best blogs to keep abreast of the latest changes and issues?
To be honest, I wouldn't worry about HTML5 per se, or for that matter CSS3. A solid grounding in HTML/CSS to today's standards (i.e. HTML 4+/CSS2) will put you in a good position to pick up newer techniques in plenty of time before they migrate to the mainstream. Keep HTML5 and CSS3 as things you keep up to date with as a side interest. You don't want to get into a situation where your skills are only going to be commercially usable two or three years down the road. JQuery, on the other hand, is pretty awesome and highly relevant now, although again a little background knowledge of straight Javascript will do wonders for your understanding.
For learning the ropes, Zeldman has a pretty solid list of resources. And the Web Developer's Handbook has more links that you could read in a lifetime. Which you find useful will be down to you, but they're both sources I trust.
But whether HTML, CSS and Javascript frameworks are enough between them to ensure a solid future career in web development will depend on the job market where you live. A lot of people working in those areas either have significant design skills or do a lot of server-side stuff as well. I've known people who work exslusively on front-end web development, but in my experience it's not that common, and they're not nearly as well paid.
posted by le morte de bea arthur at 8:26 AM on February 4, 2010 [1 favorite]
For learning the ropes, Zeldman has a pretty solid list of resources. And the Web Developer's Handbook has more links that you could read in a lifetime. Which you find useful will be down to you, but they're both sources I trust.
But whether HTML, CSS and Javascript frameworks are enough between them to ensure a solid future career in web development will depend on the job market where you live. A lot of people working in those areas either have significant design skills or do a lot of server-side stuff as well. I've known people who work exslusively on front-end web development, but in my experience it's not that common, and they're not nearly as well paid.
posted by le morte de bea arthur at 8:26 AM on February 4, 2010 [1 favorite]
CSS is dead drop easy. I'm a grade-a moron, and I got a solid handle on it after running a couple of tutorials and building a few sample sites.
Browser compatibility is still an issue, but it's becoming less of one each day. Here's my super-pro tip on avoiding IE box model issues: If you have set width or height on an element, don't set paddings or margins, and vice versa. This takes care of like 75% of the most common browser display issues.
Just do a couple of web tutorials to demystify the process and you'll be aces. Especially with your already-existing programming skills.
posted by Aquaman at 8:31 AM on February 4, 2010 [3 favorites]
Browser compatibility is still an issue, but it's becoming less of one each day. Here's my super-pro tip on avoiding IE box model issues: If you have set width or height on an element, don't set paddings or margins, and vice versa. This takes care of like 75% of the most common browser display issues.
Just do a couple of web tutorials to demystify the process and you'll be aces. Especially with your already-existing programming skills.
posted by Aquaman at 8:31 AM on February 4, 2010 [3 favorites]
The HTML5 spec isn't finished, and of course, even once it is, IE won't fully implement it for another 10 years. As of right now, the recommendations as to what HTML5 elements should be used in what ways are subject to some confusion and even modification. I was just poking around the HTML5 Doctor website yesterday (which is worth a look), and they've had to amend some articles that originally recommended, say, encapsulating a web page's main content in a "section" element. And apparently HTML5's benevolent dictator, Ian Hickson, has modified some of the original tag definitions after community pushback.
As to CSS positioning tricks, I say pick a grid framework you like (Blueprint, 960.gs, whatever) and let it do the heavy lifting.
posted by adamrice at 8:36 AM on February 4, 2010
As to CSS positioning tricks, I say pick a grid framework you like (Blueprint, 960.gs, whatever) and let it do the heavy lifting.
posted by adamrice at 8:36 AM on February 4, 2010
I keep up with HTML5 at The WHATWG Blog. In particular, their Weekly Review is a good place to start for a history of what has been talked about.
posted by netbros at 8:52 AM on February 4, 2010
posted by netbros at 8:52 AM on February 4, 2010
Response by poster: You don't want to get into a situation where your skills are only going to be commercially usable two or three years down the road.
le morte de bea arthur, thanks, but that's EXACTLY what I want. My Actionscript skills are very much in demand right now. I couldn't take on an Ajax job now even if I wanted to, because I'm too busy with Flash work. My worry is not about now -- it's about three/five years from now when (in one possible future), Flash has lost its popularity.
posted by grumblebee at 8:57 AM on February 4, 2010
le morte de bea arthur, thanks, but that's EXACTLY what I want. My Actionscript skills are very much in demand right now. I couldn't take on an Ajax job now even if I wanted to, because I'm too busy with Flash work. My worry is not about now -- it's about three/five years from now when (in one possible future), Flash has lost its popularity.
posted by grumblebee at 8:57 AM on February 4, 2010
that's EXACTLY what I want
Ok, but my other advice stands. And HTML5 is still very much subject to change right now, as adamrice mentioned. Resources for learning HTML 4.01, which is pretty much set in stone at this point, are plentiful and often very good. They'll take you 95% of the way to learning HTML5. Trying to build up a competence in HTML5 as a separate thing is a bit like training for a sport where they haven't quite decided whether you'll be swimming or riding a horse.
posted by le morte de bea arthur at 9:09 AM on February 4, 2010 [1 favorite]
Ok, but my other advice stands. And HTML5 is still very much subject to change right now, as adamrice mentioned. Resources for learning HTML 4.01, which is pretty much set in stone at this point, are plentiful and often very good. They'll take you 95% of the way to learning HTML5. Trying to build up a competence in HTML5 as a separate thing is a bit like training for a sport where they haven't quite decided whether you'll be swimming or riding a horse.
posted by le morte de bea arthur at 9:09 AM on February 4, 2010 [1 favorite]
I always plug Css Tricks. His video series is excellent viewing - although he doesn't hit on HTML5 all that much there.
You might be too advanced for some of it, but take a look - he's an excellent teacher, and you're bound to find some of the screencasts worth watching.
Also, 24 Ways always seems to be on the cutting edge - so even some of the posts from the last couple of years should be worth reading.
posted by backwards guitar at 9:19 AM on February 4, 2010
You might be too advanced for some of it, but take a look - he's an excellent teacher, and you're bound to find some of the screencasts worth watching.
Also, 24 Ways always seems to be on the cutting edge - so even some of the posts from the last couple of years should be worth reading.
posted by backwards guitar at 9:19 AM on February 4, 2010
Dunno if this is too basic for you, but I'm halfway through a great article on Gizmodo about exactly what HTML5 is, why it's happening, and some of the current forks in the road. It's not exactly about how to code in HTML5, but it may still be relevant here.
posted by bingo at 10:19 AM on February 4, 2010
posted by bingo at 10:19 AM on February 4, 2010
Reset CSS to reduce most cross-browser rendering differences.
posted by kirkaracha at 11:22 AM on February 4, 2010
posted by kirkaracha at 11:22 AM on February 4, 2010
This is from a hardcore HTML guy who despises most things being done with Adobe Flash, but understands the place of Flash on the web. There are tons of thing you just cannot do with HTML/CSS/JS — vector animation, abstract shapes, live image processing, 3D — some things are in the works, but then you also need a decent GUI/application to write that in.
Don't bother learning HTML5, it's not relevant yet, half of what's in the spec is not implemented in any browser, part of it is implemented in Webkit, Firefox and Opera [betas and developer previews, and some features in stable version], but is inconsistent across browsers. It's slowly becoming relevant though.
If your business is in Flash by all means stay there. But try to look at your Actionscript skills as something broader than just Actionscript. Maybe experiment with HTML, CSS and JS in your free time.
You could build this in Flash. But can you build it in Javascript (with jQuery as an abstraction layer to aid with cross browser differences)?
(This example is pretty cutting edge, might want try something easier first ^_^)
posted by wolfr at 4:05 PM on February 11, 2010
Don't bother learning HTML5, it's not relevant yet, half of what's in the spec is not implemented in any browser, part of it is implemented in Webkit, Firefox and Opera [betas and developer previews, and some features in stable version], but is inconsistent across browsers. It's slowly becoming relevant though.
If your business is in Flash by all means stay there. But try to look at your Actionscript skills as something broader than just Actionscript. Maybe experiment with HTML, CSS and JS in your free time.
You could build this in Flash. But can you build it in Javascript (with jQuery as an abstraction layer to aid with cross browser differences)?
(This example is pretty cutting edge, might want try something easier first ^_^)
posted by wolfr at 4:05 PM on February 11, 2010
This thread is closed to new comments.
posted by Nothlit at 8:10 AM on February 4, 2010