Skip Nav

How to Make a Website With HTML5 and CSS3

How to Code Your Own Website: The Next Steps

Congratulations, newbie-no-more, you've mastered the bare bones basics of HTML web development as covered in the last Teach Yourself Tech. Now what? In this resource roundup, take those coding skills to the next level by getting to know the new standards of the web — HTML5 and CSS3.

Step 1: Discover the World of HTML5
As a markup language built for a mobile world, HTML5 is the future of the Internet. Try accessing GeekSugar.com from a smartphone; the mobile version of the site, an entirely new format optimized for small touch screens, will appear — that's the power of HTML5.

  • Discover why HTML5 Rocks, but don't worry if you don't understand all of the terms just yet; we'll get to that later.
  • There's a lot this new HTML is capable of, like 3D graphics, offline viewing, and new audio/video tools. The Web Can Do That!? covers all the amazing features of HTML5, complete with cat memes.
  • To learn what HTML5 is all about and laugh along the way, look no further than Mark Pilgrim's Dive Into HTML5.

Learn the lingo, master the markup, and take your HTML5 and CSS3 skills for a spin after the break.

Step 2: Learn the Lingo
HTML5 uses real language in its tags like header, footer, section, and article . . . but it's not always that obvious. This quick vocabulary exercise cuts the confusion and makes coding much easier later on.

Step 3: Master the Markup
What's the best way to learn how to work on the web? Dive in head first! Literally, start with a header, then build the rest of your web page from scratch.

Step 4: Pretty Your Page With CSS3
Cascading style sheets define the look of that HTML document you're working on, and CSS3 is jam-packed with new features to beautify your site.

Step 5: Strut Your Stuff
Now you're ready to put your new HTML5 and CSS3 skills to work by building and designing your own blog theme.

  • Many of today's content management systems make it easy to create and upload a custom theme. We'd recommend WordPress — it's free, it has a great online community if you run into problems, and it provides this detailed guide to developing WordPress themes.
  • If you ever get stuck, turn to the HTML5 Doctor, a network of web developers that addresses implementation issues. The site even categorizes forums by element — head, sections, tables, text, etc.

But that's not all, folks; stay tuned to Teach Yourself Tech for more on the most sought-after web-development skills, like building web apps with JavaScript, Ruby on Rails, and PHP. Putting your lessons to the test? Share the website you've created in the comments below!

Latest Tech

Download our Halloween app!

Go to App Store
+