Using Definition Lists: Question and Answer Formatting

There are two big differences between unordered lists and definition lists. One, there are two different elements that belong in a definition list: dt’s & dd’s. In unordered lists, all you have is li’s. Two, the only default styling applied to definition lists is a bit of a left-margin to the dd elements — no bullets or other strange positioning to fight. Having two different tags to work with is what makes definition lists valuable.

Coyier, Chris. CSSnewbie (2008). Articles>Web Design>Information Design>CSS

404 Page on a Static Site

Here’s a very quick, but very useful trick. You can catch 404 errors (page not found) on a static site and serve up a custom 404 page with a one-liner in your .htaccess file.

Coyier, Chris. CSS-Tricks (2008). Design>Web Design>User Centered Design

Converting a Photoshop Mockup (Part 1 of 3)

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.

Coyier, Chris. CSS Tricks (2009). Articles>Web Design>Video>Screencasts

Common Sense SEO (Search Engine Optimization) Checklist

I don’t “really” know anything about SEO. What I do know is the folks at Google and other big search engines are just human beings like us who have created and constantly tweak the search algorithms. Their goal is to give us what we want when searching, the best possible websites relevant to what we are searching for. So let’s set aside all the fancy technical stuff and just use some good ol’ common sense.

Coyier, Chris. CSS Tricks (2009). Articles>Web Design>Search Engine Optimization

Build Your Own Social Home!

JSON (JavaScript Object Notation) is what all the hip applications are serving up these days with their API’s as an alternative to XML. The cool part about JSON is that you don’t need to parse it in the same way you do XML. That data you get from a JSON call comes back as an object all ready-to-rock and let you do stuff with it. So here's the jQuery code to pull in and append all data from Flickr, Twitter, and Scrnshots all onto one page.

Coyier, Chris. CSS Tricks (2008). Articles>Web Design>Server Side Includes>Ajax

Why People Still Use IE 6 

Internet Explorer 6 is always a hot subject of debate. We’ve talked about it here many many times. The forums are full of folks trying to troubleshoot it. The CSS support is problematic and the JavaScript support is proprietary nonsense. The conversation is heating up a little hotter than usual lately, as major companies are starting to pull support for it. I thought I would start the conversation by covering the reasons I think people still use this browser.

Coyier, Chris. CSS Tricks (2008). Articles>Web Design>Standards>Web Browsers

Introduction to jQuery 

The popular JavaScript library jQuery is an amazing way to extend the design possibilities of your site beyond what CSS can do. But luckily, if you are already comfortable with CSS, you have a huge head start in jQuery! This is a very basic introduction to including jQuery on your web page and getting started writing a few functions.

Coyier, Chris. CSS Tricks (2008). Articles>Web Design>Interaction Design>Screen Captures

Intro to jQuery 2 

Starting off where we left off last time, we continue exploring the possibilities of jQuery. We revisit some of the old functions and make them do some smarter things. We explore a simple variable and an IF/ELSE statement. Then we look at the AJAX-y .load() function, the CSS function, and then finish off by writing out own custom function and going over how that layer of abstraction can help us keep our code clean. Semantics counts in JavaScript too!

Coyier, Chris. CSS Tricks (2008). Articles>Web Design>Interaction Design>Screencasts

jQuery Part 3 – Image Title Plugin 

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.

Coyier, Chris. CSS Tricks (2009). Articles>Web Design>Interaction Design>Screencasts