Best place to learn HTML5 & JavaScript

[Propheta Messias]

I'm having a hard time trying to find a good place to start. I want to learn how to use HTML5 & JavaScript.

Can anyone point me to any good books, websites or other resources that I can use? I want to start from scratch and with the very basics so I'm hoping for something focused more towards beginners.

Any help would be greatly appreciated.

[adam7288]

Start with HTML - learn how to code static, unchanging websites. Pretty soon you will want to change that page with user interaction - hence the need for javascript. I would absolutely recomend springing for a basic "For dummies" book about both. Learn CSS while you are at it, an essential component of HTML.

After you start practicing all of that, you will find raw javascript rather cumbersome. And then, my friend, you take a look at jquery. But you are about 1-2 years away from that. Happy programming young grasshopper.

[Phouchg]

W3C has it's own Wiki with some basic courses: http://www.w3.org/wiki/HTML/Training

Then there's Sitepoint Reference: http://reference.sitepoint.com/css (Firefox even has a search engine addon for this).

For debugging you can use Firebug addon for Firefox (among other things helps to correctly visualize the box model).

Finally, there's a truly useful thing: W3C validator. Like most code parsers, it often will get confused by subsequent errors but it definitely helps to write correct markup (which, I believe, is very important) and also to quickly find syntax problems.

[adam7288]

Forgot to mention - highly recomend using dreamweaver - why make your life harder?

[deactivated170812]

For HTML5 also look at Dive Into HTML5.

[threetonesun]

Forgot to mention - highly recomend using dreamweaver - why make your life harder?

:/

Dreamweaver is entirely unnecessary to learn either of these. Notepad++ for Windows, or Komodo Edit would be great, and both are free.

If you need to read some books, and don't mind reading online, check out Safari Books Online. For ~$20 a month you can read through any of their books. It's a good way to learn very quickly the basics of something new. Introducing HTML 5 by Bruce Lawson and Remy Sharp was a good intro to HTML 5 that I found. As noted above though, you'd probably want a good foundation in HTML 4 and CSS before digging into 5.

There's plenty of javascript books out there, although you could also learn jQuery first and then backfill your knowledge of javascript as you need it. jQuery has a pretty high knowledge : results ratio for beginners, that is to say you don't need to know much to really make some huge visual changes to a page.

[Blaze_Zewi]

Books, practice, practice, practice, and Youtube. That's how I learn it. But do skip those Youtube tutorial made by some kid who thinks he's smarter than you :)

[hotosega]

I'm reading a good book about HTML5 & Javascript at this moment. It's called Heads First HTML5 Programming and it's a pretty good book. It's not as static as the other programming books. It has a bit of humour in it.

http://shop.oreilly.com/product/0636920010906.do

http://www.amazon.com/Head-First-HTML5-Programming-JavaScript/dp/1449390544

[rajputwarrior]

:/

Dreamweaver is entirely unnecessary to learn either of these. Notepad++ for Windows, or Komodo Edit would be great, and both are free.

If you need to read some books, and don't mind reading online, check out Safari Books Online. For ~$20 a month you can read through any of their books. It's a good way to learn very quickly the basics of something new. Introducing HTML 5 by Bruce Lawson and Remy Sharp was a good intro to HTML 5 that I found. As noted above though, you'd probably want a good foundation in HTML 4 and CSS before digging into 5.

There's plenty of javascript books out there, although you could also learn jQuery first and then backfill your knowledge of javascript as you need it. jQuery has a pretty high knowledge : results ratio for beginners, that is to say you don't need to know much to really make some huge visual changes to a page.

IMO dreamweaver is the best text editor for coding sites in windows (though it has been a few years since i've developped anything in windows). color coding and auto completion is second to none IMO.

[threetonesun]

IMO dreamweaver is the best text editor for coding sites in windows (though it has been a few years since i've developped anything in windows). color coding and auto completion is second to none IMO.

Both Komodo and Notepad++ can autocomplete and do code coloring. They're also $0.

There's really no reason for someone working on their own to buy Dreamweaver. If the place you work at gets it, sure, it's not a bad editor by any means.

[rajputwarrior]

Both Komodo and Notepad++ can autocomplete and do code coloring. They're also $0.

There's really no reason for someone working on their own to buy Dreamweaver. If the place you work at gets it, sure, it's not a bad editor by any means.

does it do it with PHP? functions and all?

[mollick2]

Dreamweaver is great to use as an IDE but for learning it's too much. Especially because it has an auto complete feature, that really makes learning it harder. How else are you really gonna learn what tags to close. Dreamweaver still wants to close all my paragraphs and list-items. It also doesn't make you learn the full tag and attributes (sometimes it gives you attributes to use that are well depreciated). Even I catch myself inside a normal text editor writing shorthand tags expecting them to auto-complete. Honestly I think Dreamweaver is too cumbersome for someone that is just being introduced to web design/dev. The best way to learn to code is without any of the fancy tools.

Back on topic however, http://www.dontfeartheinternet.com/ is a great resource. Though its not a complete series yet, so its really not all encompassing, my roommate's been following their tutorials and seems to be getting the hang of it. Not sure it's HTML5 specific, but regardless XHTML or HTML at the end of the day it's all the same with a few extra or less details that you'll pick up along the way.

[Original Poster]

http://www.w3schools.com best place for any noobie fresh to the game ;D

Dreamweaver is great to use as an IDE but for learning it's too much. Especially because it has an auto complete feature, that really makes learning it harder. How else are you really gonna learn what tags to close. Dreamweaver still wants to close all my paragraphs and list-items. It also doesn't make you learn the full tag and attributes (sometimes it gives you attributes to use that are well depreciated). Even I catch myself inside a normal text editor writing shorthand tags expecting them to auto-complete. Honestly I think Dreamweaver is too cumbersome for someone that is just being introduced to web design/dev. The best way to learn to code is without any of the fancy tools.

Back on topic however, http://www.dontfeartheinternet.com/ is a great resource. Though its not a complete series yet, so its really not all encompassing, my roommate's been following their tutorials and seems to be getting the hang of it. Not sure it's HTML5 specific, but regardless XHTML or HTML at the end of the day it's all the same with a few extra or less details that you'll pick up along the way.

sorry but did you really just mention dream? get out of this forum -.- notepad is the way ..... if you are a real coder you use note pad xD

[Tekkerson]

http://www.w3schools.com best place for any noobie fresh to the game ;D

sorry but did you really just mention dream? get out of this forum -.- notepad is the way ..... if you are a real coder you use note pad xD

HEY YOU STOP IT!

http://w3fools.com/

Please don't go to w3schools... please don't.

Instead visit this high quality open-source html/js/etc document developer network maintained by professional/guru/enthusiast developers around the world. Hosted by the Mozilla company (even though Mozilla doesn't completely directly influence the content there)

https://developer.mo....org/en-US/docs

Common and highly technical questions can be found at:

www.stackoverflow.com

If you can't find the answer via the search to a particular problem, ask there. They reply really fast for an open community specially tailored for developers.

Here's also a section on HTML5 http://dev.opera.com/articles/view/1-introduction-to-the-web-standards-cur/#toc

General tutorials: http://code.google.com/edu/submissions/html-css-javascript/

[Original Poster]

HEY YOU STOP IT!

http://w3fools.com/

Please don't go to w3schools... please don't.

Instead visit this high quality open-source html/js/etc document developer network maintained by professional/guru/enthusiast developers around the world. Hosted by the Mozilla company (even though Mozilla doesn't completely directly influence the content there)

https://developer.mo....org/en-US/docs

Common and highly technical questions can be found at:

www.stackoverflow.com

If you can't find the answer via the search to a particular problem, ask there. They reply really fast for an open community specially tailored for developers.

Here's also a section on HTML5 http://dev.opera.com...ndards-cur/#toc

General tutorials: http://code.google.c...css-javascript/

your telling me no :o when the website putting it down looks like a 5 year olds blog? :o w3schools is good if you know nothing bout web design... i learnt the fundamentals off of it then moved on to different resources as soon as i understood the basic syntax I move on to neowin and got all you people to teach me :p

[Tekkerson]

your telling me no :o when the website putting it down looks like a 5 year olds blog? :o w3schools is good if you know nothing bout web design... i learnt the fundamentals off of it then moved on to different resources as soon as i understood the basic syntax I move on to neowin and got all you people to teach me :p

I'm not here to argue, I'm here to post for OP's best interest. I did nothing more but to show him proof that W3CSchools can be misleading and not the *best* site to learn from. If it worked for you then good for you. But again I'm just here to try to point the OP to some of the best learning sources out there.

[Kreuger]

I put my site in W3's test page and always had problems. One day I put their site through and it came back with problems for that. So I stopped relying on them quick.

[Original Poster]

I'm not here to argue, I'm here to post for OP's best interest. I did nothing more but to show him proof that W3CSchools can be misleading and not the *best* site to learn from. If it worked for you then good for you. But again I'm just here to try to point the OP to some of the best learning sources out there.

was not arguing! was trying to have a conversation and view another opinion :p more of a debate because i dont see your opinion and thought as invalid

[threetonesun]

I put my site in W3's test page and always had problems. One day I put their site through and it came back with problems for that. So I stopped relying on them quick.

To be fair, valid HTML has always been a bit of a dream. Valid XHTML, sure, you can call someone on that.

I agree with the above mention that w3schools is terrible though. I would definitely get a book on the basics of HTML, and then refer to the actual W3 spec when necessary.

[evo_spook]

Both Komodo and Notepad++ can autocomplete and do code coloring. They're also $0.

There's really no reason for someone working on their own to buy Dreamweaver. If the place you work at gets it, sure, it's not a bad editor by any means.

Dreamweaver should only be for those who have mastered creating html markup in notepad, pspad, etc.

w3schools.com is a good place to start

HEY YOU STOP IT!

http://w3fools.com/

Please don't go to w3schools... please don't.

Instead visit this high quality open-source html/js/etc document developer network maintained by professional/guru/enthusiast developers around the world. Hosted by the Mozilla company (even though Mozilla doesn't completely directly influence the content there)

https://developer.mo....org/en-US/docs

Common and highly technical questions can be found at:

www.stackoverflow.com

If you can't find the answer via the search to a particular problem, ask there. They reply really fast for an open community specially tailored for developers.

Here's also a section on HTML5 http://dev.opera.com...ndards-cur/#toc

General tutorials: http://code.google.c...css-javascript/

I say ignore this, start at w3schools, start easy and then work your way up, don't dive straight into the deep end, learn the basics first

[iuerg87yerg879e0rg9erugjer]

w3school is utter useless and obsolete in my opinion, there are so many other sites such as nettuts go really in-depth and explain the language 10xE^20 so much better.

secondly dreamwever is the anti-christ all ALL IDEs, anyone that uses it i send my deepest regards to, for windows i recommend using webMatrix by Microsoft, or expresso 2 and coda for mac.

[-KJ]

If you have money to spend, WeBuilder 2011 is pretty nice: http://www.blumentals.net/webuilder/

Just learned about it recently, and I like that it doesn't rely on Java and opens up quickly.

The only thing that bums me out is that it doesn't have plug-in support, so I can't use zen-coding in it.

[Propheta Messias]

I know this is a long time coming but thanks for all your help. I've had some health issues get in my way of starting sooner but I'm putting all your helpful and useful tips to use now. Thanks again!

[Ambroos]

You should also try www.codecademy.com - for Javascript and the very basics of HTML it's brilliant, probably the best you can get.