Creating the Photoshop Mockup
Category: Others > Photoshop      Posted: 23 Jun 09

We go back to a blank Photoshop document and re-create it. There is no HTML/CSS in this episode, just pure Photoshop work

Starry Night: 3D Background with the Parallax Effect
Category: Web Development > Other      Posted: 23 Jun 09

Using three layers of alpha transparent PNG files, we can can create a pseudo 3-dimensional looking background for a web page. This screencast covers h...

Creating a Three State Menu
Category: Web Development > Other      Posted: 23 Jun 09

Using a variation of the CSS Sprites technique, we can create a "three state" menu using only one image per menu item. This reduces the number of reque...

Tools of the Trade: The Mac Software I Use for Web Design
Category: Web Development > Other      Posted: 23 Jun 09

Before I get too far along in these screencasts, I thought I would introduce you a little to my working environment and explain the tools that I use. F...

Columns of Equal Height: Super Simple Two Column Layout
Category: Web Development > Other      Posted: 23 Jun 09

Forcing multiple columns to be of equal height is one of those tricky things in web design. In this screencast I'll show you a little trick around it. ...

Forcing Scrollbars: Eliminating "Horizontal Jumps"
Category: Web Development > Other      Posted: 23 Jun 09

In this screencast I talk about how to force vertical scrollbars onto websites. Without doing this, pages with centered content can appear to "jump" to...

Converting a Photoshop Mockup
Category: Others > Photoshop      Posted: 23 Jun 09

Conversion process of an Adobe Photoshop mockup of a website, into a real live CSS based website series.

Converting a Photoshop Mockup (part 3 of 3)
Category: Others > Photoshop      Posted: 23 Jun 09

I finish up the design in part three of this series on coverting an Adobe Photoshop website mockup into an actual HTML/CSS website. This one focuses on...

Converting a Photoshop Mockup (part 2 of 3)
Category: Others > Photoshop      Posted: 23 Jun 09

In part two of this series on converting a Photoshop mockup to an HTML/CSS Website I continue on with the header/menu section of the site. I change the...

Converting a Photoshop Mockup (part 1 of 3)
Category: Others > Photoshop      Posted: 23 Jun 09

In this first-ever video podcast, I start the conversion process of an Adobe Photoshop mockup of a website, into a real live CSS based website. This is...

Introduction to Firebug
Category: Web Development > Javascript      Posted: 06 May 08

Firebug is an essential Firefox extension for web designers and developers. You are able to quickly target any element on a page to see the markup, the CSS, the layout, and the DOM in an instant. Not only can you see all of this juicy information, you can edit and see the results directly in the brow...

CSS Formatting
Category: Web Development > Other      Posted: 01 Apr 08

Being organized and using good formatting in your CSS files can save you lots of time and frustration during your development process and especially during troubleshooting. The multi-line format makes it easy to browse attributes but makes your file vertically very long. The single-line format keeps ...