HTML Tutorials

Our latest posts have mostly been about design, so today we’re going full on code monkey with a cool CSS3 technique: Vignettes! The technique involves a few divs, a bit of simple CSS, and a whole lot of fun.

This is the newest HTML tutorial on the web. It was designed in an easy step by step format. Built into the tutorial is an HTML editor to try things as you learn.

If you’re confident with your CSS and HTML, it’s not hard at all to step up to the challenge of building a custom Wordpress theme. This overview shows the process of how my latest custom Wordpress theme was built from design concept through to completed theme. See how the static design is split up into the various Wordpress theme files, and discover how the simple PHP snippets can add that dynamic functionality of a blog.

I’ve recently been working on a design concept for a Wordpress theme as part of a personal project. In this walkthrough we’ll go through the process of converting the design concept from PSD document right through to completed HTML and CSS mockup, complete with clean and valid code, a few touches of CSS3 and some quick fixes to help out old IE6.

A great screencast that teaches you how to touch up a website in Photoshop and complete semantically correct HTML markup.

Tutorial on basic HTML scripting. Could also be used as a reference base.

An easy to understand break down of the components of a widgetized sidebar in Wordpress, and instructions on how to make your own using XHTML and CSS.

Part #2 of the PSD to WORDPRESS tutorial, in this tutorial learn how to convert the PSD to CSS ready for wordpress

While there are some quick & easy solutions for making our websites more usable, not everything can be made clear through standard analytics programs overnight. One way to accurately visualize how our visitors use our sites is through the use of Click Heatmaps.

It turned out to be really easy to use S3 like a giant, unlimited host, and I've been using it ever since for high-access, or heavy files like podcasts for FreelanceSwitch, images for blogs, and even for sending files to clients. In this tutorial I'll show you how with just Firefox you can turn S3 into your own personal content delivery network. It's super simple, even I could do it!