Thumbnail for #91: The WordPress Loop

#91 The WordPress Loop

Running Time: 31:15

There is no shortage of documentation on WordPress’ famous content-spewing structure, but I still feel like there is more confusion and mystery surrounding “The Loop” than there should be. In this screencast I try and explain what it is, how …

Watch the Screencast
Thumbnail for #90: Simple TextMate Tips

#90 Simple TextMate Tips

Running Time: 20:52

TextMate is a mac-only code editor. Sorry to all the PC users this time around. If you’ve been watching these screencasts for a long time, you know I used to mostly use Coda. Since I’ve been working a lot more …

Watch the Screencast
Thumbnail for #89: Organizing a Photoshop Document

#89 Organizing a Photoshop Document

Running Time: 19:09

If you are like me, you are both guilty of seriously unorganized Photoshop documents and appreciate well organized ones. The disorganization isn’t intentional, it’s just born of (if you’ll pardon the likely-inaccurate cliché) being in right-brained creative mode and caring …

Watch the Screencast
Thumbnail for #88: Intro to Compass/Sass

#88 Intro to Compass/Sass

Running Time: 29:28

Ask a bunch of designers what they wish CSS could do that it can’t now, and you’ll get a big list that reads much like the list of features for the Compass/Sass framework. If you are like me, you don’t …

Watch the Screencast
Thumbnail for #87: Moving Up with MAMP

#87 Moving Up with MAMP

Running Time: 23:30

Working locally with MAMP is awesome, but what about when you need to take that site live? Last time we got a version of WordPress installed locally, now we’ll take that local version and move it to a real live …

Watch the Screencast
Thumbnail for #86: First Moments with MAMP

#86 First Moments with MAMP

Running Time: 11:38

I’m way behind the times on this one, but until recently, I have never really developed locally. Everything I did was “going commando” and working directly on servers. The situation arose where I really needed to, so now I have …

Watch the Screencast
Thumbnail for #85: Best Practices with Dynamic Content

#85 Best Practices with Dynamic Content

Running Time: 31:00

One of the articles I updated during “May is Maintenance Month” was an article about dynamic content. The idea was a simple website where clicking a link would fade out the existing content and fade in new content that it …

Watch the Screencast
Thumbnail for #83: Thoughts on SEO

#83 Thoughts on SEO

Running Time: 39:46

Fair warning: more rambling than usual. Listen to my thoughts about SEO. What I think I know is that SEO is a series of fairly obvious best practices. A SEO service that helps you with those things can be good, …

Watch the Screencast
Thumbnail for #82: CSS Image Switcher

#82 CSS Image Switcher

Running Time: 12:20

Roll over a link, watch the image above change. That’s what we build in this screencast, only we don’t use any JavaScript to do it. The trick is some simple z-index switching on hover and a bit of absolute positioning.…

Watch the Screencast
Thumbnail for #81: AJAXing a WordPress Theme

#81 AJAXing a WordPress Theme

Running Time: 42:23

Watch me bumble my way through adding AJAX functionality to a WordPress theme. The idea is that any internal link on the site will load into the main content area without requiring a page refresh, including search. Not always the …

Watch the Screencast
Thumbnail for #80: Regarding Wheel Invention

#80 Regarding Wheel Invention

Running Time: 19:09

A couple needs a photo gallery for their wedding, where everyone can browse and upload their own photos from the wedding. Beginner developer: I know of some great software we can use, give me a couple of days. Skilled developer:

Watch the Screencast
Thumbnail for #78: On Web Advertising

#78 On Web Advertising

Running Time: 45:19

In this screencast I discuss online advertising. What it is, how it works, and why it isn’t evil (except when it is). I talk about my experiences, the different services out there and the ones I use. Advertising is a …

Watch the Screencast
Thumbnail for #77: Styling an Individual Article

#77 Styling an Individual Article

Running Time: 41:15

The idea of “art directing” posts is very popular lately. It’s the idea of applying unique styling to an article on the web in the way that print designers uniquely style articles for, say, a magazine. This is more than …

Watch the Screencast
Thumbnail for #76: A Tour of jQuery on a Live Site

#76 A Tour of jQuery on a Live Site

Running Time: 38:33

I’m busy, you’re busy, we’re all busy trying to meet deadlines and get things done in this crazy web world. I love learning new technologies when I can, but I’m the first to admit that I reach for tools that …

Watch the Screencast
Thumbnail for #75: How Not To Design a Checkout

#75 How Not To Design a Checkout

Running Time: 11:17

You’ll have to forgive me here folks, this isn’t a very constructive screencast. I was frustrated at the crappy checkout process for a software product I was trying, so I thought I’d screencast it as a lesson to us all …

Watch the Screencast
Thumbnail for #74: Editable CSS3 Image Gallery

#74 Editable CSS3 Image Gallery

Running Time: 42:02

We build a pretty typical image gallery design pattern, a grid of images that pop up larger when clicked. But this image gallery page makes use of hot semantic HTML5 markup, loads of visual treats with CSS3 and jQuery, and …

Watch the Screencast
Thumbnail for #73: Building a Website (3 of 3): WordPress Theme

#73 Building a Website (3 of 3)

Running Time: 50:59

In part 3 of this series, we take the HTML and CSS that we have already created for this design, and convert it into a WordPress theme. We start with a completely “blank” WordPress theme, then take different parts of …

Watch the Screencast
Thumbnail for #72: Building a Website (2 of 3): HTML/CSS Conversion

#72 Building a Website (2 of 3)

Running Time: 01:11:10

In part 2 of this series, we begin the HTML/CSS conversion of the Photoshop mockup we created in part one. We start with a very skeletal project framework. Then we take a look at the Photoshop file layer organization. Then …

Watch the Screencast

Free Video Courses

Video Course (2015)

Everything You Need To Know About SVG

Using SVG can be very simple, but if you start digging in, there is a lot to know about SVG. In his series you're going to learn why SVG is such an important part of building websites. From why SVG is useful and how to get your hands on it all the way to implementing it as a system and fancy stuff like animating it.

Go to Course →