CSS-Tricks Screencasts show

CSS-Tricks Screencasts

Summary: CSS-Tricks Screencasts is focused on showing you tips, tricks, techniques about web design. Code samples can be extremely helpful, but sometimes it is even more helpful to watch someone as they code. In CSS-Tricks Screencasts will show you real live CSS and HTML code being written and tested right on the screen. Topics will vary but will always center around design and usability.

Join Now to Subscribe to this Podcast

Podcasts:

 #71: Building a Website (1 of 3): Photoshop Mockup | File Type: video/mpeg | Duration: 59:50

This is the start of a three-part series on building a website. This will be a real website for a musician friend of mine, who's website I happen to ruin during a routine WordPress upgrade. In part 1, we start from absolute scratch in Photoshop, with just a few provided resources from the client. We design the homepage and skin for the site, according to new needs that the client has, the feel he wants to project, and keeping true …

 #70: Random Pet Peeves | File Type: video/mpeg | Duration: 30:55

I just randomly go through some little annoyances and gripes I have with everything from OS X to Photoshop to WordPress to CSS. I thought of about 5 more the second I was done, but I’ll spare you!…

 #70: Random Pet Peeves | File Type: video/mpeg | Duration: 30:55

I just randomly go through some little annoyances and gripes I have with everything from OS X to Photoshop to WordPress to CSS. I thought of about 5 more the second I was done, but I'll spare you!…

 #69: First Ten Minutes with TypeKit | File Type: video/mpeg | Duration: 13:42

I got the invite from TypeKit, signed up, and had beautiful custom fonts rocking my page in just a few minutes. I’ll show you the entire process from start to finish, as well as touch on the advantages and disadvantages.…

 #69: First Ten Minutes with TypeKit | File Type: video/mpeg | Duration: 13:42

I got the invite from TypeKit, signed up, and had beautiful custom fonts rocking my page in just a few minutes. I'll show you the entire process from start to finish, as well as touch on the advantages and disadvantages. Links from Video: View Demo …

 #68: Think Geek Background Fade Technique | File Type: video/mpeg | Duration: 22:19

This video demonstrates the technique seen on the Think Geek 3.0 site. The bottom of the site has a design of a bunch of robots and as the screen is scrolled to the bottom, the color fades to black and …

 #68: Think Geek Background Fade Technique | File Type: video/mpeg | Duration: 22:19

This video demonstrates the technique seen on the Think Geek 3.0 site. The bottom of the site has a design of a bunch of robots and as the screen is scrolled to the bottom, the color fades to black and the pattern turns into zombies. We recreate this from scratch with their graphics, and then flop them out for our own. Links from Video: View Demo Download Files …

 #67: jQuery Part 3 – Image Title Plugin | File Type: video/mpeg | Duration: 33:56

This video focuses on taking an already existing idea and code and turning it into a jQuery plugin. In this case it helps keep our code as semantic as it can be, and with JavaScript off, degrades nicely. We cover …

 #67: jQuery Part 3 – Image Title Plugin | File Type: video/mpeg | Duration: 33:56

This video focuses on taking an already existing idea and code and turning it into a jQuery plugin. In this case it helps keep our code as semantic as it can be, and with JavaScript off, degrades nicely. We cover the syntax of creating a plugin, show off the cool chain-ability of jQuery, and show how to make the plugin versatile and expandable. Links from Video: View Demo Download Files Part 1 Part 2 …

 #66: Table Styling 2, Fixed Header and Highlighting | File Type: video/mpeg | Duration: 26:26

Just a couple of quick tricks, from scratch, on coding up tables. We use the proper semantic tags for a table header and then set it to a fixed position so when scrolling the table the header is always visible. …

 #66: Table Styling 2, Fixed Header and Highlighting | File Type: video/mpeg | Duration: 26:26

Just a couple of quick tricks, from scratch, on coding up tables. We use the proper semantic tags for a table header and then set it to a fixed position so when scrolling the table the header is always visible. Then we implement row AND column highlighting with a bit of semi-clever JavaScript. Links from Video: View Demo Download Files …

 #65: Advanced Uses for Custom Fields in WordPress | File Type: video/mpeg | Duration: 47:48

More than any other single feature, what makes WordPress a CMS (as opposed to just a blogging platform) is custom fields. Custom fields are chunks of data that travel along with posts and pages in key/value pairs. This data can …

 #65: Advanced Uses for Custom Fields in WordPress | File Type: video/mpeg | Duration: 47:48

More than any other single feature, what makes WordPress a CMS (as opposed to just a blogging platform) is custom fields. Custom fields are chunks of data that travel along with posts and pages in key/value pairs. This data can be pulled out and used in your templates as you choose, allowing for all kinds of smart and interesting things to be done. Links from Video: The Codex: Custom Fields …

 #64: Building a Photo Gallery | File Type: video/mpeg | Duration: 23:10

This photo gallery will automatically build itself from a directory of images, including sub-directories and the images inside them. Images open in a nice looking jQuery lightbox. Links from Video: Demo ImgBrowz0r prettyPhoto jQuery plugin …

 #64: Building a Photo Gallery | File Type: video/mpeg | Duration: 23:10

This photo gallery will automatically build itself from a directory of images, including sub-directories and the images inside them. Images open in a nice looking jQuery lightbox. Links from Video: Demo ImgBrowz0r prettyPhoto jQuery plugin …

Comments

Login or signup comment.