Article Archives

One of the things you run into when your blog becomes bigger, is that you need to cram more info into less space, to make it possible to display all the information you want to show. One of the things …

It was a long and grueling process, but I finally finished updating the entire video archive. Here are the improvements:

• Videos play on the web in Flash. From time to time I would get a note from someone either saying

…

What if you hosting provider calls you one day and tells you they had a catastrophic fire at their facility and every bit of data on their (your!) servers is gone!

It’s highly unlikely, of course, and it’s more likely …

Google Docs: Forms

This isn’t exactly breaking news, but I only just heard about it so I thought I’d share. The free service Google Docs allows you to build web forms from within it. It has a pretty limited feature …

I love the Coda Slider plugin for jQuery. I’ve used it recently to build a couple of tabbed “widgets”. One here on CSS-Tricks in the sidebar to show Script & Style links, Featured Posts, and Popular Posts. Just kind of …

UPDATE: Script & Style is closed, but an updated version of this article is now on David Walsh’s site.

Just a quick note that I wrote up a tutorial (with demo and download) on how to Automatically Generate a Photo …

WordPress was the clear winner in the most recent poll asking What is Your Favorite CMS?

I’m a bit surprised there weren’t more people commenting that WordPress isn’t really a CMS (which I disagree with). WordPress had more than …

Want More Sales? Become an Authority

This latest article from Search-This, Thinking Outside the SEO Box, is about small-guy eCommerce stores and what they really need to do to compete in the ever-saturated online store space. The main advice? …

I wrote an article for NETTUTS that was published today. It’s called Building a Better Blogroll: Dynamic Fun with SimplePie and jQuery. In it, I make up a “widget” for pulling in recent headlines from the Envato family of …

Finding Information: Factors that improve online experiences

As this site grows, my concerns about the findability of information grows. I feel like the navigation is fairly clear (although sub navigation is lacking). I have browseable archives and search, yet still, …

You guys are probably already aware of the Eden and their family of kick ass tutorial sites (e.g. NETTUTS, PSDTUTS, etc.). They also run the site FlashDen, which is a marketplace for Flash components. With your FlashDen …

When creating a web form, one of the many choices you must make is how you are going to align your labels with your inputs. This is not a trivial decision, as this placement affects the readability/usability of your form, …

I always liked the idea of having a community links section on websites. Lots of sites in this genre have that and I think it’s great. The driving purpose behind a tutorial site like this is helping people learn and …

Favorite Design-Related Sites of 21 Designers

Steven Snell of Vandelay Design launched a brand new site called Designm.ag which is “articles and resources for designers”. I participated in a group interview post where a bunch of designers list some of …

Anchor links (<a>’s) by default have a dotted outline around them when they become “active” or “focused”. In Firefox 3, the color is determined by the color of the text. I believe in previous versions and in some other browsers …

Working on a website that you need others to see, but not the whole world? Password protecting a website (or a sub directory within a website) is actually a pretty easy thing to do.

.htaccess file
AuthType Basic
AuthName "restricted …

Bit.ly

URL shortners have been around for a while, so it’s nice to see there is still innovation being done. Bit.ly offers all the standard features of a URL shortner, but includes compelling new features like click/referral tracking, automatic page …

Over the last few weeks, I have been been doing a video screencast series on Designing for WordPress. It is a three-part series which covers downloading and installing WordPress on a server all the way to a completed theme.

Part …

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. …

Shirts for Coders

A collection of HTML/CSS T-Shirts. Some are funnier than others… I do like the XHTML one =) I did a roundup of CSS shirts a while ago too.

BgPatterns

As far as these “generators” go, …

If web pages were made out of wood, the grain would be running up and down. Vertical is the natural flow of web layout. When page elements reach the right edge of the browser window and go over, the flow …

The areas inside of regular ol’ HTML image maps support the title attribute which makes regular tooltips possible. Sometimes the default browser tooltips just don’t cut it, especially with their built in delays.

My favorite package for doing fancy tooltips …

ID’s and Classes are “hooks”

We need ways to describe content in an HTML/XHTML document. The basic elements like <h1>, <p> and <ul> will often do the job, but our basic set of tags doesn’t cover every possible type of …

Best of June 2008

Noupe with another very nice monthly roundup of good design-y stuff around the web last month. I like these giant monthly roundup posts. Gives a good monthly goal of trying to write things that are worthy …

There is a new poll in the sidebar folks. This one is about Content Management Systems (CMS). There was a pretty good comment thread going a little while ago which sparked the idea for this poll.

I’ve always been a …

It would be fair to call Markup Factory a CMS (Content Management System), but that would be cutting it short. Markup Factory is much more that, but be scared or think for a moment that it’s “over your head”. It’s …

Today is the 232^nd birthday of the United States and the 1^st birthday of CSS-Tricks!

Been a great year! This blog and this community have helped me grow tremendously. I’m sure the next year will be even better …

This is a hot time in the world of browsers. Despite a rocky morning, Firefox 3 got over 8 million downloads when it was released. It’s up to over 24 million now. I bet many of you are amongst these …

Students: Are you going to be employable?

Andy Rutledge’s article The Employable Web Designer is about how schools may not be properly preparing students with actually employable web skills:

These students are worried that they’ll emerge from school without marketable …

Surprising results again, at least for me. “Don’t Care – As long as there isn’t a standards war” was actually in the lead for a little while, but was ultimately beat out by “XHMTL 2“.

I …

Why a CMS?

I was recently criticized that my sites weren’t dynamic, and that no one would hire me because everyone wants a dynamic site. Well, the people I’d be targeting will know nothing about computers, thats why they need …

Faux Absolute Positioning

Always interesting to see new techniques for layout.

With faux absolute positioning, we can align every item to a predefined position on the grid (as with absolute positioning) but items still affect the normal flow and—thanks …

Many of us have many “homes” on the interwebs. Personally I use Twitter, Flickr, ScrnShots, and Facebook. These web services are cool enough to offer ways to interact with them and pull data out of them without even necessarily visiting …

It blows my mind that phpBB doesn’t come with RSS feeds for forums. The new v3 is incredibly nice in so many other ways, it seems like it would have been a trivial addition for such a talented dev team. …

This post was co-authored by Chris Coyier and Tim Wright of CSSKarma

A traditional calendar is a grid of numbered boxes on a page. As a web designer, you might go right for a table, and I wouldn’t fault you …

Abstraction is an important concept in any language. You can think of CSS as a way of abstracting the design away from the content of a site. This makes the code for both much easier to read, understand and maintain. …

Enkoder

Worried about putting your email address right out in the open for all the world’s spam bots to see? Enkoder will obscure it through javascript, yet be a perfectly useable link for everyone else. I tried to include mine …

Well I’m not sure if it’s a SECRET, but it’s certainly neat and I don’t think they publicize it.

Basically it’s a URL you can hit which will create a perfect sprite-ready PNG graphic of the text you include in …

A page element with relative positioning gives you the control to absolutely position children elements inside of it.

To some, this is obvious. To others, this may be one of those CSS “Ah-ha!” Moments. I remember it being a …

Disappearing Background Graphics

Paul Smith posted about a weird CSS problem he noticed, disappearing background graphics. To quickly summarize, sometimes a DIV which is defaulting to the full width of the browser window, which also has a background image, …

Tim Wright from CSSKarma has taken my Contact Form and done some cool stuff to it. For one thing, the design is way stripped down so if you are looking to “start from scratch” with your form design, you would …

To Photoshop, or Not To Photoshop

37 Signals: We don’t need Photoshop, we go right from sketches right to HTML.
Jeff Croft: Well, you have an established aesthetic which makes that possible. My clients tend to need …

jQuery UI version 1.5 was just released, and it’s going to be a big one. For us designers and CSS coders, here are a couple of major highlights:

• Class transitions (morphing): $(“div”).addClass(“green”, “slow”). So now instead of being able to

…

If you have worked much with CSS opacity, you know that one of the most frustrating things about it is that by setting it on any page element, it forces it child elements to be transparent also. I …

A few weeks ago I shared my CSS “Ah-ha!” Moment and asked others to share theirs. It was lots of fun hearing what those moments were for people. I wasn’t surprised to hear the CSS Zen Garden come up very …

Web Designer Diary

I (literally) Stumbed Upon this video of a web designer working on a website. It goes from a blank page in Photoshop to a complete and coded design in about 2:15.

 …

Band Website Template (now

We are going to create a web page that is formatted specifically for the iPhone (but would presumably be good for other mobile devices as well). This web page will dynamically fill itself with content from any RSS feed that …

Anyone who has ever worked with Flash on the web has likely come across the fact that embedding flash into a web page is usually no walk in the park. The code that Flash gives you to embed is something …

Designer / Not a Designer

I stumbled upon this hilarious animated GIF movie of a non-designer talking to a designer.

CushyCMS

Everybody and their brother is talking about CushyCMS lately. Probably because it’s brilliant. It is a service …

I’m calling this Part 2, because last week I began this adventure over on Tutorial Blog where we first designed a unique contact form:

Photoshopping a Unique Contact Form

Here we are going to pick up where that left off …