WordPress is easily one, if not the most, popular blogging platforms on the web. With the release of WordPress 3.x, the potential for what you can do with this open source software is limitless.

This technique intends to show you how to get your WordPress wielding the power of the future web, that being HTML 5.

---

Ingredients

• WordPress 3.x
• Your favourite HTML 5 compliant browser (e.g. Internet Explorer 9)

Directions

1. Setup WordPress on your server or host.
   • Note: You can setup a WordPress.com account, but you will require an paid add-on to really take advantage of this technique.Login to the administration panel.
2. Login to the administration section of your blog, using your web browser. 
   • 
3. On the left side of the page, click the Appearance heading. Then, click on Themes.
   • 
4. At the top of the page, select the Install Themes tab.
   • 
5. In the search box, type the “toolbox” and click search.
   • 
6. In the search results, you should see an theme called Toolbox. Click the Install link in the Toolbox item.
   • 
7. A dialog window should appear with a sample picture of what the theme looks like. Click on the Install Now button in the bottom right corner.
   • 

Et voila! Once the installation is done, you are done and ready to bring your blog into the future of the web. Try previewing your blog in HTML 5 by clicking the preview link.

Now, you are probably thinking “Man…HTML 5 looks like junk”. To that, I respond: “HTML was never why your site looked good in the first place. It was the CSS.”

Now you have an un-stylized theme that uses HTML 5 elements throughout your WordPress site. If you want to learn how to apply CSS to your WordPress blog, you should check out the WordPress codex that pretty much covers everything there is to cover about WordPress development.

Now, remember how we noted earlier that your free WordPress.com account wouldn’t take advantage of this technique? That is because, as of the time of this writing, you needed to pay a fee to use custom CSS.

Remember now, this only gives you the foundation to create your own HTML 5 WordPress site. There are some HTML 5 themes out there that already look good, and were built using this as the foundation and added some CSS 3 to really spice it up.

Looking forward to seeing more HTML 5 WordPress sites! Enjoy developing the future of the web.

Resources

• Toolbox Theme
• JustCSS Theme
• WordPress Installation Tutorial
• WordPress Theme Development Tutorial

This post also appears at http://david.wes.st

The hardest part about using a new technology, such as HTML 5, is getting to what features are available and the syntax. One way to learn how to use new technologies is to adapt your current development to help you use the technology in comfort of your own development environment. For .NET Web Developers, that environment is usually Visual Studio 2010.

This technique intends on showing you how to get HTML 5 Intellisense working in your current version of Visual Studio 2008 or 2010, making it easier for you to start using HTML 5 features in your current .NET web development projects.

Quick Note

According to the Visual Web Developer team at Microsoft, the Visual Studio 2010 SP1 beta has support for both HTML 5 and CSS 3. If you are willing to try out the bleeding edge update from Microsoft, then you won’t need this technique.

---

Ingredients

• Visual Studio 2008 or 2010
• Your favourite HTML 5 compliant browser (e.g. Internet Explorer 9)
• Administrator privileges, or the ability to install Visual Studio Extensions in your development environment.

Directions

1. Download the HTML 5 Intellisense for Visual Studio 2008 and 2010 extension from the Visual Studio Extension Gallery.
2. Install it.
3. Open Visual Studio.
4. Open up a web file, such as an HTML or ASPX file.
5. he HTML Source Editing toolbar should have appeared.
   1. 
6. (Optional) If it did not appear, you can activate it through the main menu by selecting View, then Toolbars, and then select HTML Source Editing if it does not have a checkbox beside it. (NOTE: If there is a checkbox, then the toolbar is enabled)
   1. 
7. In the HTML Source Editing toolbar, open up the validation schema drop box, and select HTML 5.
   1. 

Et voila! You now have HTML 5 intellisense enabled to help you get started in adding HTML 5 awesomeness to your web sites and web applications.

Optional – Setting HTML 5 Validation Options

At this point, you may want to select how Visual Studio shows validation errors. You can do that in the Options Menu. To get to the Options Menu…

1. In the main menu select Tools, then Options.
   1. 
2. In the Options window, select and expand Text Editor, then HTML, followed by selecting Validation.
   1. 

Resources

• HTML 5 Intellisense for Visual Studio 2008 and 2010 extenstion
• Visual Studio Extension Gallery
• Visual Studio 2010 SP1 Beta

This post also appears at http://david.wes.st