HTML for Beginners: 10 Ways to Learn to Code
Learning to code? Want to learn in a creative and personal way? To get you started let’s begin with the groundwork of HTML. We’ve rounded up resources, tools, and DIY’s to get schooled online even from the comfort of your favorite chair.
To get started with HTML check out the following resources:
1. HTML and CSS Book: If the thought of reading a computer book bores you, rest assured, THIS book is different. It’s packed with photos and diagrams that help visually teach code, including beautiful infographics for complex content. The HTML and CSS book is organized, color-coded and fun, making it a great resource to reference back to again and again.
2. Girl Develop It: When I began my journey to code, I was lucky enough to have stumbled upon GDI’s (Girl Develop It’s) local, Intro to HTML and CSS class. As a newbie, I was nervous going in, but quickly found GDI is an AWESOME way to learn code. With that initial class, I came away with my first website, and a network of like-minded and goal-oriented women. GDI promotes affordable programs to women, mentorship, and hands-on instruction—check out GDI’s local chapter’s to find a class near you!
3. Sublime Text 2: Dubbed as, “the text editor that you’ll fall in love with” and if those words don’t make you swoon, the bright colors and pristine interface will! Unfamiliar with a text editor? Well, if you’re learning to code this will become one of your most important tools. Programmers and developers use text editors to write and edit markup languages, like HTML and CSS. Download Sublime Text 2 here.
4. Shay Howe’s, Beginners Guide to HTML & CSS: A simple, 10 page intro on HTML and CSS, this will give you a good handle on the basics. Dig into the HTML and get to know it, live it, and breathe it. A solid HTML foundation will make CSS all the more fun! Don’t miss the section on Elements and Semantics it’s an excellent source for a few HTML elements and their meaning.
5. HTML5 Cheat Sheet: It’s just that, a CHEAT SHEET! Conveniently provided in PDF format, you can download and print this out for your personal use. The cheat sheets lists all of the tags that are currently supported, along with their description, attributes and support in HTML5—AWESOME!
6. HTML5 Please: Are you interested in knowing which features of HTML5 will work with the web browsers that are currently available? If you answered, “yes please” then bookmark this page—and be on the cutting edge of what new features are ready to use.
7. HTML5 Doctor: This is a great resource with real-world examples of what to use when. Many aspects of HTML appear to be nonsensical and inconsistent, via articles and the opportunity to ask questions, this site will be a quick fix in understanding the vast world of HTML, just be sure to check-up regularly!
8. Codecademy: As featured in, 10-Ways to Get Schooled Online. Codecademy truly is an interactive and motivating way to learn code. Begin with HTML, tap into CSS and work your way to Python. Codecademy provides do-it-yourself tutorials and try-what-you’ve-learned examples, to get you comfortable with code. If you’re looking for structure and step-by-step guidance, this tool is for you. Oh yeah, did we mention, it’s FREE!
9. W3C Markup Validator: If it’s broke, fix it! It’s important to check your markup and make sure everything works properly. The W3C (World Wide Web Consortium) has created this handy validator which detects bad code! Simply, enter your code or file, select the check button and voilà, the validator does the rest.
10. HTML: The Living Standard: Is a well designed document by the HTML spec authors know as, WHATWG. These spec authors are constantly working on this document and continuously maintaining the specification, to keep you on your toes! This is geared for those savvy with the web and applications.
Okay, soon-to-be-coders—get your keyboards ready! Remember to practice everyday, don’t give up, and channel your inner geek! Any other great HTML resources out there that we should know about? Share in the comment section below!