The Creative Process

Ideas are like policemen — they're never around when you need them. Mattias Konradsson sketches a campaign to seduce the Muse.

Konradsson, Mattias. List Apart, A (1999). Design>Web Design

Cross-Browser Scripting with importNode()

While building a browser slideshow object for a demonstration on dynamically pulling image information from a web server, I ran into difficulty with the DOM-compliant approach I had envisioned. A two-day journey into the world of XML DOM support for web browsers lay between me and a satisfactory solution.

Holdener, Anthony. List Apart, A (2007). Design>Web Design>DHTML>Web Browsers

Cross-Browser Variable Opacity with PNG: A Real Solution

Periodically, someone tells me about the magic of PNG, how itÂ’s the ideal image format for the web, and that someday we'll all be using it on our sites instead of GIF. People have been saying this for years, and by now most of us have stopped listening. Sadly, flaky browser support has made PNG impractical for almost everything--but now, with a few simple workarounds, we can finally put one of its most compelling features to use.

Lovitt, Michael. List Apart, A (2002). Design>Web Design>Graphic Design

Cross-Column Pull-Out Part Two: Custom Silhouettes

The cross-column pull-out gave us a new technique for marking up a layout with a pull-out positioned between columns. Now we examine a variation of the technique for wrapping around the edges of a non-rectangular image positioned between columns. But first we need to update the original technique.

Frommelt, Daniel M. List Apart, A (2005). Design>Web Design>CSS

Cross-Column Pull-Outs

Print designers have long relied on the ability to wrap text around anything, most commonly around a picture centered between two columns. This design option has not been available for web designers ... until now.

Frommelt, Daniel M. List Apart, A (2004). Design>Web Design>CSS

CSS @ Ten: The Next Big Thing

CSS is ten years old this year. Such an anniversary is an opportunity to revisit the past and chart the future. CSS has fundamentally changed web design by separating style from structure. It has provided designers with a set of properties that can be tweaked to make marked-up pages look rightand CSS3 proposes additional properties requested by designers.

Lie, Hakon. List Apart, A (2007). Design>Web Design>CSS>History

CSS and Email, Kissing in a Tree

Despite prevailing wisdom to the contrary, you can safely deploy HTML emails styled with good old-fashioned CSS. If you're not content to roll over and use font tags in your HTML emails, read on.

Wyner, Mark. List Apart, A (2004). Design>Web Design>CSS>Email

CSS Design: Creating Custom Corners and Borders

In this article, we’ll show how customized borders and corners can be applied to fully fluid and flexible layouts with dynamic content, using sound and semantically logical markup.

Madsen, Søren. List Apart, A (2003). Design>Web Design>CSS>Semantic

CSS Design: Creating Custom Corners and Borders Part II

Part I showed how to create fluid, dynamic CSS layouts with customized borders and corners. Part II advances to the next level, extending the technique to work with more complicated backgrounds such as gradients and patterns.

Madsen, Søren. List Apart, A (2004). Design>Web Design>CSS

CSS Design: Custom Underlines

While web designers generally have a great deal of control over how a document should be presented, basic CSS doesn't provide many options for the style of underlines below the links on a page. But with a few nips and tucks, you can take back creative control of the way your links look.

Robertson, Stuart. List Apart, A (2004). Design>Web Design>CSS

CSS Design: Going to Print

One of the wonderful things about CSS is that it allows authors to create media-specific styles for a single document. We’re pretty used to styling for the screen, but thinking about other media isn’t a habit yet. And as all the “printer-friendly” links attest, our thinking about the print medium has been limited to recreating a document in a different way. Why bother, when the power to offer your readers a better view of your material in print is no further away than a well-structured document and a media-specific style sheet?

Meyer, Eric. List Apart, A (2002). Design>Web Design

CSS Design: Taming Lists

As early as July of 1999 I was pontificating on email lists about the virtues of style sheets. Some things never change. What has changed is how I think about CSS, and the underlying structure of (X)HTML to which it is applied. For example, I find that most pages on the web contain a menu of links in a navigation area. These are often marked up as a string of links, often in separate DIVs or paragraphs. Structurally, however, they are a list of links, and should be marked up as such. Of course the reason that we don’t mark them up in that way is that we don’t want a bullet in front of every link in our navigation area. In a previous article I outlined several techniques for using CSS to layout a web page. One of those techniques involved manipulating a list to display horizontally rather than vertically. In this article, I'll demonstrate how to use CSS to bring unwieldy lists under control. It’s time for you to tell lists how to behave, instead of letting them run wild on your web page.

Newhouse, Mark. List Apart, A (2002). Design>Web Design>CSS

CSS Drop Shadows

Much used, oft maligned but always popular, drop shadows are a staple of graphic design. Although easy to accomplish with image-editing software, they’re not of much use in the fast-changing world of web design … until now.

Villarreal, Sergio. List Apart, A (2004). Design>Web Design>CSS

CSS Drop Shadows II: Fuzzy Shadows

Takes standards-compliant drop-shadows to the next level by producing warm and fuzzy shadows.

Villarreal, Sergio. List Apart, A (2004). Design>Web Design>CSS

A CSS Redesign in Five Easy Pages

Building a standards-compliant redesign of ALA should have been easy. It wasn’t. The first problem was understanding how CSS actually works. The second was getting it to work in standards-compliant browsers. A journal of discovery.

Zeldman, Jeffrey. List Apart, A (2001). Design>Web Design>CSS

CSS Sprites: Image Slicing's Kiss of Death

Say goodbye to old-school slicing and dicing when creating image maps, buttons, and navigation menus. Instead, say hello to a deceptively simple yet powerful sprite-based CSS solution.

Shea, Dave. List Apart, A (2004). Design>Web Design>CSS

CSS Swag: Multi-Column Lists

If you want to present a list in multiple columns you’ll need to compromise. Choose your poison…

Novitski, Paul. List Apart, A (2005). Design>Web Design>CSS

CSS Talking Points

Selling your clients on standards-compliant design doesn't have to hurt. Kise's four-point CSS Selling Plan helps the medicine go down.

Kise, Greg. List Apart, A (2000). Design>Web Design>CSS

The Cure for Content-Delay Syndrome

It is perhaps the market forces driving web development projects that find us aligning ourselves with the lexicons of marketing and advertising rather than publishing. As a result, we have lots of “brand identity guidelines,” but not so many “style guides” (for content, at least). We have “strategists,” but no “commissioning editors,” and we more often “go live” than “publish.” Hence, we tend to first think “copywriter” when trying to get our content sorted, whereas very often an editor is the person we should be engaging. That’s not to say there aren’t editors in our industry—there are—but they tend to be a part of large online publishing projects after launch rather than a part of the development lifecycle from the beginning. (Somehow, we’ve become a kind of freak cousin of publishing, ignoring that industry’s expertise.) In many cases, an editor would be a great addition to our process as well as, in some cases, a better and more rational investment than a copywriter.

Ronalds, Pepi. List Apart, A (2008). Articles>Web Design>Writing

The Curse of Information Design

Information Architecture may be good for the web business, but Cohen thinks it is killing the web's subtler creative values.

Cohen, Scott Jason. List Apart, A (2001). Design>Web Design>Information Design

Daemon Skins: Separating Presentation from Content

There's more than one way to skin a website. New ALA contributor Mark Newhouse of iBlog demonstrates creative scripting techniques that give viewers and designers the control they crave.

Newhouse, Mark. List Apart, A (2000). Design>Web Design

A Dao of Web Design

For the last couple of years, for better or worse, my life has revolved more than a little around style sheets. I write software, tutorials, and guides for them; I've answered too many questions to count about them on newsgroups and via email; I've fought for their adoption with The Web Standards Project. And slowly I've come to understand web design entirely differently because of them, and to see a strong association between design and the Tao.

Alsopp, John. List Apart, A (2001). Design>Web Design>Theory

Deafness and the User Experience

Because of limited awareness around Deafness and accessibility in the web community, it seems plausible to many of us that good captioning will fix it all. It won’t. Before we can enhance the user experience for all deaf people, we must understand that the needs of deaf, hard of hearing, and big-D Deaf users are often very different.

Herrod, Lisa. List Apart, A (2008). Articles>User Experience>Accessibility>Audio

The Declination of Independence

The web is now recognized as a permanent fixture in our society. It's now a medium for designers, technologists, and shoppers alike. The term 'web designer' no longer carries such ominous tones to our non-technical friends, but rather shows that we are a legitimate workforce: part of the 'cutting edge' of our information society. You can now tell mom and dad you're a web designer, and they have some vague notion of what that means. They still have no clue how you can spend a solid 18 hours sitting in front of a computer working, but one miracle at a time, right?

Oeling, Brandon, Ryan Holsten and Michael Krishner. List Apart, A (2001). Articles>Web Design

Design Choices Can Cripple a Website

However compelling the message, however great the copy, however strong the sales argument… the way a page is designed will have a dramatic impact on conversion rates, for better or for worse.

Usborne, Nick. List Apart, A (2005). Design>Web Design