The ALA Primer: A Guide for New Readers
Issue № 223

The ALA Primer: A Guide for New Readers

If you’re going to build a house—or a website—you need the right tools. A List Apart offers hundreds of articles on design, markup, style, accessibility, usability, and more. We’ve selected a few that you might want to start with. (Think of this guide as one of those reassuring brochures from Lowe’s or Home Depot, but about websites instead of ceramic tile.)

Article Continues Below

Note: A List Apart publishes intermediate and advanced articles written for web professionals, so we assume familiarity with HTML, CSS, and concepts like usability and accessibility. If you’re looking for introductory articles, hold on for part two of this series, in which we’ll recommend resources for beginners.

Laying the foundation#section1

If your house’s foundation is good, the house will stand for years despite the changing world around it. So, too, with websites. Here are a few of the articles that detail the theories, concepts, and practices on which much of the modern web is built.

Design theory #section2

John Allsopp’s “A Dao of Web Design,” is foundational because it provides an enlightened look at what web design was, what it could be, and how designers and developers could let the web be the web.

Curt Cloninger’s “Usability Experts are from Mars, Graphic Designers are from Venus” addressed the developing rift between usability experts and graphic designers in the early days of the web. This article and others like it blunted the sharp edges of controversy by encouraging visual designers and usability experts to collaborate on beautiful, usable sites.

Standards advocacy#section3

In 2001, ALA publisher Jeffrey Zeldman wrote “From Table Hacks to CSS Layout: A Web Designer’s Journey,” a summation of his (and his friends’) foray into standards-based design. This article was important because it championed the concept of separating style and content with CSS, HTML (and later XHTML) and the DOM. Along with other articles on the subject, it inspired hundreds of designers to consider standards-based design.

In 2001, Zeldman further discussed the importance of standards-based, accessible design in two more articles: “To Hell with Bad Browsers” and “Why Don’t You Code for Netscape?”. Both articles may seem technologically outdated, but their core theories about the importance of web standards and accessibility are still relevant.

Layout and style#section4

Mark Newhouse’s “CSS Design: Taming Lists,” was a visionary article on how to style lists for use as navigation. This topic would be extensively elaborated on and refined by other designers such as Dan Cederholm.

Suckerfish Dropdowns,” by Patrick Griffiths and Dan Webb was one of the first articles to show designers how to create CSS dropdown menu systems, a feat that was previously possible only through the use of extensive JavaScript.

Alternative Style: Working with Alternative Style Sheets,” by Paul Sowden was crucial in the advancement of standards-based design. It introduced and promoted style switching as a tangible practice, while helping to further illuminate (by example) the need for accessibility in our web designs.

Few names in modern web design are more recognizable than Eric Meyer’s. A pioneer in the realm of CSS, Eric has preached from the pulpit about CSS and standards-based design since the pulpit was built. His 2002 article, “CSS Design: Going To Print,” explained how ALA version 2 addressed the need to send a well designed page to the printer.

If walls could talk#section5

Once the foundation is laid, it’s time to frame the walls. A List Apart publishes around 50 new articles per year, so there’s no shortage of articles to help you build the structural walls of your site. Here are a few we think every web designer should read, print, and store in a safe, dry place.

Page layout and design#section6

  • In Search of the Holy Grail,” by Matthew Levine. Three-column fluid layouts within a standards-based design are among the most difficult to achieve. As a result, they have been dubbed the Holy Grail of web design. Numerous methods have been developed to address this design problem, but sacrifices are common in employing it. Matthew Levine produced perhaps the most compact, unobtrusive version of this process to date.
  • Exploring Footers,” by Bobby Van Der Sluis. Primarily geared towards footer positioning, this article outlines methods for improving the positioning and handling of footers and other elements with CSS.
  • Elastic Design,” by Patrick Griffiths. Patrick explores the process of elastic design in one complete package covering type, layout, and image handling.
  • Flash Satay: Embedding Flash While Supporting Standards,” by Drew McLellan. This article showed us how to embed Flash elements and still be able to call ourselves “standards compliant.” For those of us who err on the side of obsessive compulsive, it was a good thing.

Applying style#section7

  • Invasion of the Body Switchers,” by Andy Clarke and James Edwards. This article took the powerful style switching technique introduced by Paul Sowden in 2001 and enhanced it to give the designer and user more control.
  • The Perfect 404,” by Ian Lloyd. This great little piece explored the method of creating custom 404 pages for commonly encountered problems.

Better living through server-side code#section8

  • A Better Image Rotator,” by Dan Benjamin. This 2004 article was a follow up to Dan’s earlier article, “Random Image Rotation.” In this piece, Dan introduced a revised method of image rotation using PHP that allows the use of alt attributes and specific URLs for each image.
  • URLs URLs URLs,” by Bill Humphries. This article shows how to transform CGI-generated URLs into meaningful addresses using Apache.
  • How to Succeed with URLs,” by Till Quack.  This addendum or add-on helped us to accomplish the same process written about in “URLs URLs URLs,” using PHP.
  • Slash Forward (Some URLs are Better Than Others),” by Waferbaby. Another great in the web design world, Waferbaby’s 2002 article helped us consider the structure of our links and the importance of the trailing slash.

Worthy of special mention#section9

A List Apart has been lucky enough to host articles by some of the best designers in the web industry. Here are a few written by designers who went on to change the web.

Douglas Bowman’s “Sliding Doors of CSS Part I and Part II” introduced us to the process of creating elegant navigation and other interface elements with semantic markup. This method has popped up on countless websites, and Doug’s gone on to do too many good things to list.

CSS Sprites: Image Slicing’s Kiss of Death,” by Dave Shea, gave us a whole new way to handle rollovers via CSS, allowing us to ditch image slicing techniques left over from table-based design. I don’t think there’s a standards-based designer out there who isn’t familiar with Dave Shea and his incredible project, the CSS Zen Garden.

Another duo of tremendous articles from Dan Cederholm—creator of Simple Bits and author of several wonderful books—were printed in ALA in 2004. “Faux Columns” breaks down the process of simulating columns through a repeated background image. “Mountaintop Corners” explores the process of creating better-rounded box corners with images and CSS.

Raise the roof#section10

The final major step in the house construction process helps us get in out of the rain. Here are some of the ALA articles that, while they don’t deal with structural and stylistic necessities, do matter in the end.

Graphic design and typography#section11

  • The Bathing Ape Has No Clothes (and other Notes on the Distinction between Style and Design),” by Adam Greenfield. This article is in the running for the longest article name award at ALA. It speaks volumes about the differences between design and styling.
  • Good Designers Redesign, Great Designers Realign,” by Cameron Moll. Another superb article by a well-known designer, this call to realign websites instead of redesigning them is persuasive and to the point.
  • The Trouble with Em n En (and Other Shady Characters),” by Peter K. Sheerin. Minding your P’s and Q’s is one thing, but do you know your ems and ens? Sheerin provides a definitive guide to web typography. This article can help designers to get a little more of a grip on their typography skills.
  • Reading Design,” by Dean Allen. Allen speaks out about the need for designers to understand the material they are designing; to render their ideas clearly based on an in depth knowledge of the product / project they are working on. His list of things a non-illiterate designer must know is insightful.

Business#section12

  • Cheaper Over Better: Why Web Clients Settle for Less,” by Adam Schumacher. Schumacher’s reassuring article helps us understand why clients sometimes settle on cheap over good despite our winning solutions.
  • The Four-Day Week Challenge,” by Ryan Carson. The ultimate dream is to hang out your little design shingle, set your work hours and do it your way. Ryan Carson provided his methods for mastering the four-day workweek.

State of the industry#section13

And from the saving-the-best-for last department, Joe Clark’s 2006 article, “To Hell with WCAG 2,” is a scathing diatribe on the Web Accessibility Initiative’s inability to get out of their own way. The article provides a deep look into the problems facing accessibility standards today and describes Joe’s plans to do something about it.

Home sweet home#section14

We’ve laid the foundation, assembled the walls, and crowned the whole thing with a shiny new roof. Our house is complete… or is it?

With eight years of content on web design best practices stacked up in our archives, we don’t expect this article to serve as the definitive guide to A List Apart, but we hope it helps new readers find their way. While we’re at it, a question to our longtime readers: what articles would you recommend to beginning designers and developers?

And yes…we do know that there are resources outside of our magazine. Stay tuned for part two of this series, in which we’ll recommend a whole slew of starting points and resources that don’t live on our own servers.

17 Reader Comments

  1. I’ve just recently moved from the University sandbox to a “real job” and discovered I know nothing (or close to it) particularly as I had never focused on web development. I was lucky in that my boss has a selection of brilliant books I’m starting to make my way through and in researching authors and their sites I found ALA (multiple times). Since adding the RSS feed to my collection (another shock – having loads of information thrown at me when it’s ready, for me to read when I’m ready) I’ve read the recent articles and learned something from every one. I’ve wanted to dive into the archives but didn’t know where to start so this article has come just in time for me. I’ll be sure to read all the suggested articles. While I’m mostly a “programmer” my boyfriend is a designer and I like to understand what he’s talking about, and in general to build my knowledge across all areas. I hope that if I know what everyone elses roles and aims are that I can do my work to best help them. So far the articles here have helped with that exactly. Thank you so much.

  2. Although not that interesting to familiar readers, it’s a nice write-up, which I think really helps newbies.

    Perhaps it’s a good idea to keep a link to this article on your homepage in the future?

  3. Don’t forget this excellent article on proper typesetting for the web: “The Trouble With EM ‘n EN (and Other Shady Characters)”:http://alistapart.com/stories/emen/ . Many people use foot marks ‘ and inches symbols ” to specify speech marks, hyphens instead of en dashes and three full stops … instead of ellipses. Here’s a quick ref table, (minus the spaces between the characters “& #”):

    — em dash & #8212;
    – en dash & #8211;
    … Ellipsis & #8230;
    ‘ for an opening single quote & #8216;
    ’ for a closing single quote & #8217;
    “ for an opening double quote & #8220;
    ” for a closing double quote & #8221;

  4. On the preview, it came out so well. Let’s try again:

    — — em dash

    — – en dash

    “¦ … Ellipsis

    “˜ ‘ for an opening single quote

    ‘ ’ for a closing single quote

    ” “ for an opening double quote

    “? ” for a closing double quote

  5. I was pleased to see that “slash forward”:http://alistapart.com/articles/slashforward/ was one of the articles recommended by this primer guide. This has long been one of my favourite articles, being more of a server-side coder myself. However, I question whether the trailing slash is really as important today as it was when the article was written.

    _A List Apart_ itself hasn’t used trailing slashes (in many places) since the launch of “ALA 4.0”:http://www.alistapart.com/articles/ala40/ – something that I assume is due to its dependence on the “Ruby on Rails”:http://rubyonrails.org/ platform, which isn’t a big fan of the trailing slash. For RoR (and several other CMSes and web frameworks), using trailing slashes means _more_ work, rather than _less_. This removes the claimed ‘technical advantages’ of using the trailing slash.

    Anyway, as with all the articles listed in this guide, it’s a good read nonetheless. Overall, a very nice selection!

  6. Read it for the first time a few days ago. Learnt so much from it. In my excitement missed it in your article! It’s such a brilliant read.

    Something I wonder about too Jeremy. With dynamic sites, most of the time you’re not accessing directories, your requests are funneled through a processor. Seems more useful for non-dymanic sites.

  7. Excellent article. I’ve been reading ALA for about 6 months now and I have only seen about half of the articles mentioned in this one. I look forward to a afternoon of “work research” while i read through some of these.

  8. Where is the focus? The here and now reality of what we should aim to achieve”¦ wipe the slate clean and in simple terms map out the techniques, the version numbers and best practice policies for intermediate enthusiasts to follow. And let us not pander to the pretensions of the orbiting geeks; a straight line guide, plumb for best result not purity nor political correctness.

  9. To all at ALA, thank you for providing such good information regarding all aspects of the web. I enjoy your articles because they are fun, they are well written and I always learn something.
    It’s amazing how we’ve all progressed in the last few years 🙂

  10. As always ALA again puts out great free information worth reading I am so glad that you have this blog up and running and do not charge for reading the posts.Can not wait to put this article to work!

  11. In the page layout and design section the last line reads “For those of us who err on the side of obsessive compulsive, is was a good thing.”

    I think you meant to say “..this was a good thing.”

  12. I am a graphic designer that has been trying to break into web. When I do something I like to do it the “right” way so consequently before I wanted to delve too deeply into designing websites I wanted to do some serious reading to make sure I am in the right place. I have read various articles on ALA and been to a few conferences picking up bits and pieces here and there. But this article is exactly what I was looking for. I considered started with the ALA archives and reading from oldest to newest but I wasn’t sure what information would be outdated by now.

    As far as everyone’s request to make it into a book, I agree. But I am not very patient so I printed it myself. I printed the initial article along with all of the recommended reading – its comes to 148 pages if anyone is curious. So looks like I have got a lot of reading to do.

    Thank you.

Got something to say?

We have turned off comments, but you can see what folks had to say before we did so.

More from ALA